Flutter:ListView.separated的使用

Flutter控件:ListView的使用

1：源代码

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() {----->主函数，程序的入口，和ActivityThread的main方法一样
   runApp(MyListView());
}
class MyListView extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}//定义自定义的控件
class _MyAppState extends State<MyListView> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
     Widget redDivider =  new Divider(color: Colors.red, indent: 20,);
     Widget greenDivider = new Divider(color: Colors.green, indent: 30,);//分割线，第一个属性是颜色，第二个属性是缩进
     return MaterialApp(
         home:Scaffold(
             body: Scrollbar(
               child: Center(
                 child: ListView.separated(
                     itemCount: 30,//列表item的个数
                     separatorBuilder: (BuildContext context, int index){
                        return index % 2 == 0 ? redDivider : greenDivider;
                     },//根据奇偶数进行设置不同的分割线
                     itemBuilder: (BuildContext context, int index) {
                         return ListTile(title:
                         new Text("i am list index $index", style:
                         new TextStyle(fontSize:  24, color: Colors.blue),));
                     },//文本的样式，一般使用TextStyle表示
                 ),
               ),
             ),
         ),
     );
  }
}

2：最新的效果图

58EDD766-7A8C-439a-BE9A-68D72FFBCC7B.png