Flutter ListView如何添加HeaderView和FooterView
flutter 如何 添加 listview
2023-09-27 14:28:53 时间
做过Android开发的同学知道,Android的ListView提供addHeaderView和addFooterView两个方法用于添加View到ListView;
RecyclerView则通过定义不同的ItemType区分HeaderViewItem和普通的ListItem,在Adapter中加上逻辑判断返回对应的ViewHolder,处理起来还是有点麻烦的。
而flutter的ListView怎么处理呢?有两种方式:
- 参考RecyclerView的实现方式,定义不同类型的Item,如果想保持HeaderViewItem滚出屏幕外而不会被销毁,需要使用KeepAlive控件对HeaderViewItem做一层包裹;
- 使用CustomScrollView + SliverToBoxAdapter + SliverList;
推荐使用方式2,实现简单没有多余的判断逻辑处理,废话少说,直接上代码:
class MyHomePage extends StatelessWidget {
// 列表项
Widget _buildListItem(BuildContext context, int index){
return ListTile(
title: Text('list tile index $index')
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Demo'),
),
body: CustomScrollView(
slivers: <Widget>[
// 如果不是Sliver家族的Widget,需要使用SliverToBoxAdapter做层包裹
SliverToBoxAdapter(
child: Container(
height: 120,
color: Colors.green,
child: Text('HeaderView'),
),
),
// 当列表项高度固定时,使用 SliverFixedExtendList 比 SliverList 具有更高的性能
SliverFixedExtentList(
delegate: SliverChildBuilderDelegate(_buildListItem, childCount: 30),
itemExtent: 48.0
)
],
),
);
}
}
运行效果
相关文章
- Flutter ShaderMask 使用详情
- Flutter 实现微信摇一摇的功能 Flutter 加速度感应
- flutter 弹框 dialog,flutter提示框
- flutter GridView 九宫格
- Flutter移动电商实战 --(51)购物车_Provide中添加商品
- AndroidStudio中Flutter打包APK
- Flutter移动电商实战 --(15)商品推荐区域制作
- Flutter移动电商实战 --(14)首页_拨打电话操作
- Flutter移动电商实战 --(2)建立项目和编写入口文件
- 如何集成华为AGC性能分析-Flutter
- 如何在Flutter中集成华为远程配置服务
- Flutter教程之 通过 Google AdMob 赚钱
- 如何为您的 Flutter Windows 应用制作 .exe 文件和安装程序
- 如何在 flutter 中创建动画可滚动的出生日期选择器弹出窗口小部件
- Flutter 教程之 如何在app中启用 Google 支付
- Nowa Flutter开发教程之 06 什么是Components以及为什么使用 (无代码开发)
- Flutter 教程之如何从头开始设置 Flutter(2022 mac 版)
- Flutter 教程之 如何添加本地照片通过assets管理(教程含源码)
- Flutter iOS风格中Widget内容滑到了顶部导航栏后面与其重叠
- Flutter:创建透明/半透明的应用栏
- Flutter:AnimatedOpacity 示例
- Windoes下安装配置flutter环境
- flutter - 如何在Dart/Flutter中将某些元素从一个Map复制到新Map中?
- flutter - 如何在 dart/flutter 中收听流值
- flutter项目如何打包(android)
- 如何在MacOS上创建第一个iOS Flutter应用
- Flutter开发 - tableview的cell中for循环怎么写
- Flutter开发 - 如何在点击tabbar后让对应的页面刷新