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添加内容。

这是效果图:
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_43434223/article/details/87908127