上一次使用UIScrollView實(shí)現(xiàn)無限輪播的效果闺鲸，這一次在Swift語言中凤巨，我使用UICollectionView再為大家講解一次無限輪播的實(shí)現(xiàn)原理味廊。先上圖：
UICollectionView-無限輪播.gif
首先需要實(shí)現(xiàn)了就是UICollectionView的分頁介汹，這個(gè)很簡(jiǎn)單：
collectionView.isPagingEnabled = true
接下來就是原理巡雨，在UICollectionView的兩端需要先添加兩張圖片，首段需要添加最后一張圖片暮现，而尾端需要添加第一張圖片还绘，然后在中間的位置上一次添加各個(gè)圖片。這個(gè)其實(shí)是很容易實(shí)現(xiàn)的：
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "ImageCollectionViewCell", for: indexPath) as! ImageCollectionViewCell
/// 給圖片賦值（在首尾分別添加兩張圖片）
if (indexPath.row == 0) {
cell.imageName = imageNameList.last
} else if (indexPath.row == self.imageNameList.count + 1) {
cell.imageName = imageNameList.first
} else {
cell.imageName = imageNameList[indexPath.row - 1]
}
return cell
}
這樣在滑動(dòng)的時(shí)候栖袋，通過偏移量就可以實(shí)現(xiàn)無限輪播的效果了拍顷。當(dāng)滑動(dòng)停止時(shí)判斷偏移量，當(dāng)偏移量為0時(shí)（視圖上顯示的是最后一張圖片）塘幅，這時(shí)候就直接調(diào)動(dòng)調(diào)整偏移量的方法昔案，把UICollectionView偏移到最后一張圖片的位置〉缦保滑動(dòng)到尾端時(shí)是同理踏揣。
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
/// 當(dāng)UIScrollView滑動(dòng)到第一位停止時(shí)，將UIScrollView的偏移位置改變
if (scrollView.contentOffset.x == 0) {
scrollView.contentOffset = CGPoint(x: CGFloat(self.imageNameList.count) * kScreenWidth,y: 0)
self.pageControl.currentPage = self.imageNameList.count
/// 當(dāng)UIScrollView滑動(dòng)到最后一位停止時(shí)匾乓，將UIScrollView的偏移位置改變
} else if (scrollView.contentOffset.x == CGFloat(self.imageNameList.count + 1) * kScreenWidth) {
scrollView.contentOffset = CGPoint(x: kScreenWidth,y: 0)
self.pageControl.currentPage = 0
} else {
self.pageControl.currentPage = Int(scrollView.contentOffset.x / kScreenWidth) - 1
}
}
其實(shí)原理很簡(jiǎn)單捞稿，個(gè)人認(rèn)為使用UICollectionView實(shí)現(xiàn)無限輪播比起UIScrollView更加實(shí)用并且便于維護(hù)，接下來我將代碼全部列一下：
import UIKit
let kScreenWidth = UIScreen.main.bounds.width
class ViewController: UIViewController {
lazy var collectionView: UICollectionView = {
let flowLayout = UICollectionViewFlowLayout()
flowLayout.minimumLineSpacing = 0
flowLayout.minimumInteritemSpacing = 0
flowLayout.scrollDirection = .horizontal
flowLayout.itemSize = CGSize(width: kScreenWidth, height: 200)
let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 200), collectionViewLayout: flowLayout)
collectionView.isPagingEnabled = true
collectionView.showsHorizontalScrollIndicator = false
collectionView.backgroundColor = UIColor.white
collectionView.delegate = self
collectionView.dataSource = self
self.view.addSubview(collectionView)
return collectionView
}()
lazy var pageControl: UIPageControl = {
let pageControl = UIPageControl(frame: CGRect(x: 0, y: 150, width: kScreenWidth, height: 50))
pageControl.numberOfPages = self.imageNameList.count
pageControl.currentPage = 0
pageControl.tintColor = UIColor.black
pageControl.pageIndicatorTintColor = UIColor.gray;
return pageControl;
}()
lazy var imageNameList: [String] = {
let imageList = ["image0", "image1", "image2", "image3"]
return imageList
}()
override func viewDidLoad() {
super.viewDidLoad()
setupController()
}
func setupController() {
/// 設(shè)置數(shù)據(jù)
collectionView.register(ImageCollectionViewCell.self, forCellWithReuseIdentifier: "ImageCollectionViewCell")
collectionView.reloadData()
collectionView.scrollToItem(at: IndexPath(row: 1, section: 0), at: .left, animated: false)
self.view.addSubview(pageControl)
}
}
extension ViewController: UICollectionViewDataSource {
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
/// 這步只是防止崩潰
if (imageNameList.count == 0) {
return 0
}
return imageNameList.count + 2
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "ImageCollectionViewCell", for: indexPath) as! ImageCollectionViewCell
/// 給圖片賦值（在首尾分別添加兩張圖片）
if (indexPath.row == 0) {
cell.imageName = imageNameList.last
} else if (indexPath.row == self.imageNameList.count + 1) {
cell.imageName = imageNameList.first
} else {
cell.imageName = imageNameList[indexPath.row - 1]
}
return cell
}
}
extension ViewController: UICollectionViewDelegate {
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
/// 當(dāng)UIScrollView滑動(dòng)到第一位停止時(shí)拼缝，將UIScrollView的偏移位置改變
if (scrollView.contentOffset.x == 0) {
scrollView.contentOffset = CGPoint(x: CGFloat(self.imageNameList.count) * kScreenWidth,y: 0)
self.pageControl.currentPage = self.imageNameList.count
/// 當(dāng)UIScrollView滑動(dòng)到最后一位停止時(shí)娱局，將UIScrollView的偏移位置改變
} else if (scrollView.contentOffset.x == CGFloat(self.imageNameList.count + 1) * kScreenWidth) {
scrollView.contentOffset = CGPoint(x: kScreenWidth,y: 0)
self.pageControl.currentPage = 0
} else {
self.pageControl.currentPage = Int(scrollView.contentOffset.x / kScreenWidth) - 1
}
}
}
/// collectionView圖片的cell
class ImageCollectionViewCell: UICollectionViewCell {
/// 顯示的圖片
let imageView = UIImageView()
var imageName: String? = "" {
didSet {
if let name = imageName {
imageView.image = UIImage(named: name)
}
}
}
override init(frame: CGRect) {
super.init(frame: frame)
setupCell();
}
/// 初始化視圖
func setupCell() {
imageView.frame = self.bounds
contentView.addSubview(imageView)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
ok，喜歡的話可以點(diǎn)一下收藏哈咧七，用UIScrollView實(shí)現(xiàn)輪播的原理在http://www.reibang.com/p/7c4b79e5b123衰齐，大家需要的話也可以了解一下。
