Home > other >  Which should I use, ListView.builder or Column?
Which should I use, ListView.builder or Column?

Time:01-29

We can use ListView.builder for lists. However, I found another way using Column.

Here are two sample codes:

ListView.builder

List list = ["A", "B", "C"];

…

ListView.builder(
  itemCount: list.length,
  itemBuilder: (context, index) => Text(list[index]),
),

Column

List list = ["A", "B", "C"];

…

Column(children: list.map((element) => Text(element)).toList())

So, my question is, which code should I use?

Feel free to leave a comment if you need more information.

CodePudding user response:

ListView.builder is useful when you have a large number of items that can change dynamically, as it only builds the children that are currently visible. It also allows you to easily scroll through the list of items.

Column, on the other hand, is a layout widget that arranges its children vertically. It's useful when you have a small number of children that you want to stack vertically and the height of the children is known.

Here are a few guidelines to help you decide:

  • If you have a large number of items that can change dynamically and you want to allow the user to scroll through them, use ListView.builder.
  • If you have a small number of items that you want to stack vertically and the height of the children is known, use Column.
  • If you want to build a list of items with a fixed number of children and you want to stack them vertically, you can use Column with ListView as child. It's also possible to use both ListView.builder and Column together, depending on the requirement.

It's always best to experiment with both and decide which one works best for your specific layout and use case.

CodePudding user response:

Use base on you need.

Short answer:

Use ListView.builder when you have a long list. the ListView.builder constructor creates items as they are scrolled onto the screen. And for ListView it needs cross axis shrink wrap behavior. Means, child width is equal to screen size width.

You can read this documentation: https://docs.flutter.dev/cookbook/lists/long-lists


Of course they are different. Column doesn't support scroll function. Then you need to wrap with SingleChildScrollView but also there are some pros and cons.

Also I recommend my article here where I explain more about it: https://medium.com/easyread/my-october-flutter-notes-2-6e0c78cf2e56

  • Related