Swift-ScrollView輪播圖的簡易封裝和使用

不多說，輪播圖是開發中必要一項技能，直接上代碼：

先說我的思路：首次繼承於UIScrollView類自定義MyScrollView，在MyScrollView里自定制方法，func creatMyScrollView(imageName:[String],height:CGFloat)在里面完成動態布局，通過傳入的兩個參數imageName,height來制作輪播圖的圖片和高度，設置contentSize屬性和pagingEnabled屬性，上代碼:

首先繼承於UIScrollView自定義MyScrollView類

class ZYF_MyScrollView: UIScrollView {}

自定義方法

scrollView的輪播就是利用其偏移量來進行設置，如果實現n張圖片自動輪播，創建計時器是必須的，在scrollView中創建n+1張圖片，容量也是n+1張圖片的容量。讓第1張和最后一張是同一張圖片，在偏移量達到n*width的時候，讓偏移量置零，這樣，在即將顯示最后一張圖的時候，scrollView的展示圖片瞬間變成第一張，然后繼續往后播。這樣形成了我們常見的輪播效果

class ZYF_MyScrollView: UIScrollView {
	func creatMyScrollView(imageName:[String],height:CGFloat) {
		//動態布局
		 for i in 0...(imageName.count - 1) {
            let imageView = UIImageView(frame: CGRectMake(CGFloat(i) * width,0,width,height))
            self.addSubview(imageView)
            
          	//設置輪播圖圖片
            imageView.image = UIImage(named: imageName[i])
        }
	//設置輪播圖容量
	self.contentSize = CGSizeMake(CGFloat(imageName.count ) * width, height)
	//設置吸附屬性
    self.bounces = false
    //設置書頁效果
    self.pagingEnabled = true
    
    //單獨創建第n+1張輪播圖，和第一張圖片是同一張圖
    let imageView = UIImageView(frame:CGRectMake(CGFloat(imageName.count) * width, 0, width, height))
    imageView.image = UIImage(named:imageName[0])
    self.addSubview(imageView)
		
	}
}

這樣就算是簡單的封裝了一下，使用方法如下：

在你要放置的輪播圖的.swift文件中生成 ZYF_MyScrollView的對象

let scr = ZYF_MyScrollView()

創建圖片名稱數組

let iamgeNames = ["App公測","簡書出版","簡書官方專題","簡書月刊","簡書出版","簡書官方專題"]

調用creatUI方法,傳入圖片名稱數組，設置高度

func creatScrollView() {
     let view = UIView(frame: CGRectMake(0,0,UIScreen.mainScreen.bounds.size.width,280))
	scr.creatUI(imageNames,height:200)
	view.addSubView(scr)
}

到此，一個能夠拖動的輪播圖就制作結束了，實現自動輪播，下面我們需要借助計時器NSTimer

創建NSTimer

 //創建輪播圖定時器
    func creatTimer() {
    let  timer =  NSTimer.scheduledTimerWithTimeInterval(3, target: self, selector: #selector(self.timerManager), userInfo: nil, repeats: true)
    
    //這句話實現多線程，如果你的ScrollView是作為TableView的headerView的話，在拖動tableView的時候讓輪播圖仍然能輪播就需要用到這句話
    NSRunLoop.currentRunLoop().addTimer(timer, forMode: NSRunLoopCommonModes)

    }

    //創建定時器管理者
    func timerManager() {
    	//設置偏移量scr.setContentOffset(CGPointMake(scr.contentOffset.x + width, 0), animated: true)
    	//當偏移量達到最后一張的時候，讓偏移量置零
        if scr.contentOffset.x == CGFloat(width) * CGFloat(imageNames.count) {
            scr.contentOffset = CGPointMake(0, 0)
        }

    }

到此，自動輪播圖制作完畢，在使用中還缺少了一個組件，就是小白點UIPageControl,回到func creatScrollView(){}中

func creatScrollView() {
	let view =  let view = UIView(frame: CGRectMake(0,0,UIScreen.mainScreen.bounds.size.width,280))
	scr.creatUI(imageNames,height:200)`
	view.addSubView(scr)
	let page = UIPageControl()
	page.frame = CGRectMake(width / 2 - 50,160,100,30)
    page.numberOfPages = imageNames.count
    //將小白點放到scr之上
    view.insertSubview(page, aboveSubview: scr)
}

遵守UIScrollViewDelegate協議，設置小白點的跟隨輪動

  //當手動滾動視圖翻頁時調用該方法
    var cnt = 0
    func scrollViewDidEndDecelerating(scrollView: UIScrollView) {
        let cPage = scr.contentOffset.x / width
        page.currentPage = Int(cPage)
        cnt = Int(cPage)
    }

    //自動播放時，調用該方法
    func scrollViewDidEndScrollingAnimation(scrollView: UIScrollView) {
        cnt += 1
        page.currentPage = cnt % imageNames.count
    }

到此，全部工程就完成了

效果如下