Labs ICT
โญ Pro Login

Lists and Scrolling

Displaying collections of data.

Lists in Flutter

ListView.builder creates scrollable lists efficiently. ListTile provides a standard list item layout. ListView.separated adds dividers between items. You can also make horizontal scrolling lists.

ListView.builder(
  itemCount: 10,
  itemBuilder: (context, index) {
    return ListTile(
      leading: Icon(Icons.star),
      title: Text('Item $index'),
      subtitle: Text('Description'),
    );
  },
)

ListView.separated(
  itemCount: 5,
  itemBuilder: (context, index) {
    return ListTile(title: Text('Item $index'));
  },
  separatorBuilder: (context, index) {
    return Divider();
  },
)

SingleChildScrollView(
  scrollDirection: Axis.horizontal,
  child: Row(
    children: [
      Container(width: 100, height: 100, color: Colors.red),
      Container(width: 100, height: 100, color: Colors.blue),
      Container(width: 100, height: 100, color: Colors.green),
    ],
  ),
)
Try it Yourself ->

๐Ÿงช Quick Quiz

What is ListTile?