挑战全掘金标题最长,希望掘金不会出bug~~
引言
首先呢,按照惯例,附上性能和效果的展示图(这次gif图好像压过头了…………不过勉强能用,总之意思到了就行):
跟github现存的那些相比,最主要的改进就是脱离了canvas 和 draw 操作(好像github上还是一堆用canvas来做的),想改内容样式的话,按照recylerView的使用方法那样改holder就行,我想现在没人连recyclerView怎么用都不知道吧~~
咳咳,性能这块确实差了点,自动翻页的动画模式下也就到合格线,后面真要还有时间的话,再优化下(我这外包真是忙的时候忙死,闲的时候闲死……);
不过这块是属于canvas处理的部分,说白了就是改以前代码的的时候哪块没跟上,跟要说的核心部分关系倒是不大,这篇呢,其实是对recycleView的学习总结,除了秀下新玩具(原理和实现都不难,然而在github上还真好像没有)外,主要还是当杂谈和记录性质,省的过年回来看代码又是一脸懵逼(来自因为疫情好像没法回家过年,打算跟舍友刷他几周目只狼的健忘打工仔);
那么,简单的介绍下实现原理方式
其实整个阅读器本身就是个RecyclerView,我们看到页面内容就是RecyclerView的Holder中的部分
交互部分我是参考小米的系统阅读器(还顺便发现一个bug,另外因为这个bug,盲猜小米是用unity这种做的,而非原生实现)
在这个demo中,我是这么设计:
- recyclerView仅填充两个页面,可以理解为展示区域永远就只展示两个,剩下的就走recyclerView那套缓存机制
- 得益于强大的layoutManager,我们可以获取到holder本身的view,那么剩下要做的也无非处理处理手势什么的,并在holder本身的canvas上进行修改
- 关于手势这块的处理,我个人是取了个巧,从gif图上,你可能以为又是将事件传递给一个自定义View,然后自定义View根据手势信息进行绘制;在这里其实不然;简单的来说,我其实并没怎么处理手势部分的东西,也就是记录和拦截做了下处理;绘制这块,其实是根据recyclerView本身的偏移量绘制的,比如gif图上所示,左右方向的绘制其实就是读取的recyclerView的偏移量,上下方向的就是根据记录的手势信息;(这么设计的原因其实除了遵循单一数据来源的原则外,让,另外能更好的利用recyclerView本身自带的很多api,因为recyclerView的一大堆偏移api最终和手势一样走到一个处理逻辑;好吧,我承认,上面的那些全是空话,核心目的其实就是为了偷懒)
- 因为完全自定义填充、绘制规则,相应的像自动回复的动画也要修改;不过我是利用recylerView的那个SnapHelper实现的(上面的设计方案帮了大忙,直接修改偏移量爽的一批)
嗯,现在看下,好像实现蛮简单的,先列下知识点和步骤
- 像这种偏移量都变了,holder位置然鹅却没变的情况,只能是自定义recyclerView的layoutManager。这玩意教程太多了就不赘述;不过我这只需要scrollHorizontallyBy、scrollVerticallyBy、onLayoutChildren 其他像 scrollToPosition、smoothScrollToPosition 什么的还真不需要
- 上面那步实现了基本的展示,位移量和手势的偏转计算,可以通过百分比来做处理,精度损失就损失了,触摸点差个一两个像素问题不大
- 翻页动画绘制这块同上,根据百分比获取位置,剩下的跟之前差不多的方式改canvas,只不过通知方式变了而已,这回是通过重写ViewGroup.dispatchDraw方法,需要绘制的时候就去绘制
- 回复动画是完全由recylerView的SnapHelper来做,说白了,继承PageSnapHelper,重写findTargetSnapPosition、findSnapView之类的方法就完事了
好像就这些,仔细回想下好像还真不难,而且就仅仅利用了recyclerView的框架,把哪块该干什么都实现就完事了,像手势处理、绘制、回复什么的模块拆分解耦的非常彻底,完全不用等对方通知什么的
当初怎么想到甚至要动用自定义ItemTouchHelper这块的…………996先背个锅吧,当初意识模糊绝逼是因为加班加多了
More
研究下移植一个阉割版的recyclerView到flutter上呢?不亲自动手,好好考虑下怎么设计,在绝境中突然发现,recylerView都把你需要的东西都提供好了,显的你前思考半天的行为就像一个二傻子,真没法体会到设计recyclerView的作者有多么鬼才;
对比下flutter的listView,recyclerView的设计思路简直是从次元层面的碾压;当初搞出recyclerView的那帮真他娘的是人才