標(biāo)準(zhǔn)的ListView構(gòu)造函數(shù)適用于小列表。 為了處理包含大量數(shù)據(jù)的列表跛十，最好使用ListView.builder構(gòu)造函數(shù)。
ListView的構(gòu)造函數(shù)需要一次創(chuàng)建所有項(xiàng)目，但ListView.builder的構(gòu)造函數(shù)不需要池充，它將在列表項(xiàng)滾動(dòng)到屏幕上時(shí)創(chuàng)建該列表項(xiàng)。
1. 創(chuàng)建一個(gè)數(shù)據(jù)源
首先缎讼，我們需要一個(gè)數(shù)據(jù)源來(lái)收夸。例如，您的數(shù)據(jù)源可能是消息列表血崭、搜索結(jié)果或商店中的產(chǎn)品卧惜。大多數(shù)情況下，這些數(shù)據(jù)將來(lái)自互聯(lián)網(wǎng)或數(shù)據(jù)庫(kù)夹纫。
在這個(gè)例子中咽瓷，我們將使用List.generate構(gòu)造函數(shù)生成擁有10000個(gè)字符串的列表
final items = new List<String>.generate(10000, (i) => "Item $i");
2. 將數(shù)據(jù)源轉(zhuǎn)換成Widgets
為了顯示我們的字符串列表，我們需要將每個(gè)字符串展現(xiàn)為一個(gè)Widget 舰讹！
這正是ListView.builder發(fā)揮作用的地方茅姜。在我們的例子中，我們將每一行顯示一個(gè)字符串
new ListView.builder(
itemCount: items.length,
itemBuilder: (context, index) {
return new ListTile(
title: new Text('${items[index]}'),
);
},
);
完整的例子
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
void main() {
runApp(new MyApp(
items: new List<String>.generate(10000, (i) => "Item $i"),
));
}
class MyApp extends StatelessWidget {
final List<String> items;
MyApp({Key key, @required this.items}) : super(key: key);
@override
Widget build(BuildContext context) {
final title = 'Long List';
return new MaterialApp(
title: title,
home: new Scaffold(
appBar: new AppBar(
title: new Text(title),
),
body: new ListView.builder(
itemCount: items.length,
itemBuilder: (context, index) {
return new ListTile(
title: new Text('${items[index]}'),
);
},
),
),
);
}
}
