Flutter 列表组件ListView 网格布局组件GridView

目录

一 列表布局ListView

二 GridView网格布局组件

一 列表布局 ListView

动态列表实现

1.  
   void main(List<String> args) {
2.  
   runApp(MaterialApp(
3.  
   home: Scaffold(
4.  
   appBar: AppBar(title: Text("title")),
5.  
   body: MyApp(),
6.  
   ),
7.  
   ));
8.  
   }

1.  
   class MyApp extends StatelessWidget {
2.  
   List list = [];
3.  
   MyApp({super.key}) {
4.  
   print(listData);
5.  
   for (var i = 0; i < 20; i ) {
6.  
   list.add("我是第${i}条数据");
7.  
   }
8.  
   }
9.  
   @override
10.  
    Widget build(BuildContext context) {
11.  
    return ListView.builder(
12.  
    itemCount: list.length,
13.  
    itemBuilder: (context, index){
14.  
    return ListTile(
15.  
    title: Text("${list[index]}"),
16.  
    );
17.  
    },);
18.  
    }
19.  
    }

二 GridView网格布局组件

当让可以滚动的元素使用矩阵方式排列的时 候。此时我们可以用网格列表组件GridView实现布局。 GridView创建网格列表主要有下面三种方式

这篇好文章是转载于：学新通技术网