flutter study notes-listview

1. Ordinary listview

This constructor is suitable for list views with a small number of child elements, because constructing the list requires performing work for every child element that might appear in the list view, not just those that are actually visible.

ListView({
    
    
    Key key,
    Axis scrollDirection = Axis.vertical,
    bool reverse = false,
    ScrollController controller,
    bool primary,
    ScrollPhysics physics,
    bool shrinkWrap = false,
    EdgeInsetsGeometry padding,
    this.itemExtent,
    bool addAutomaticKeepAlives = true,
    bool addRepaintBoundaries = true,
    bool addSemanticIndexes = true,
    double cacheExtent,
    List<Widget> children = const <Widget>[],
    int semanticChildCount,
    DragStartBehavior dragStartBehavior = DragStartBehavior.start,
  })

This constructor is suitable for list views with a small number of child elements, because constructing the list requires performing work for every child element that might be displayed in the list view, not just those that are actually visible.

Axis scrollDirection = Axis.vertical,//设置滑动方向

bool reverse = false,//是否倒序显示,默认正序

ScrollController controller,//滑动监听,我们多用于上拉加载更多,通过监听滑动的距离来执行操作。

bool primary,//如果[primary]参数为true,则[controller]必须为null。如果内容不足,则用户无法滚动,而如果primary为true,它们总是可以尝试滚动。在构造中默认是false 它的意思就是为主的意思,primary为true时,我们的controller 滑动监听就不能使用了

this.itemExtent,//确定每一个item的高度,会让item加载更加高效

shrinkWrap特别推荐child 高度会适配 item填充的内容的高度,我们非常的不希望child的高度固定,因为这样的话,如果里面的内容超出就会造成布局的溢出。shrinkWrap多用于嵌套listView中 内容大小不确定 比如 垂直布局中 先后放入文字 listView (需要Expend包裹否则无法显示无穷大高度 但是需要确定listview高度 shrinkWrap使用内容适配不会有这样的影响)

physics这个属性几个滑动的选择 
AlwaysScrollableScrollPhysics() 总是可以滑动
NeverScrollableScrollPhysics禁止滚动
BouncingScrollPhysics 内容超过一屏 上拉有回弹效果
ClampingScrollPhysics 包裹内容 不会有回弹

Two, ListView.builder

This constructor is suitable for list views with a large number of subviews, since the builder is only called on those subviews that are actually visible.

ListView.builder({
    
    
    Key key,
    Axis scrollDirection = Axis.vertical,//设置滑动方向
    bool reverse = false,//是否倒序显示,默认正序
    ScrollController controller,//滑动监听,我们多用于上拉加载更多,通过监听滑动的距离来执行操作。
    bool primary,//如果[primary]参数为true,则[controller]必须为null。如果内容不足,则用户无法滚动,而如果primary为true,它们总是可以尝试滚动。在构造中默认是false 它的意思就是为主的意思,primary为true时,我们的controller 滑动监听就不能使用了
    ScrollPhysics physics,
    bool shrinkWrap = false,
    EdgeInsetsGeometry padding,
    this.itemExtent,//确定每一个item的高度,会让item加载更加高效
    @required IndexedWidgetBuilder itemBuilder,
    int itemCount,
    bool addAutomaticKeepAlives = true,
    bool addRepaintBoundaries = true,
    bool addSemanticIndexes = true,
    double cacheExtent,//设置预加载的区域
    int semanticChildCount,
    DragStartBehavior dragStartBehavior = DragStartBehavior.start,
  })

This constructor is suitable for list views with large (or infinite) subviews, since the builder is only called on those subviews that are actually visible.

三、ListView.separated

This constructor can construct separators between subitems as needed. Used for list views with a fixed number of child controls.

ListView.separated({
    
    
    Key key,
    Axis scrollDirection = Axis.vertical,
    bool reverse = false,
    ScrollController controller,
    bool primary,
    ScrollPhysics physics,
    bool shrinkWrap = false,
    EdgeInsetsGeometry padding,
    @required IndexedWidgetBuilder itemBuilder,
    @required IndexedWidgetBuilder separatorBuilder,
    @required int itemCount,
    bool addAutomaticKeepAlives = true,
    bool addRepaintBoundaries = true,
    bool addSemanticIndexes = true,
    double cacheExtent,
  })

四、ListView.custom

This constructor provides the ability to customize other aspects of the submodel. For example, the SliverChildDelegate can control the algorithm used to estimate the size of children that are not actually visible.

ListView.custom({
    
    
    Key key,
    Axis scrollDirection = Axis.vertical,
    bool reverse = false,
    ScrollController controller,
    bool primary,
    ScrollPhysics physics,
    bool shrinkWrap = false,
    EdgeInsetsGeometry padding,
    this.itemExtent,
    @required this.childrenDelegate,
    double cacheExtent,
    int semanticChildCount,
  })

Example of use

 ListView.custom(childrenDelegate: SliverChildBuilderDelegate((BuildContext context, int index) {
    
    
          return Container();
        }, childCount: items.length,findChildIndexCallback: (Key key){
    
    
          final ValueKey valueKey = key;
          final String data = valueKey.value;
          return items.indexOf(data);
        }),),

5. Matters needing attention

In the process of developing projects, the listview control is often used. I think the attribute shrinkWrap should be paid more attention to.
This should be set according to the business content, otherwise it is easy to fall into the pit. If this property is set to true, then the preloading function of this listview will be invalid.

Guess you like

Origin blog.csdn.net/hjjdehao/article/details/108682822