Swift-UICollectionView无限轮播

Swift简单的轮播图

//
//  CycleView.swift
//

import UIKit
import SDWebImage

let CycleViewCellIdentifier: String = "CycleViewCellIdentifier"
let width = (UIScreen.main.bounds.size.width)
let height = (UIScreen.main.bounds.size.width)
let MaxSection = 100

// 协议
protocol CycleViewDelegate {
    func didSelectIndexCollectionViewCell(index: Int)->Void
}

class CycleView: UIView {
    
    //MARK: -属性列表
    
    /// 图片数组
    var imageArray: [String]?
    {
        didSet{
            pageControl.isHidden = (imageArray?.count == 1)
            pageControl.numberOfPages = (imageArray?.count)!
            collectionView.reloadData()
            startTimer()
        }
    }
    /// title数组
    var titleArray: [String]?
    {
        didSet{
            collectionView.reloadData()
            startTimer()
        }
    }
    /// 轮播时间
    var time: TimeInterval = 2
    {
        didSet{
            startTimer()
        }
    }
    
    var timer: Timer?
    var delegate: CycleViewDelegate?
    
    //MARK: -初始化
    override init(frame: CGRect) {
        super.init(frame: frame)
        
        // 初始化UI
        setupUI(frame: frame)
    }
    override func layoutSubviews() {
        super.layoutSubviews()
        // 1.有导航控制器时，会默认在scrollview上方添加64的内边距，这里强制设置为0
        collectionView.contentInset = UIEdgeInsets.zero
        collectionView.scrollToItem(at: IndexPath(item: 0, section: MaxSection/2), at: .left, animated: false)
        
        // 2.设置subView的frame
        collectionView.frame = CGRect(x: 0, y: 0, width: self.frame.width, height: self.frame.height)
        pageControl.frame = CGRect(x: 0, y: 0, width: self.frame.size.width / 2, height: 15)
        pageControl.center = CGPoint(x: self.frame.size.width / 2, y: self.frame.size.height - 15)
    }
    
    //MARK: -Function
    /// 初始化UI
    private func setupUI(frame:CGRect){
        
        // 1.添加子控件
        addSubview(collectionView)
        addSubview(pageControl)
    }
    
    /// 开始定时器
    func startTimer(){
        
        //如果只有一张图片，则直接返回，不开启定时器
        if imageArray?.count == 1 {
            return
        }
        //如果定时器已开启，先停止再重新开启
        if (timer != nil) {
            endTimer()
        }
        
        timer = Timer.init(timeInterval: time, target: self, selector: #selector(nextPageView), userInfo: nil, repeats: true)
        RunLoop.current.add(timer!, forMode: RunLoopMode.commonModes)
    }
    
    /// 停止定时器
    func endTimer(){
        timer?.invalidate()
        timer = nil
    }
    
    //MARK: -进入下一页
    func nextPageView()
    {
        //获取当前indexPath
        let currentIndexPath = collectionView.indexPathsForVisibleItems.last!
        //获取中间那一组的indexPath
        let middleIndexPath = IndexPath(item: currentIndexPath.item, section: MaxSection/2)
        //滚动到中间那一组
        collectionView.scrollToItem(at: middleIndexPath, at: .left, animated: false)
        
        var nextItem = middleIndexPath.item + 1
        var nextSection = middleIndexPath.section
        if nextItem == imageArray?.count {
            nextItem = 0
            nextSection += 1
        }
        collectionView.scrollToItem(at: IndexPath(item: nextItem, section: nextSection), at: .left, animated: true)
    }
    
    //MARK: -懒加载
    fileprivate lazy var collectionView: UICollectionView = {
        print(self.frame)
        let flowLayout = CycleScrollViewFlowLayout()
        flowLayout.itemSize = CGSize(width: self.frame.size.width, height: self.frame.size.height)
        let clv = UICollectionView(frame: CGRect.zero, collectionViewLayout: flowLayout)
        clv.register(CycleViewCell.self, forCellWithReuseIdentifier: CycleViewCellIdentifier)
        clv.dataSource = self
        clv.delegate = self
        return clv
    }()
    fileprivate lazy var pageControl: UIPageControl = {
        let pc = UIPageControl()
        pc.isUserInteractionEnabled = false
        return pc
    }()
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

//MARK: -
extension CycleView: UICollectionViewDelegate,UICollectionViewDataSource
{
    //MARK: -UICollectionViewDataSource
    func numberOfSections(in collectionView: UICollectionView) -> Int {
        return MaxSection
    }
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        
        return imageArray?.count ?? 0
    }
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: CycleViewCellIdentifier, for: indexPath) as! CycleViewCell
        cell.dict = ["labelText":titleArray?.count == nil  ? "labelText" : (titleArray?[indexPath.row])!,
                     "imageStr" :(imageArray?[indexPath.row])!]
        return cell
    }
    
    
    //MARK: -UICollectionViewDelegate
    // 点击轮播图片
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        self.delegate?.didSelectIndexCollectionViewCell(index: indexPath.row)
    }
    
    
    //MARK: -UIScrollViewDelegate
    // 停止拖拽的时候开始执行
    func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
        endTimer()
    }
    
    // 停止拖拽的时候开始执行
    func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
        startTimer()
    }
    
    // 手指离开减速停止的时候开始执行
    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
        //暂不做处理
    }
    
    //在这个方法中算出当前页数
    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        let page = Int((scrollView.contentOffset.x + (collectionView.bounds.width) * 0.5) / (collectionView.bounds.width))
        let currentPage = page % (imageArray?.count)!
        pageControl.currentPage = currentPage
        
        //起始位置和最终位置的切换
        if scrollView.contentOffset.x >= (CGFloat)((imageArray?.count)! * MaxSection - 3) * width || scrollView.contentOffset.x <= 2{
            collectionView.scrollToItem(at: IndexPath(item: pageControl.currentPage, section: MaxSection/2), at: .left, animated: false)
        }
    }
}

//MARK: -
class CycleScrollViewFlowLayout:UICollectionViewFlowLayout
{
    override func prepare() {
        
        // 1.设置layout布局
        minimumInteritemSpacing = 0
        minimumLineSpacing = 0
        scrollDirection = UICollectionViewScrollDirection.horizontal
        
        // 2.设置collectionView的属性
        collectionView?.isPagingEnabled = true
        collectionView?.showsHorizontalScrollIndicator = false
        collectionView?.showsVerticalScrollIndicator = false
    }
}

//MARK: -
let CycleViewCellBottomViewHeight: CGFloat = 30
let CycleViewCellMargin: CGFloat = 10

class CycleViewCell: UICollectionViewCell {
    
    var dict: [String:String]?
    {
        didSet{
            iconImageView.sd_setImage(with: NSURL(string: (dict!["imageStr"])!) as URL?, placeholderImage: UIImage(named: "banner"))
            
            if dict?["labelText"] == "labelText" {
                titleLabel.isHidden = true
                bottomView.isHidden = true
            }
            else
            {
                titleLabel.text = dict?["labelText"]
                titleLabel.isHidden = false
                bottomView.isHidden = false
            }
        }
    }
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        // 1.添加子控件
        contentView.addSubview(iconImageView)
        iconImageView.addSubview(bottomView)
        bottomView.addSubview(titleLabel)
        
        // 2.布局子控件
        iconImageView.frame = CGRect(x: 0, y: 0, width: frame.size.width, height: frame.size.height)
        bottomView.frame = CGRect(x: 0, y: frame.size.height - CycleViewCellBottomViewHeight, width: height, height: CycleViewCellBottomViewHeight)
        titleLabel.frame = CGRect(x: CycleViewCellMargin, y: 0, width: height - 2*CycleViewCellMargin, height: CycleViewCellBottomViewHeight)
    }
    
    //MARK: -懒加载
    private lazy var iconImageView: UIImageView = {
        let img = UIImageView()
        return img
    }()
    private lazy var bottomView: UIView = {
        let view = UIView()
        view.backgroundColor = UIColor.init(red: 0, green: 0, blue: 0, alpha: 0.5)
        return view
    }()
    private lazy var titleLabel: UILabel = {
        let label = UILabel()
        label.textColor = UIColor.white
        label.font = UIFont.systemFont(ofSize: 14)
        return label
    }()
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

效果图

WechatIMG31013.jpeg

如果有什么问题请大家指正，谢谢！

推荐轮播1 - SDCycleScrollView
推荐轮播2 - XRCarouselView
推荐轮播2 - 创建轮播图的四种思路