直播网站程序源码，Flutter：列表布局摘要

直播网站程序源码，Flutter：列表布局摘要

方式1(推荐，适用大量item，动态创建item)：

 

1

<br>ListView.builder( //列表布局<br>  scrollDirection: Axis.vertical,  //(默认)vertical垂直排列，horizontal水平排列<br>  itemCount: 总个数,               //item总个数<br>  itemExtent: 高度值,             //item高度(vertical)或宽度(horizontal)<br>  itemBuilder: (BuildContext context, int index) { //列表滚动到index位置时，才构建此item<br>    return item布局;<br>  }<br>)

​

方式2(效果同方式2，item间添加分割线)：

 

1

<br>ListView.separated( //列表布局<br>  ... //省略其他相同属性<br>  itemCount: 总个数,               //item总个数<br>  itemBuilder: (BuildContext context, int index) { //列表滚动到index位置时，才构建此item<br>    return item布局;<br>  }<br>  separatorBuilder: (BuildContext context, int index) { //分割器构造器<br>    return Divider(color: Colors.black);  //Divider为分割线<br>  }<br>}

 

方式3(适用少量item)：

 

1

<br>ListView( //列表布局<br>  scrollDirection: Axis.vertical,  //(默认)vertical垂直排列，horizontal水平排列<br>  itemExtent: 高度值,              //item高度(vertical)或宽度(horizontal)<br>//prototypeItem: 高度值,           //效果等同itemExtent，与itemExtent互斥<br>  shrinkWrap: false,               //true时累加item总长度并设置ListView长度，(默认)false占用最大空间<br>  children: <Widget>[              //item布局列表，提前将所有item构建好<br>    ...<br>  ]<br>)

 

 以上就是直播网站程序源码，Flutter：列表布局摘要， 更多内容欢迎关注之后的文章