The ListTile widget in Flutter is used to create a single fixed-height row that typically contains some text, an icon, and other optional elements like a leading or trailing widget. It's commonly used within a ListView to represent individual items in a list.
Attributes and Properties:
leading(Widget):
- A widget to be placed at the start of the tile. Typically an Icon or CircleAvatar.
title(Widget):
- The primary line of content in the tile, often a Text widget.
subtitle(Widget):
- An additional line of content below the title, often a smaller font size for additional details.
trailing(Widget):
- A widget to be placed at the end of the tile. It could be an Icon, Button, or any other widget.
isThreeLine(bool):
- If true, the tile will be rendered with three lines of text instead of the default two.
dense(bool):
- If true, reduces the height of the ListTile. Useful in more compact lists.
contentPadding(EdgeInsets):
- Padding around the contents of the tile, including the leading, title, subtitle, and trailing.
enabled(bool):
- If false, the tile will be displayed in a disabled state, and interactions will be disabled.
selected(bool):
- If true, the tile will be rendered with the theme's selection highlight.
onTap(GestureTapCallback):
- Callback function invoked when the tile is tapped.
onLongPress(GestureLongPressCallback):
- Callback function invoked when the tile is long-pressed.
shape(ShapeBorder):
- Defines the shape of the tile. It can be used to add borders or customize the appearance.
Example:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('ListTile Example'),
),
body: ListView(
children: <Widget>[
ListTile(
leading: Icon(Icons.star),
title: Text('List Item 1'),
subtitle: Text('Subtitle for Item 1'),
trailing: Icon(Icons.arrow_forward),
onTap: () {
// Handle item tap
},
),
ListTile(
leading: Icon(Icons.star),
title: Text('List Item 2'),
subtitle: Text('Subtitle for Item 2'),
trailing: Icon(Icons.arrow_forward),
onTap: () {
// Handle item tap
},
),
// Add more ListTiles as needed
],
),
);
}
}
ย