用户登录

在 DataTable 小部件上添加一个 sortColumnIndex .. 它的值应该是排序的栏的索引号 .. 比如表示按第一栏内容排序,它的值应该设置成 0 ... 你会发现这个栏目的标签旁边会出现一个表示排序的符号 ..

默认是升序排列 .. 表示表格当前用的排序方法,可以使用 sortAscending 属性控制 .. 如果是 true,就表示数据表格正在按栏目升序排列 .. 如果把它的值设置成 false,就表示当前表格是降序排列 ..

这两个属性的值应该动态去设置 .. 用 _sortColumnIndex 的值表示 sortColumnIndex ... 下面用 _sortAscending 的值表示 sortAscending ..

然后在类里面再去添加这两个数据 .. 一个是 int 类型的数据,名字叫 _sortColumnIndex,表示排序的栏目 .. 还有一个是 bool 类型的数据,名字是 _sortAscending .. 表示的是排序用的方法 .. 先让它等于 true ..

onSort

下面再找个 DataColumn,数据栏目 .. 启用它的排序功能,可以添加一个 onSort .. 按下栏目标签进行排序的时候会执行这个方法 .. 方法有两个参数,一个是 int 类型的 index ,它的值应该是当前要栏目的索引号 .. 还有一个 bool 类型的 ascending ,表示是否使用的是升序排列 ..

方法里面,用一个 setState ... 去设置一下,把 _sortColumnIndex 的值设置成 index ... 就是被按的当前栏目 .. 再把 _sortAscending 设置成 ascending ..

下面到模拟器上试一下 .. 接一下 Title 这个栏目的标签 .. 标签栏上的表示排序方法的小图标会有变化 ... 表示升序还有降序 ..

排序列表

下面我们需要真正实施一下列表的排序功能 .. 在这个栏目的 onSort 里用的这个 setState 里面 .. 用一下 posts.sort .. 给它一个方法,方法有两个参数 .. 进行排序的列表项目 a 还有 b ..

里面可以判断一下 .. 如果排序方法不是 ascending .. 我们可以把 a 还有 b 的值调换一下 .. 先添加一个 c .. 让它等于 a .. 然后再让 a 等于 b .. 最后再让 b 等于 c ..

方法 return 的是一个对比结果 .. a 里的 title ,用一下 length .. 接着用一下 compareTo .. 比较的是 b 的 title length .. 意思就是比较一下 a 还有 b 里面的 title 属性的长度 .

到模拟器上再去试一下 .. 按一下 Title ... 会按照标题内容的长度,升序或者降序排列这个表格里的数据 ..

DataTable:数据表格的排序《 Flutter 移动应用:MDC 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点