当前位置:网站首页>Flutter | the easiest way to add header and footer to listview
Flutter | the easiest way to add header and footer to listview
2022-07-24 00:21:00 【Stars without night】
I see many people using CustomScrollView, My heart aches , How to kill a chicken ?

Take a good look at the code , A little Column Can solve the problem :
class _AddHeaderFooterListPageState extends State<AddHeaderFooterListPage> {
final _dataArray = [1, 2, 3];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: BaseAppBar(titleText: ' Add header and suffix '),
body: ListView.builder(
itemCount: _dataArray.length,
itemBuilder: (context, index) {
if (index == 0) {
// start
return Column(
children: [
_buildHeader(),
_buildCell(index),
],
);
} else if (index == _dataArray.length - 1) {
// ending
return Column(
children: [
_buildCell(index),
_buildFooter(),
],
);
} else {
return _buildCell(index);
}
},
),
);
}
Widget _buildCell(int index) {
return Container(
alignment: Alignment.centerLeft,
height: 30,
color: Colors.orange,
child: Text(' This is a cell-$index'),
);
}
Widget _buildHeader() {
return Container(
alignment: Alignment.center,
height: 100,
color: Colors.red,
child: const Text(' This is the header '),
);
}
Widget _buildFooter() {
return Container(
alignment: Alignment.center,
height: 100,
color: Colors.green,
child: const Text(' This is the end of the watch '),
);
}
}
边栏推荐
- GBase 8c 访问权限查询函数(三)
- English grammar_ Demonstrative pronoun - so
- Gbase 8C access authority query function (III)
- Esp8266 - at command + network transparent transmission
- Redis主从同步机制
- 【语音合成】TensorFlowTTS 中文文本转语音
- 【低代码】低代码发展的局限性
- Redis master-slave synchronization mechanism
- Application of encryption technology
- July 23, 2022 - mapper file description
猜你喜欢

2022年7月23日——mapper文件说明

Difference between data index and label system of data warehouse
![[Android kotlin] property, getter and setter](/img/f7/a3b79e3f7c4396a240eb5749c450d3.png)
[Android kotlin] property, getter and setter

English语法_指示代词 - So

Redis cluster construction (cluster cluster mode, fragment cluster)

Beifeng communication appeared in China (Xiamen) emergency exhibition | intelligent communication means are strong and eye-catching!

Redis 主从、哨兵、集群架构有缺点比较

English语法_指示代词 -such / the same

盘点为下个牛市做准备的10个新Layer1

Tencent will close the "magic core". Is there any resistance to the development of digital collections?
随机推荐
【低代码】低代码发展的局限性
Gbase 8C session information function (4)
Redis 集群hash分片算法(槽位定位算法)
Gbase 8C session information function (III)
GBase 8c 会话信息函数(五)
July 23, 2022 - mapper file description
Gbase 8C access authority query function (II)
作为一个程序员,有什么想对新人说的吗?
数仓数据指标和标签体系区别
FPGA - SPI bus control flash (3) including code
Gbase 8C access authority query function (III)
Nacos
Intel Intel realsense realistic depth camera self calibration operation steps explanation D400 series is applicable
Esp8266 - at command + network transparent transmission
GBase 8c 会话信息函数(三)
GBase 8c系统表信息函数(三)
Redis cluster construction (cluster cluster mode, fragment cluster)
Gbase 8C access authority query function (V)
Adaptation scheme of large screen visualization
[speech synthesis] tensorflowtts Chinese text to speech