-
Notifications
You must be signed in to change notification settings - Fork 0
ListTile Button
FrenkyDema edited this page Aug 29, 2024
·
1 revision
The ListTile Button
is a customizable widget that allows you to create interactive list tiles with a variety of configurable elements, including leading icons, titles, subtitles, and trailing widgets. It's ideal for use in lists, forms, or any other place where you need a button-like tile.
ListTileButton({
Key? key,
Widget? leading,
required Widget body,
Widget? subtitle,
Widget? trailing,
void Function()? onPressed,
EdgeInsetsGeometry? padding,
double borderRadius,
VisualDensity? visualDensity,
Color? backgroundColor,
})
Property | Type | Description |
---|---|---|
leading |
Widget? |
The leading widget, usually an icon or avatar, displayed at the start of the tile. |
body |
Widget |
The main content of the tile, typically a Text widget. |
subtitle |
Widget? |
A secondary line of text or widget displayed below the body . |
trailing |
Widget? |
The widget displayed at the end of the tile, often an icon or button. |
onPressed |
void Function()? |
The callback function that gets triggered when the tile is tapped. |
padding |
EdgeInsetsGeometry? |
Padding inside the tile, allowing you to adjust the spacing between the tile's content and its edges. |
borderRadius |
double |
The border radius of the tile, which controls the roundness of the tile's corners. |
visualDensity |
VisualDensity? |
Defines how compact the tile layout is, affecting the spacing between elements. |
backgroundColor |
Color? |
The background color of the tile. |
Here’s a basic example of how to use the ListTile Button
in your Flutter app:
ListTileButton(
leading: Icon(Icons.person),
body: Text('John Doe'),
subtitle: Text('Developer'),
trailing: Icon(Icons.arrow_forward),
onPressed: () {
print('ListTile pressed!');
},
);
ListTileButton(
leading: Icon(Icons.email),
body: Text('Send Email'),
backgroundColor: Colors.blue[50],
onPressed: () {
print('Email Tile pressed!');
},
);
- Leading Widget: Use an icon, avatar, or any custom widget as the leading element to represent the content visually.
- Trailing Widget: The trailing widget is often used for navigation indicators like arrows or status indicators like checkmarks.
-
Visual Density: Adjust the
visualDensity
property to make the tile more or less compact, depending on your design needs. -
Border Radius: Customize the
borderRadius
to make the tile corners rounded for a softer look.
-
Profile List: Use the
ListTile Button
to create a list of user profiles with avatars and names. - Settings Menu: Perfect for creating a settings menu where each option is represented as a tappable tile.
- Navigation: Use in side drawers or navigation panels to represent different sections or screens of the app.