废话
图片轮播这是一个常见的不能在常见的效果了;对于这类老生常谈的问题,其实有现成的解决方案和思路。
- 不要求轮播(循环):UICollectionView 这是一个很好不过的方式,很多的相册浏览都是通过这个来实现的
- 轮播:
- UIPageViewController 这个使用的也不少,使用不算复杂
- UIScrollView:这个是大概是使用最广泛的思路,通过动态修改 contentOffset来实现,这类的已经实现的方案也很多
- UICollectionView: 这个通过自定义 layout来实现也是可以的
我是一个不太喜欢造轮子的人,网上看过很多实现,有好有坏,基本也可以归位上面提到的几种方式,自己总觉得不够优雅,不够简单。相关代码写了好多,想着能不能做个简单易用,配置简单,功能强大的东东,各种原因一直拖了下来,最近终于有时间来实现这个东东。自我感觉还不错的样子,欢迎使用提出宝贵的意见。
CarouselSwift 介绍
<a href="https://github.com/zhangbozhb/Carousel">CarouselSwift </a>旋转木马效果这个是最为常见的效果, 实现了以下功能:
- 轮播和线性滑动支持:
- 轮播(Loop): 也就是我们通常说的无限循环功能
- 线性滑动(Linear): 采用 reusable page的方式, 使用极少的内存资源(需要时候进行显示); 类似 UITableView, UICollectionView, UIPageViewController
- 支持多个方向:
- 水平: 横向(Horizontal)
- 垂直: 纵向(Vertical)
- 支持多个页面: 视图内同时显示多个page
- 可以修改 手势(UIPanGestureRecognizer)的delegate实现特殊的功能(比如边界, 显示特殊的view或者push/pop view)
- 其它:
- 自动轮播: 缺省封装了timer实现自动轮播, 可以直接使用
- 切换进度: 在 delegate中自动计算切换page 的进度
CarouselSwift 优势与限制:
- 优势:
简单易用:CarouselSwift在其使用场景下,使用更简单, 开源具有很大的自主性。
-
避免系统使用组建,难以解决的问题:
- UIPanGestureRecognizer delegate 手势修改问题
- UIPageViewController Crash问题:
- view controller 为空时候的, 滑动crash问题相比不会陌生
- setViewControllers(_:direction:animated:completion:)
CarouselSwift 与系统提供的组件简单比较
CarouselSwift | UITableView | UICollectionView | UIPageViewController | |
---|---|---|---|---|
水平布局 | √ | × | √ | √ |
垂直布局 | √ | × | √ | √ |
内容线性排列 | √ | × | √ | √ |
内容循环排列 | √ | × | × | √ |
cell是否要求相同 | √ | × | × | √ |
重用优化 | √ | √ | √ | √ |
cell是否可以重用 | ×(部分) | √ | √ | √ |
page中显示多个cell | √ | √ | √ | × |
是否支持分页 | √ | × | × | √ |
UIPanGestureRecognizer delegate修改 | √ | × | × | × |
滑动进度 | √ | √(间接) | √(间接) | × |
通过上面的比较,可以发现 CarouselSwift 和 UIPageViewController 有很大的相似性(其实差不多就是模仿 UIPageViewController 来做的),使用起来更为简单
* CarouselSwift 与其他类似功能组建比较:
* CarouselSwift 同时支持水平和垂直,而其他通常支持一种
* CarouselSwift 同时支持内容线性排列和循环排列,而其他通常支持一种
* CarouselSwift cell采用重用的方式,避免避免将所有 view 都加载
* CarouselSwift 单页内可以显示多个view,其它只支持一个
- 限制与使用场景:
- <a href="https://github.com/zhangbozhb/Carousel">CarouselSwift </a> 只适合用于每个 cell 的大小完全相同的场景, 无法像 UITableView和UICollectionView支持不同的大小的 cell,对于 cell 大小不一致的是否,推荐使用系统组件
原理:
<a href="https://github.com/zhangbozhb/Carousel">CarouselSwift </a> 是采用 UIScrollView 来实现的
- 采用的是 UIScrollView 作为容器来实现的
- 轮播(无限循环):使用 N + 2 个page, 在滑动到 0, N的时候通过调整contentOffset
- 自动滚动:通过使用 NSTimer 定时来实现
- 自动滚动与手势配合: UIScrollViewDelegate的 scrollViewWillBeginDragging(:) 关闭timer, scrollViewDidEndDragging(:willDecelerate:) 开启timer
使用
CarouselView
let carousel = CarouselView.init(frame: view.bounds)
view.addSubview(carousel)
carousel.type = .Loop // 设置内容 cell 是否循环
carousel.dataSource = self // 设置数据源 cell view
carousel.reload() // 加载数据
carousel.autoScroll(2, increase: true) // 设置自动滚动
carousel.delegate = self // 设置滚动 delegate, 获取滚动进度
carousel.scrollToCell(1) // 滚动到指定 cell
carousel.cellPerPage = 3 // 单页可以显示 view 数量
// CarouselViewDataSourse
func numberOfView(carousel:CarouselView) -> Int // 返回用于显示 view 的总数
func carousel(carousel:CarouselView, viewForIndex index:Int) -> UIView? // index 对应的 view, nil则表示该 index 不显示
CarouselViewController
let carousel = CarouselViewController()
carousel.carouselView.type = .Loop // 设置内容 cell 是否循环
carousel.dataSource = self // 设置数据源 cell view
carousel.reload() // 加载数据
carousel.autoScroll(2, increase: true) // 设置自动滚动
carousel.delegate = self // 设置滚动 delegate, 获取滚动进度
carousel.scrollToCell(1) // 滚动到指定 cell
carousel.cellPerPage = 3 // 单页可以显示 view 数量
// CarouselViewControllerDataSourse
func numberOfViewController(carousel:CarouselViewController) -> Int // total count of view controller
func carousel(carousel:CarouselViewController, viewControllerForIndex index:Int) -> UIViewController? // index 对应的 view controller, nil则表示该 index 不显示