flutter中通过循环渲染组件

直接贴代码：

 1 import 'package:flutter/material.dart';
 2 
 3 class Example extends StatefulWidget {
 4     @override
 5     _ExampleState createState() => _ExampleState();
 6 }
 7 
 8 class _ExampleState extends State<ExamplePage> {
 9     List formList;
10     initState() {
11       super.initState();
12         formList = [
13             {"title": '车牌号'},
14             {"title": '所有人'},
15             {"title": '号牌颜色'},
16         ];
17     }
18      Widget buildGrid() {
19             List<Widget> tiles = [];//先建一个数组用于存放循环生成的widget
20             Widget content; //单独一个widget组件，用于返回需要生成的内容widget
21             for(var item in formList) {
22                 tiles.add(
23                     new Row(
24                        children: <Widget>[
25                          new Text(item['title'])
26                        ]
27                     )
28                 );
29             }
30             content = new Column(
31                 children: tiles //重点在这里，因为用编辑器写Column生成的children后面会跟一个<Widget>[]，
32                 //此时如果我们直接把生成的tiles放在<Widget>[]中是会报一个类型不匹配的错误，把<Widget>[]删了就可以了
33             );
34             return content;
35         }
36       Widget ExampleWidget = buildGrid();
37     @override
38     Widget build(BuildContext context) {
39         return Scaffold(
40             key: scaffoldKey,
41             appBar: AppBar(
42                 title: Text('循环渲染组件案例'),
43             ),
44             body: new Center(
45                 child: ExampleWidget
46             )
47         );
48     }
49 }

 

转载于:https://www.cnblogs.com/pjl43/p/9427647.html