RecyclerView嵌套RecyclerView完美实现京东tab吸顶效果

时间:2022-07-28
本文章向大家介绍RecyclerView嵌套RecyclerView完美实现京东tab吸顶效果，主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项，具有一定的参考价值，需要的朋友可以参考一下。

效果展示

image.png

动画展示:https://github.com/FangMessi/nested_scroll_demo/blob/main/screenshot/ajqoe-vk8xu.gif

页面结构

structure.png

方案

继承RecyclerView，  
重写dispatchNestedPreScroll&dispatchNestedPreFling，  
自行托管事件的消耗

关于方案的选择

  • CoordinatorLayout&AppBarLayout&RecyclerView 
该方案有两个问题：
1、tab以上的部分不够灵活。相信大家都运行过material design的demo，
tab以上的部分基本可以理解成一个LinearLayout，需要单独绘制每一个item，
需要产品需要调整顺序就麻烦了
2、AppBarLayout会限制app头部的样式。google的设计很好看，不过像电商之类的App，
头部的复杂程度远超想象，也许就遇到一个AppBarLayout不好支持的效果
  • RecyclerView嵌套RecyclerView，加上事件分发 
事件分发机制，有个天然的缺陷。
一旦parent选择拦截消耗了事件，child将不再收到parent分发的事件了。
想要实现一次事件（down&move*n&up）一开始由parent消耗，然后由child消耗，事件分发机制就做不到了
  • RecyclerView嵌套RecyclerView，加上嵌套滚动（NestedScrollChild&NestedScrollParent） 
基于嵌套滚动的机制，RecyclerView$onTouchEvent处理事件的流程是：
---------------- scroll ---------------
1、父类是否消耗scroll事件 dispatchNestedPreScroll()
2、自己消耗 scrollByInternal()
3、父类消耗 dispatchNestedScroll()
---------------- fling ----------------
4、父类是否消耗fling事件 dispatchNestedPreFling()
5、4不消耗，则父类dispatchNestedFling& 自己mViewFlinger.fling()

方案呼之欲出了

1、继承RecyclerView
2、重写dispatchNestedPreScroll()&dispatchNestedPreFling()，在询问父类之前，
先尝试把事件分发给内部RecyclerView

源码

  • 一切不放源码的分享都是耍流氓 
https://github.com/FangMessi/nested_scroll_demo

源码

最后

  • 欢迎提出问题，一起沟通讨论
  • 码字不易，您的点赞是我继续分享的动力

随机文章
本站知识点必读
最近更新