美文网首页flutter
flutter 中循环渲染组件

flutter 中循环渲染组件

作者: charmingcheng | 来源:发表于2019-04-12 16:01 被阅读0次
import 'package:flutter/material.dart';

class Example extends StatefulWidget {
    @override
    _ExampleState createState() => _ExampleState();
}

class _ExampleState extends State<ExamplePage> {
    List formList;
    initState() {
      super.initState();
        formList = [
            {"title": '车牌号'},
            {"title": '所有人'},
            {"title": '号牌颜色'},
        ];
    }
     Widget buildGrid() {
            List<Widget> tiles = [];//先建一个数组用于存放循环生成的widget
            Widget content; //单独一个widget组件,用于返回需要生成的内容widget
            for(var item in formList) {
                tiles.add(
                    new Row(
                       children: <Widget>[
                         new Text(item['title'])
                       ]
                    )
                );
            }
            content = new Column(
                children: tiles //重点在这里,因为用编辑器写Column生成的children后面会跟一个<Widget>[],
                //此时如果我们直接把生成的tiles放在<Widget>[]中是会报一个类型不匹配的错误,把<Widget>[]删了就可以了
            );
            return content;
        }
      Widget ExampleWidget = buildGrid();
    @override
    Widget build(BuildContext context) {
        return Scaffold(
            key: scaffoldKey,
            appBar: AppBar(
                title: Text('循环渲染组件案例'),
            ),
            body: new Center(
                child: ExampleWidget
            )
        );
    }
}

相关文章

网友评论

    本文标题:flutter 中循环渲染组件

    本文链接:https://www.haomeiwen.com/subject/sqzeuqtx.html