Flutter for迴圈案例
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 }
相關文章
- Spring迴圈依賴+案例解析Spring
- Flutter迴圈滑動的PageViewFlutterView
- Java簡單迴圈語句案例Java
- 碎片化學習Java(十六)Java For迴圈案例Java
- Flutter Flame 教程2 -- Game Loop遊戲迴圈FlutterGAMOOP遊戲
- for 迴圈與 while 迴圈While
- while迴圈 case迴圈While
- C語言——迴圈結構(for迴圈,while迴圈,do-while迴圈)C語言While
- 無限for迴圈(死迴圈)
- flutter: 執行緒通訊與訊息迴圈Flutter執行緒
- while迴圈以及do while迴圈While
- if迴圈
- 迴圈
- for迴圈
- if for迴圈
- For 迴圈
- Oracle優化案例-定位start with connect by遞迴死迴圈資料(二十二)Oracle優化遞迴
- 04流程控制 for迴圈,while迴圈While
- 從一個案例,細說瀏覽器的事件迴圈瀏覽器事件
- [譯] Flutter 非同步程式設計:Future、Isolate 和事件迴圈Flutter非同步程式設計事件
- 11C++迴圈結構-for迴圈(1)C++
- for迴圈、break和continue、二重迴圈
- 【基礎題】【for迴圈】二重迴圈
- Java迴圈Java
- javaScript for迴圈JavaScript
- 事件迴圈事件
- while迴圈While
- pythonfor迴圈Python
- 迴圈群
- javascript迴圈JavaScript
- Kotlin 迴圈Kotlin
- JavaScript for of 迴圈JavaScript
- 迴圈引用
- 清華尹成帶你實戰GO案例(8)Go for迴圈Go
- C#程式設計基礎第七課:C#中的基本迴圈語句:while迴圈、do-while迴圈、for迴圈、foreach迴圈的使用C#程式設計While
- scss中迴圈之@for迴圈佈局畫圓CSS
- Python迴圈引用是什麼?如何避免迴圈引用?Python
- 迴圈中的非同步&&迴圈中的閉包非同步