不多說(shuō),輪播圖是開(kāi)發(fā)中必要一項(xiàng)技能,直接上代碼:
先說(shuō)我的思路:首次繼承于UIScrollView類自定義MyScrollView,在MyScrollView里自定制方法,func creatMyScrollView(imageName:[String],height:CGFloat)在里面完成動(dòng)態(tài)布局,通過(guò)傳入的兩個(gè)參數(shù)imageName,height來(lái)制作輪播圖的圖片和高度,設(shè)置contentSize屬性和pagingEnabled屬性,上代碼:
首先繼承于UIScrollView自定義MyScrollView類
class ZYF_MyScrollView: UIScrollView {}
自定義方法
scrollView的輪播就是利用其偏移量來(lái)進(jìn)行設(shè)置,如果實(shí)現(xiàn)n張圖片自動(dòng)輪播,創(chuàng)建計(jì)時(shí)器是必須的,在scrollView中創(chuàng)建n+1張圖片,容量也是n+1張圖片的容量。讓第1張和最后一張是同一張圖片,在偏移量達(dá)到n*width的時(shí)候,讓偏移量置零,這樣,在即將顯示最后一張圖的時(shí)候,scrollView的展示圖片瞬間變成第一張,然后繼續(xù)往后播。這樣形成了我們常見(jiàn)的輪播效果
class ZYF_MyScrollView: UIScrollView {
func creatMyScrollView(imageName:[String],height:CGFloat) {
//動(dòng)態(tài)布局
for i in 0...(imageName.count - 1) {
let imageView = UIImageView(frame: CGRectMake(CGFloat(i) * width,0,width,height))
self.addSubview(imageView)
//設(shè)置輪播圖圖片
imageView.image = UIImage(named: imageName[i])
}
//設(shè)置輪播圖容量
self.contentSize = CGSizeMake(CGFloat(imageName.count ) * width, height)
//設(shè)置吸附屬性
self.bounces = false
//設(shè)置書(shū)頁(yè)效果
self.pagingEnabled = true
//單獨(dú)創(chuàng)建第n+1張輪播圖,和第一張圖片是同一張圖
let imageView = UIImageView(frame:CGRectMake(CGFloat(imageName.count) * width, 0, width, height))
imageView.image = UIImage(named:imageName[0])
self.addSubview(imageView)
}
}
這樣就算是簡(jiǎn)單的封裝了一下,使用方法如下:
在你要放置的輪播圖的.swift文件中生成 ZYF_MyScrollView的對(duì)象
let scr = ZYF_MyScrollView()
創(chuàng)建圖片名稱數(shù)組
let iamgeNames = ["App公測(cè)","簡(jiǎn)書(shū)出版","簡(jiǎn)書(shū)官方專題","簡(jiǎn)書(shū)月刊","簡(jiǎn)書(shū)出版","簡(jiǎn)書(shū)官方專題"]
調(diào)用creatUI方法,傳入圖片名稱數(shù)組,設(shè)置高度
func creatScrollView() {
let view = UIView(frame: CGRectMake(0,0,UIScreen.mainScreen.bounds.size.width,280))
scr.creatUI(imageNames,height:200)
view.addSubView(scr)
}
到此,一個(gè)能夠拖動(dòng)的輪播圖就制作結(jié)束了,實(shí)現(xiàn)自動(dòng)輪播,下面我們需要借助計(jì)時(shí)器NSTimer
創(chuàng)建NSTimer
//創(chuàng)建輪播圖定時(shí)器
func creatTimer() {
let timer = NSTimer.scheduledTimerWithTimeInterval(3, target: self, selector: #selector(self.timerManager), userInfo: nil, repeats: true)
//這句話實(shí)現(xiàn)多線程,如果你的ScrollView是作為TableView的headerView的話,在拖動(dòng)tableView的時(shí)候讓輪播圖仍然能輪播就需要用到這句話
NSRunLoop.currentRunLoop().addTimer(timer, forMode: NSRunLoopCommonModes)
}
//創(chuàng)建定時(shí)器管理者
func timerManager() {
//設(shè)置偏移量scr.setContentOffset(CGPointMake(scr.contentOffset.x + width, 0), animated: true)
//當(dāng)偏移量達(dá)到最后一張的時(shí)候,讓偏移量置零
if scr.contentOffset.x == CGFloat(width) * CGFloat(imageNames.count) {
scr.contentOffset = CGPointMake(0, 0)
}
}
到此,自動(dòng)輪播圖制作完畢,在使用中還缺少了一個(gè)組件,就是小白點(diǎn)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
//將小白點(diǎn)放到scr之上
view.insertSubview(page, aboveSubview: scr)
}
遵守UIScrollViewDelegate協(xié)議,設(shè)置小白點(diǎn)的跟隨輪動(dòng)
//當(dāng)手動(dòng)滾動(dòng)視圖翻頁(yè)時(shí)調(diào)用該方法
var cnt = 0
func scrollViewDidEndDecelerating(scrollView: UIScrollView) {
let cPage = scr.contentOffset.x / width
page.currentPage = Int(cPage)
cnt = Int(cPage)
}
//自動(dòng)播放時(shí),調(diào)用該方法
func scrollViewDidEndScrollingAnimation(scrollView: UIScrollView) {
cnt += 1
page.currentPage = cnt % imageNames.count
}
到此,全部工程就完成了
效果如下
