Flutter學習之動態ListView

import 'package:flutter/material.dart';

void main(){
  runApp(listname(
    item: new List<String>.generate(1000, (i) => "genarate $i")
  ));
}

class listname extends StatelessWidget{
  final List<String> item;
  listname({Key key, @required this.item}):super(key:key);
  @override
  Widget build(BuildContext context){
    return MaterialApp(
      title: "listname",
      home:Scaffold(
        appBar: new AppBar(
          title: new Text("list name"),
          backgroundColor: Colors.pinkAccent,
        ),
        body: new ListView.builder(
          itemCount: item.length,
          itemBuilder: (context,index){
            return new ListTile(
              title: new Text("${item[index]}"),
            ); 
          }
        ),
      ),
    );
  }
}

在大多數情況下，我們看到的網頁的列表都是動態從數據庫里讀出來，而不是一成不變的。
那么我們就需要動態列表，List.builder()這個組件方法。

那么在例子中 我們可以在創建對象時，傳入有列表生成器(我是從python的列表生成器理解的)，即

 item: new List<String>.generate(1000, (i) => "genarate $i")

然后在繼承創建類的時候需要接收參數，

final List<String> item;
listname({Key key, @required this.item}):super(key:key);

使用super調用父類的方法（這點也和python一樣）

 body: new ListView.builder(
          itemCount: item.length,
          itemBuilder: (context,index){
            return new ListTile(
              title: new Text("${item[index]}"),
            ); 
          }
        ),

最后使用ListView里的builder方法創建動態列表，在itemCount屬性設置列表長度。itemBuilder添加內容。

這是效果圖：