先看我实现的效果图
日历滚动视图.gif
刚从原生安卓转flutter,安卓有个库可以实现顶部停靠:se.emilsjolander:stickylistheaders:2.5.2
这个库有两个方法
1.setSelection(int index),可以滚动到list指定位置
2.setOnStickyHeaderChangedListener 当停靠的头部发生改变则触发
agenda_view.getAgendaListView().setOnStickyHeaderChangedListener((l, header, itemPosition, headerId) -> { Log.d(LOG_TAG, String.format("onStickyHeaderChanged, position = %d, headerId = %d", itemPosition, headerId)); });
这两个方法是非常有用的,不过我在flutter没有找到这样的库
ListView不能滚动到指定位置,但是可以监听到滚动超出屏幕的 距离offset,如果想要计算当前position,那么item的高度要一致,
计算如下:int position=offset/item高度;
对于item的高度不一致呢?ListView就获取不了当前滚动的position了;
于是继续找库
1. sticky_headers: ^0.3.0+2
这个库是在item里面区分开头部和内容,外层可以用ListView、GridView、CustomScrollView或 SingleChildScrollView来包裹,一开始觉的这些滚动list,都没法实时获取停靠头部的索引。于是又找第二个库(这里主要是想偷懒,看看有没有现成且完全符合功能的库)
2.easy_sticky_header: ^1.0.5
这个库是可以实时获取头部索引的,这位作者很费心,讲解也很仔细,由于太复杂我没一时也没看懂其原理,然后拿到本地跑起来,发现它没有浮动的头部停靠,而且也不好实现侧边栏效果 如下图
image.png
3.side_header_list_view
传送门https://github.com/renefloor/side_header_list_view
这个库实现停靠的方式 完全是靠计算来实现 ,不过有要求必须要指定item高度itemExtend,研究了好一会,想魔改,最后还是放弃了
4.flutter_sticky_header: ^0.6.5
这个库实现了侧壁栏 头部停靠,效果还不错,最后发现不能够监听到停靠头部的索引
,而且作者好像也不更新维护了,项目还是4~5年前创建的,最后一次提交是10个月前
折腾了两天,没办法,兜兜转转 还是回到第一个sticky_headers,难道没有ListView既能跳转到指定位置,又能实时获取停靠头部的索引吗?哎~,真给我找到了,早知道就不用那么费时间了
这个库就是scrollable_positioned_list: ^0.3.8
再结合sticky_headers: ^0.3.0+2 ,完全可以得到我想要的效果。
网友评论