شرح استخدام ويدجت ListTile في فلاتر

ListTile(
  title: Text('Title Text'),
)

ListTile(
  title: Text('Title Text'),
  subtitle: Text('Subtitle Text'),
)

ListTile(
  title: Text('Title Text'),
  leading: CircleAvatar(
    child: Icon(Icons.person),
  ),
)

ListTile(
  title: Text('Title Text'),
  trailing: Icon(Icons.arrow_forward),
)

ListTile(
  title: Text('Title Text'),
  onTap: () {
    // do something
  },
)

ListTile(
  title: Text('Title Text'),
  selected: true,
)

ListTile(
  title: Text('Title Text'),
  enabled: false,
)

ListTile(
  title: Text('Title Text'),
  contentPadding: EdgeInsets.symmetric(vertical: 20, horizontal: 10),
)

ListTile(
  title: Text('Title Text'),
  dense: true,
)

ListTile(
  title: Text('Title Text'),
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.circular(10),
    side: BorderSide(color: Colors.grey),
  ),
)

ListTile(
  title: Text('Title Text'),
  tileColor: Colors.grey[200],
)

ListTile(
  title: Text('Title Text'),
  selectedTileColor: Colors.blue[100],
  selected: true,
)

ListTile(
  title: Text('Title Text'),
  focusColor: Colors.green[100],
)

ListTile(
  title: Text('Title Text'),
  hoverColor: Colors.yellow[100],
)

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'ListTile Example',
      home: Scaffold(
        appBar: AppBar(
          title: const Text('ListTile Example'),
        ),
        body: ListView(
          children: [
            const ListTile(
              leading: Icon(Icons.person),
              title: Text('John Doe'),
              subtitle: Text('johndoe@gmail.com'),
              trailing: Icon(Icons.arrow_forward),
            ),
            const ListTile(
              leading: Icon(Icons.person),
              title: Text('Jane Smith'),
              subtitle: Text('janesmith@gmail.com'),
              trailing: Icon(Icons.arrow_forward),
            ),
            const ListTile(
              leading: Icon(Icons.person),
              title: Text('Bob Johnson'),
              subtitle: Text('bobjohnson@gmail.com'),
              trailing: Icon(Icons.arrow_forward),
            ),
          ],
        ),
      ),
    );
  }
}

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  final List<Contact> contacts = [
    Contact('John Doe', 'johndoe@gmail.com', '1234567890'),
    Contact('Jane Smith', 'janesmith@gmail.com', '0987654321'),
    Contact('Bob Johnson', 'bobjohnson@gmail.com', '5555555555'),
  ];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'ListTile Example2',
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Contacts'),
        ),
        body: ListView.builder(
          itemCount: contacts.length,
          itemBuilder: (BuildContext context, int index) {
            return ListTile(
              leading: CircleAvatar(
                child: Text(contacts[index].name[0]),
              ),
              title: Text(contacts[index].name),
              subtitle: Text(contacts[index].email),
              trailing: const Icon(Icons.call),
              onTap: () => _showContactDialog(context, contacts[index]),
            );
          },
        ),
      ),
    );
  }

  void _showContactDialog(BuildContext context, Contact contact) {
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return AlertDialog(
          title: Text(contact.name),
          content: Column(
            mainAxisSize: MainAxisSize.min,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(contact.email),
              const SizedBox(height: 10),
              Text(contact.phone),
            ],
          ),
          actions: [
            TextButton(
              onPressed: () => Navigator.pop(context),
              child: const Text('Close'),
            ),
          ],
        );
      },
    );
  }
}

class Contact {
  final String name;
  final String email;
  final String phone;

  Contact(this.name, this.email, this.phone);
}