关于scrollview的无限滚动效果实现
阅读原文时间:2023年07月09日阅读:3

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

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

仿真翻页,使用系统自带的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分支上修改的,公司的代码,你懂的。