The ListTile widget in Flutter is a versatile and commonly used widget that allows you to create a row containing a title, subtitle, leading, trailing, and an on-tap action. It's perfect for creating items in a list view, making it easy to add rich, complex lists to your apps.
Hereβs a basic example of how to use ListTile:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Flutter ListTile Example'),
),
body: ListView(
children: [
ListTile(
leading: Icon(Icons.account_circle),
title: Text('John Doe'),
subtitle: Text('Software Engineer'),
trailing: Icon(Icons.more_vert),
onTap: () {
// Action when tapped
print('Tapped on John Doe');
},
),
ListTile(
leading: Icon(Icons.account_circle),
title: Text('Jane Smith'),
subtitle: Text('Product Manager'),
trailing: Icon(Icons.more_vert),
onTap: () {
// Action when tapped
print('Tapped on Jane Smith');
},
),
],
),
),
);
}
}
Breakdown of ListTile properties:
- leading: A widget to display before the title, typically an icon or an avatar.
- title: The main text of the tile, often the name or primary information.
- subtitle: Additional information under the title, usually a description or secondary text.
- trailing: A widget to display after the title, often used for actions like buttons or icons.
- onTap: A callback function that is called when the tile is tapped.
Top comments (0)