Flutter List View

Mercy Jemosop
2 min readAug 20, 2021

--

Display List Tile items in a List View and list view builder in flutter

Introduction

List View class is a scroll-able list of widgets arranged linearly.It displays its children one after another in the scroll direction.

List view constructors

  • The default constructor takes an explicit List<Widget> of children. This constructor is appropriate for list views with a small number of children because constructing the List requires doing work for every child that could possibly be displayed in the list view instead of just those children that are actually visible.
  • The ListView.builder constructor takes an IndexedWidgetBuilder, which builds the children on demand. This constructor is appropriate for list views with a large (or infinite) number of children because the builder is called only for those children that are actually visible.

List Tile class is a single fixed-height row that typically contains some text as well as a leading or trailing icon. It contains one to three lines of text optionally flanked by icons or other widgets, leading and trailing parameters define icons (or other widgets) for the tile.

Let’s see an example

The above code contains a lot of repeated code let’s do some refactor to the code.

yes this is makes your code easy to read if you have many items to display.

N.B List View and List Tile are two classes.

If you working with a large number of data as you can see in the above example it will be so tedious adding all that code for every item. The list view class has a constructor called list view builder, this constructor creates a scrollable, linear array of widgets that are created on demand.

List view builder

This constructor is a appropriate with large and infinite children. It takes an IndexedWidgetBuilder, which builds the children on demand.

It is as easy as that. if you need a more challenging example here is a tutorial of retrieving medium blogs and displaying in your flutter app using list view builder.

HAPPY CODING!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

--

--

Mercy Jemosop
Mercy Jemosop

Written by Mercy Jemosop

Software Developer. I am open to job referrals. connect with me on twitter @kipyegon_mercy

No responses yet