ListView
老规矩先上代码
这是我创建的一个item,这个样子
class _countItem extends State<countItem> {
@override
Widget build(BuildContext context) {
// TODO: implement build
return Column(
children: <Widget>[
Container(
margin: EdgeInsets.all(15),
color: Colors.indigo,
child: Row(
children: <Widget>[
Container(
margin: EdgeInsets.all(10),
color: Colors.white,
child: Row(
children: <Widget>[
Text(
' ${widget.mapData['name']}',
style: TextStyle(fontSize: 16),
),
IconButton(
icon: Icon(Icons.exposure_neg_1),
color: Colors.grey,
onPressed: () {
setState(() {
widget.mapData['number']--;
});
},
),
Text(
' ${widget.mapData['number']}',
style: TextStyle(fontSize: 20, color: Colors.red),
),
IconButton(
icon: Icon(Icons.exposure_plus_1),
color: Colors.grey,
onPressed: () {
setState(() {
widget.mapData['number']++;
});
},
),
],
),
),
],
),
)
],
);
}
}
创建好了item,就开始创建ListView
itemBuilder来创建里面每一个item
itemCount设置你要遍历的数量
itemExtent设置你item的高度
itemBuilder里的context是用来判断你点的是哪一个item
index是下标
Widget itemList(List itemData) {
return ListView.builder(
itemCount: itemData.length,
itemExtent: 100.0,
itemBuilder: (BuildContext context, int index) {
return countItem(
// name: itemData[index]['name'],
// count: itemData[index]['count'],
mapData: itemData[index],
);
},
);
}