来自Leo的原创博客,转载请著名出处
我的StackOverflow
我的Github
https://github.com/LeoMobileDeveloper
注意:本文的代码是用Swift 2.2写的。
视差效果
什么是视差效果?我们来看下格瓦拉的App,就知道了
格瓦拉的视差效果算是比较明显的。所谓视差效果,就是看起来在”上面”的视图滚动的速度大于”底层”的时图滚动。所以,给人的视觉体验要比”屌丝”的滚动效果好不少。
ParallexBanner
之前项目赶进度,一直用的开源的。最近刚好在复习Swift,脑袋一热,就自己写了个。
支持
- 循环滚动
- 自动滚动
- 本地图片和网络图片
- 视差效果
- Storyboard和纯Code布局
效果
实现视图轮播的几种方式
视图轮播没什么难度,大致分为几种实现方式
- 单纯的用ScrollView实现,然后一张一张图片subview添加进去。
- UICollectionView实现
- UIPageViewController实现
大致分析了下。
- ScrollView实现简单粗暴,但是有一个很大的问题,视图复用。因为是一次性addSubView进去的。所以,在图片较多的时候,内存占用较多。
- UIPageViewController实现依赖于ViewController,而作为一个视图来说,还是轻量级比较好一点。
- UICollectionView帮我们实现了复用,我们只需要关注轮播本身就可以了。
So,
本文就选用CollectionView实现吧。
定义接口
写一个功能或者业务的第一步,定义接口,想要整体的类分布,值传递的逻辑。(这个很重要)
用Swift写代码要注意一点:Swift是一个面相协议编程的语言
所以,Try start with protocol.
视图轮播需要数据源传递进来,同样需要把点击和滚动事件传递出去。所以,我们就采用Cocoa Touch的常用设计模式:dataSource和delegate,定义如下
@objc public protocol ParallexBannerDelegate {
//点击事件
optional func banner(banner