ListTile with Navigation

 import "package:flutter/material.dart";

void main()
{
  runApp(const MyApp());
}
class MyApp extends StatelessWidget
{
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "ListTile with Navigation",
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.grey,
      ),
      home: ListTileNavigation(),
    );
  }
}
class ListTileNavigation extends StatelessWidget
{
  static List<String> titleNames = ["Vitthal bhagwan", "Sun", "Eye", "Flowers",
  "Jungle", "Bike", "Spider man", "Car", "Bird", "Flag"];

  static List url = [
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWMOSibFZYE1SaehKfERueVGBkdZrxb_ozyA&usqp=CAU",
    "https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/109c592d-0417-4580-9e8c-bf6978d45bdc/"
        "dbimtmy-0dbe1143-9aca-45a6-aa5b-4a048b531b20.png/v1/fill/w_400,h_396/star_explosion_01_by"
        "_astoko_dbimtmy-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YX"
        "BwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0Mz"
        "czYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9Mzk2IiwicGF0aCI6IlwvZlwvMTA5YzU5MmQtMDQx"
        "Ny00NTgwLTllOGMtYmY2OTc4ZDQ1YmRjXC9kYmltdG15LTBkYmUxMTQzLTlhY2EtNDVhNi1hYTViLTRhMDQ4YjUzMWIyMC"
        "5wbmciLCJ3aWR0aCI6Ijw9NDAwIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmltYWdlLm9wZXJhdGlvbnMiXX0.JbhyJf"
        "nh9CoeRwbXZC1yY8-AlSowYTYCM7_VJdu-F-o",
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQYKlHeLBa4dep3h8gYvOMGera21E0KhLV0FQ&usqp=CAU",
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTACIV6pvL0f4Anp1b8F3fVwX34fxpKvWFXZg&usqp=CAU",
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQXFSbQ2O59rvn-C9DwWysXQOwKiZ8hbEHHJQ&usqp=CAU",
    "https://i0.wp.com/sreditingzone.com/wp-content/uploads/2018/01/PNGPIX-COM-BMW-R1200R-Motorcycle"
        "-Bike-PNG-Image.png?resize=780%2C470&ssl=1",
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR2DFaZDNaNzAGh3L_CgVoIy-vzuiFqPLJvYjgOLgCiB"
        "pPIdqONSa1-90FrbD9S_1Cf_48&usqp=CAU",
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS_Um1n_zfS_WfHjaFcqeMxs51ax3aDEaqECah6"
        "-3BBSb5MH8gSdYkDVtREKcLvVP93NHY&usqp=CAU",
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQjQw7dXzjoBKfjxDFXbSt4LfPvF_0Huace1Q&usqp=CAU",
    "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRB81OmaJ23lHLvwEYXFp7QcptYNpQi-7TdTg&usqp=CAU"
  ];

  final List<DataModel> pictureData = List.generate(
    titleNames.length,
      (index) {
      return DataModel("${titleNames[index]}", "${url[index]}", "${titleNames[index]}");
      },
  );

  ListTileNavigation({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Pass Data from ListView to next Screen"),
        centerTitle: true,
        backgroundColor: Colors.grey,
      ),
      body: ListView.builder(
        itemCount: pictureData.length,
        itemBuilder: (context, index) {
          return Card(
            child: SizedBox(
              height: 100.0,
              child: ListTile(
                leading: SizedBox(
                  width: 100.0,
                  height: 200.0,
                  child: Image.network(pictureData[index].imageUrl),
                ),
                title: Text(pictureData[index].name, style: const TextStyle(fontWeight: FontWeight.bold),),
                subtitle: Text(pictureData[index].name),
                trailing: const Icon(Icons.keyboard_arrow_right),
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) {
                        return PictureDetail(pictureDataModel: pictureData[index]);
                      },
                    ),
                  );
                },
              ),
            ),
          );
        },
      ),
    );
  }
}
class DataModel
{
  final String name, imageUrl, description;
  const DataModel(this.name, this.imageUrl, this.description);
}

class PictureDetail extends StatelessWidget
{
  final DataModel pictureDataModel;
  const PictureDetail({super.key, required this.pictureDataModel});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(pictureDataModel.name),
        centerTitle: true,
        backgroundColor: Colors.grey,
      ),
      body: SingleChildScrollView(
        child: Center(
          child: Column(
            children: [
              Image.network(pictureDataModel.imageUrl),
              const SizedBox(height: 30.0),
              Text(pictureDataModel.description,
                style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 30.0),),
            ],
          ),
        ),
      ),
    );
  }
}