dart+flutter中使用PaginatedDataTable分页时最后一页多出空白行问题
解决的场景:
比如下图,28行数据,每页5行最后一页会多出两行空白。

解决方法:
可以使用PaginatedDataTable中的onPageChanged 来进行操作
onPageChanged (发生翻页时回调)
onPageChanged: (value) {
int rowCount = controller.dataSource.value.rowCount;
// Q:下面这些代码都是为了解决最后一页不够当前行的话会有很空白行的问题
// 先判断当前展示行是否大于剩余行数
if(rowCount - value < controller.rowsPerPage.value){
var perPage = rowCount - value;
// 如果当前展示行数大于剩余行数,就修改当前展示行为剩余的行数
// 但是有个操蛋的问题,修改的行数必须在availableRowsPerPage这个里面有数字,所以要新增
if(!controller.availableRows.contains(perPage)){
// 新增剩余行
controller.availableRows.add(perPage);
controller.rowsPerPage.value = perPage;
}
}else{
var defaultPage = controller.rowsPerPageLast.value;
// 如果rowsPerPage和rowsPerPageLast不相等就表示rowsPerPage在上面被修改过
if(controller.rowsPerPage.value != defaultPage){
// 这儿的操作和上面描述相反,出了最后一页就把新增的最后一页行数页删了
controller.availableRows.removeLast();
// 因为上面最后一页切换了展示行数,所以要跳出最后一页时要恢复之前的行数
controller.rowsPerPage.value = defaultPage;
}
}
},
具体的逻辑在上面写了注释,我再说下部分参数的意义
controller.dataSource => DataTableSource的封装类,我在controller中把它设置成了可监测的类
controller.rowsPerPage => 当前页显示的行数
controller.rowsPerPageLast => 切换显示行数后保留的上一个行数
dart+flutter中使用PaginatedDataTable分页时最后一页多出空白行问题的更多相关文章
- easyui分页时,总页数出错
错误出现 MyBatis用easyui写后台分页代码时,出现翻页后显示总页数错误 代码如下 可能原因在于后台mappers.xml里的sql语句错误 <select id="getPr ...
- 分页技巧_改进JSP页面中的公共分页代码_实现分页时可以有自定义的过滤与排序条件
分页技巧__改进JSP页面中的公共分页代码 自定义过滤条件问题 只有一个url地址不一样写了很多行代码 public>>pageView.jspf添加 分页技巧__实现分页时可以有自定义的 ...
- 在Flutter中嵌入Native组件的正确姿势是...
引言 在漫长的从Native向Flutter过渡的混合工程时期,要想平滑地过渡,在Flutter中使用Native中较为完善的控件会是一个很好的选择.本文希望向大家介绍AndroidView的使用方式 ...
- Flutter 中 JSON 解析
本文介绍一下Flutter中如何进行json数据的解析.在移动端开发中,请求服务端返回json数据并解析是一个很常见的使用场景.Android原生开发中,有GsonFormat这样的神器,一键生成Ja ...
- flutter 中的样式
flutter 中的样式 样式 值 width 320.0 height 240.0 color Colors.white,Colors.grey[300] textAlign TextAlign.c ...
- flutter中的异步机制Future
饿补一下Flutter中Http请求的异步操作. Dart是一个单线程语言,可以理解成物理线路中的串联,当其遇到有延迟的运算(比如IO操作.延时执行)时,线程中按顺序执行的运算就会阻塞,用户就会感觉到 ...
- Flutter中的日期插件date_format 中文 国际化 及flutter_cupertino_date_picker
今天我们来聊聊Flutter中的日期和日期选择器. Flutter中的日期和时间戳 //日期时间戳转换 var _nowTime = DateTime.now();//获取当前时间 print(_no ...
- flutter中的异步机制 Future
饿补一下Flutter中Http请求的异步操作. Dart是一个单线程语言,可以理解成物理线路中的串联,当其遇到有延迟的运算(比如IO操作.延时执行)时,线程中按顺序执行的运算就会阻塞,用户就会感觉到 ...
- Flutter中的浮动按钮FloatingActionButton 及融合底部工具栏
FloatingActionButton 简称 FAB,从字面理解可以看出,它是“可交互的浮动按钮”,其实在Flutter默认生成的代码中就有这家伙,只是我们没有正式的接触. 一般来说,它是一个圆形, ...
- 在Flutter中构建布局
这是在Flutter中构建布局的指南.首先,您将构建以下屏幕截图的布局.然后回过头, 本指南将解释Flutter的布局方法,并说明如何在屏幕上放置一个widget.在讨论如何水平和垂直放置widget ...
随机推荐
- Spring事务失效原因分析解决
文章目录 1.方法内部调用 2.修饰符 3.非运行时异常 4.try-catch捕获异常 5.多线程调用 6.同时使用@Transactional和@Async 7.错误使用事务传播行为 8.使用的数 ...
- 不花钱几分钟让你的站点也支持https
前言 现在,免费SSL证书已经很普遍了,但是,申请和配置SSL证书仍然是一件较为繁琐的事,修改web服务配置在所难免,且不同的web服务配置方法不一样,不具备通用性.本文介绍一种通用的快速配置方法,w ...
- 什么是push通知栏消息?
我是3y,一年CRUD经验用十年的markdown程序员常年被誉为职业八股文选手 今天继续更新Austin,给Austin新增一个发送渠道(PUSH通知栏推送) Push通知栏消息是非常常见的,几乎 ...
- C++_虚函数
1.目的: 派生类继承自基类.使用指针或引用访问派生类对象时,指针或引用本身所指向的类型可以是基类而不是派生类.如果派生类覆盖了基类中的方法,通过上述指针或引用调用该方法时,可以有两种结果: 调用到基 ...
- Vue的认识、入门小历史
VUE.3 小知识 渐进式框架,尤雨溪 Soc原则:关注度分离原则 网络通信:axios 页面跳转:vue-router 状态管理:vuex Vue-ui: Ant-Design 阿里巴巴基于Reac ...
- vue组件的对象式写法,vue中的h函数
render:将虚拟dom转为真实dom h函数:创建的是vnode,也可以成为createVnode函数 语法:h(元素名称 ,这个元素的数据,子集) 第一个参数:可以为一个html标签,一个组件, ...
- vue跨域请求数据
vue跨域请求数据 本篇文章基于vue-cli编写 问题描述 当出现如下关键词,证明我们正在执行跨域问题 此时证明我们违背了同源策略(即协议名.ip.端口号一致) 环境准备 首先,要想实现跨域请求数据 ...
- JDK、JRE、JVM三者之间的关系
JDK.JRE.JVM 以下内容转载自JDK.JRE和JVM三者之间关系_geyouchao的博客-CSDN博客 侵删,谢谢 JDK:Java Development Kit (Java开发工具包) ...
- ubuntu18.04 server版安装教程
转载博客园: Ubuntu18.04 Server版安装(详细版) - 运维密码 - 博客园 (cnblogs.com)
- 搭建CI环境和git使用
部署Git+Gerrit+Jenkins 的CI环境 使用Git作为代码存储及版本控制 使用Jenkins进行自动化构建 构建测试通过后,再交给人工review 人工review通过后,自动同步到远程 ...