Flutter: Differences between SliverList and SliverFixedExtentList

user_11067496 0
Viewed 616

What are the differences between SliverList and SliverFixedExtentList in Flutter?

According to the documentation of each widget:

  • SliverList: "A sliver that places multiple box children in a linear array along the main axis."
  • SliverFixedExtentList: "A sliver that places multiple box children with the same main axis extent in a linear array."

It seems that we should use SliverFixedExtentList over SliverList if all children have the same main axis extent. However, what does "same main axis extent" really mean?

flutter-sliver flutter-layout flutter
1 Answers

It means all children have the same height. If you are familiar with ListView, it has itemExtent property that does the same thing.

Essentially, if you cannot guarantee all list items will have "equal size on the main axis" (e.g. equal height on a vertical scrolling list, or equal width on a horizontal scrolling list), then we cannot know the "exact size" of each item in the list, until we load it. However, if you can guarantee that they will all have the same size, for example, 100 units in height, then we don't need to load each item to measure its size.

Knowing item size before loading them is very useful when you want to jump a large distance. For example, if you want to scroll 10,000 px down, and if we know each item is fixed at 200 px tall, then we can easily jump 50 items, just load the 51th item and display it. If we don't know that (if you cannot guarantee that) then we will have to literally lay out all items in-between to see where 10,000 px will land us.

user_10326130
Related