多轮播图的设计

列表展示多个轮播图

• 多个轮播图同时显示
• 多个轮播图不定时进行轮播动画
• 对应呈现的关系：1个TableView、一个Cell对应N组轮播控件、一个轮播控件对应M组图片

轮播图的实现

• 网上轮播控件实现方案分析
  • 如基于UIScrollView+2或者3ImageView做无限循环轮播。没有必要做无限自由滚动，不适合。
  • 基于CollectionView做的轮播；方案太多余复杂。在Cell嵌入CollectionView，同时还对IndexPath不断的操作，基于导致Crash。
• 最大问题在于轮播触发机制：Timer
  • 一般轮播效果都是创建Timer，定时去触发轮播效果；这种设计方式存在的弊端在于Timer必须手动销毁，否则会引起循环引用。
  • 列表中同时存在多个轮播控件，timer就会有N个，如果有删除和增加，对于Timer的管理将是灾难性，
  • 多个Timer维护的成本变得很困难且极易出错
• UIImageView的AnimateImages属性，效果太僵硬，丢弃
• 自动循环播放的帧动画效果，稍微研究了下也不行
  • 关在在于每次循环的起点没变化监听
  • 动画需要初始化之后，在于修改很困难，轮播的图片是可能发生变化的

自定义轮播控件

• 基于数据驱动方式的列表多轮播控件设计

• 轮播控件动画效果

  • 两个ImageView，可见的InView，不可见的OutView，
  • 实现上下左右四个方向移入移出的动画效果，使用UIView animateWithDuration实现
  • 四个方向动画，随机选择，内部自己控制

• 动画的触发机制

  • 只的存在一个Timer，控制所有轮播图的动画
  • 统一更新数据源的imageIndex，
  • 统一控制动画随机显示逻辑，避免同时刷新动画，效果不好，同时也减少不必要计算

• 如何通知轮播控件触发动[图片上传中...(多轮播图列表显示.png-7cc429-1522741914448-0)]
  画

  • Notification方式，很繁琐，舍弃
  • KVO监听ImageIndex，同样会对Self强引用，导致Cell没有办法被释放
  • 最好的方式弱引用Delegate

多轮播图列表显示.png

存在的问题

• 由于ItemView是被复用的，导致Model对应ItemView是不一致的~因此如何保证，复用的时候，更新Model的delegate可以有效避免不必要的刷新，保证只有显示的View才会被刷新
• model.delegate同步问题，可能存在在动画循环中，访问model.delegate的时候，由于Cell的复用导致ItemView的复用，model.delegate会发生改变