关于scrollview的无限滚动效果实现

Posted 2021-01-18 xiaoerheiwatu

起因及需求：做过阅读器的朋友应该知道，一般的阅读器都会有仿真、平移等特效。最近赶上真空期，项目不忙，有点时间，于是想抓起来，总结点干货。

 

仿真翻页及平滑翻页的基本实现：

仿真翻页，使用系统自带的UIPageViewController可以轻松实现流畅的翻页效果，这里暂不详述，后面会专门做一期UIPageViewController实现中实现自定义手势翻页的专题。

平滑（或覆盖）翻页，有能力的可以自定义封装一个controller，用来抓取数据及回调事件，简单说一下实现步骤。

　　1.controller中主要包含两控制器，一个正在显示的，另一个待显示的

　　2.自定义tap及pan手势，实现相应的动画

　　3.待显示的控制器由外界传入，tap动画及pan（交互）动画过程中及结束时可以向外界传出相应的状态

　　4.动画结束后，记得将状态还原

（效果图暂且不附，免得影响主次）

 

进入正题，如何实现滚动翻页？

效果图先附一张

 

关于实现前的误区：

　　1.章节内容如何无缝拼接？

　　　　之前思维一直局限于仿真、平滑的设计思路，就是控制器中包含两控制器，一个当前显示、另一个待显示，然后通过切换数据的方式来实现前后翻页。其实滚屏也可以设计成这种，也就是把每章都分隔开来，滚到底部或顶部时加载另一章，然后显示新的内容即可。这样做能满足大致要求，但是达不到流畅的章节翻页效果。

　　2.章节拼接后如何实现流畅的滚动？

　　　　之前一直陷于一个思维误区，是搬数据还是搬视图？

　　　　搬数据：scrollView中仅仅显示一个内容视图，每次切换章节，将新的内容替换，并默默改变scrollview的偏移量，形成无缝切章节的效果。具体来讲内容分上中下三块，快滑到顶部时，底部内容置空，加载上一章，加载出来后，重新拼接上中下内容，此时注意修改scrollView的偏移量；快滑到底部时，一样的处理方式。

　　　　搬视图：scrollView中显示三个内容视图，内容视图中可嵌套别的视图，每次切换章节时，替换新内容，同样默默修改scrollView的偏移量，达成效果。

　　　　这两种其实本质一样，都能达成效果。但是搬视图能显示类型不一样的视图，具有更好的扩展性。但是这两种方式都需要结合scrollView滑动的代理，做细致的处理，比较难以实现。

 

仔细看过的同学应该已经发现，搬视图的方式不就是一个CollectionView就搞定了吗？？？何必去定义多个视图，我直接写几个cell出来复用不就完事了吗？省的自己还得为内存做优化。并且章节由cell隔开也能做一些更细致的处理，比如估算页码等。

代码等我后期写个demo吧，因为目前直接在SVN分支上修改的，公司的代码，你懂的。