Flutter基础控件:ListView、ListTile、Scrollbar

属性

scrollDirection

滑动的方向。默认Axis.vertical为垂直方向滑动,Axis.horizontal 为水平方向

reverse

翻转 默认为false滑动开始方向在“头”, reverse为true时,那么滑动方向开始在“尾”。

controller

ScrollController widget

primary

是否使用主题色

physics

滑动到底部回弹效果 ,默认情况不赋值会根据平台特点来显示
NeverScrollableScrollPhysics()禁止滚动
AlwaysScrollableScrollPhysics()允许滚动
ClampingScrollPhysics()Android下微光效果
BouncingScrollPhysics()iOS下弹性效果

shrinkWrap

该属性将决定列表的长度是否仅包裹其内容的长度。当ListView嵌在一个无限长的容器组件中时(例如listview嵌套listview),被嵌套的shrinkWrap必须为true,否则Flutter会给出警告

padding

控制children布局
当child为空的时候,会产生一个宽为left+right,高为top+bottom的区域;
当child不为空的时候,Padding会将布局约束传递给child,根据设置的padding属性,缩小child的布局尺寸。然后Padding将自己调整到child设置了padding属性的尺寸,在child周围创建空白区域。

itemExtent

强制设置cell的高度,相对不设置会高效

addAutomaticKeepAlives

是否将列表项(children Widget)包裹在AutomaticKeepAlive widget中,典型的,在一个懒加载列表中,如果列表项包裹在AutomaticKeepAlive中,列表项移出视口时该列表项不会GC,会使用KeepAliveNotification来保存其状态。如果列表项自己维护KeepAlive状态,则此项为false。

addRepaintBoundaries

是否将列表项(子Widget)包裹在RepaintBoundary中。将列表项包裹在RepaintBoundary中可以避免在滚动的时候重绘,但重绘开销非常小的时候,不添加RepaintBoundary反而会高效。

addSemanticIndexes

否把子控件包装在IndexedSemantics里,用来提供无障碍语义

cacheExtent

设置cell缓存高度

children

子节点数组,相当于Cell

semanticChildCount

未知

dragStartBehavior

确定处理拖动开始行为的方式 默认为DragStartBehavior.start

class ListViewContnet extends StatelessWidget {
  const ListViewContnet({Key key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scrollbar(//Scrollbar自动添加滚动条
        child: new ListView(
      reverse: true,
      physics: AlwaysScrollableScrollPhysics(),
      itemExtent: 100,
      children: <Widget>[
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
        ListTile(title: Text(TITLE)),
      ],
    ));
  }
}

方法

  • ListView:创建不带分割线的cell
  • ListView.separated:创建带分割线cell 可以自定义复杂的分割线
  • ListView.custom:构造需要SliverChildDelegate提供自定义子项的其他方面的能力。例如,SliverChildDelegate可以控制用于估计实际上不可见的子项大小的算法。
  • ListView.builder:长列表时采用builder模式,能提高性能。不是把所有子控件都构造出来,而是在控件viewport加上头尾的cacheExtent这个范围内的子Item才会被构造。在构造时传递一个builder,按需加载是一个惯用模式,能提高加载性能。

ListTile

const ListTile({
    Key key,
    this.leading,              // item 前置图标
    this.title,                // item 标题
    this.subtitle,             // item 副标题
    this.trailing,             // item 后置图标
    this.isThreeLine = false,  // item 是否三行显示
    this.dense,                // item 直观感受是整体大小
    this.contentPadding,       // item 内容内边距
    this.enabled = true,
    this.onTap,                // item onTap 点击事件
    this.onLongPress,          // item onLongPress 长按事件
    this.selected = false,     // item 是否选中状态
})
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值