我写android的时候实现图片轮播用的viewpager,其实还算可以,也不是特麻烦,用swift实现图片轮播我用的scrollview+pageControl ,今天我记录一下实现的过程,理清一下思路。
思路是这样的。
这个一个scrollview,横着放,里面放了四张图片,计算出图片的frame,实现轮播的时候,我们去计算scrollview的offset偏移量,然后用定时器timer去触发滚动,计算当前的偏移量和page,配合pageControll,指示器改变,当到达最后一张图片的时候我们把page设为0。重新滚动。
效果图:
接下来动手来写了。
1、初始化imageView,计算imageview的frame,并设置scrollView的属性
func initView(){
let image_W:CGFloat = self.scrollview.frame.size.width
let image_H:CGFloat = self.scrollview.frame.size.height
var image_Y:CGFloat = 0
var totalCount:NSInteger = 5
for index in 0..<totalCount{
var imageView:UIImageView = UIImageView()
let image_X:CGFloat = CGFloat(index) * image_W
imageView.frame = CGRectMake(image_X,image_Y,image_W,image_H)
let name:NSString = NSString(format:"image_%d",index+1)
imageView.image = UIImage(named:name as String)
self.scrollview.showsHorizontalScrollIndicator = false
self.scrollview.addSubview(imageView)
}
self.view.addSubview(pagecontrol)
let content_W:CGFloat = image_W * CGFloat(totalCount)
self.scrollview.contentSize = CGSizeMake(content_W,0)
self.scrollview.pagingEnabled = true;
//self.scrollview.delegate = self
self.pagecontrol.numberOfPages = totalCount
self.addTimer()
}
看上面代码我们已经把图片像上面的图片一样摆好了。并且设置的scrollview的contentSize(内容大小),pageEnabled(是否可以分页)
2、实现scrollview的delegate。
func scrollViewDidScroll(scrollView: UIScrollView) {
let scrollviewW:CGFloat = scrollview.frame.size.width
let x:CGFloat = scrollview.contentOffset.x
let page:Int = (Int)((x + scrollviewW / 2) / scrollviewW)
self.pagecontrol.currentPage = page
}
func scrollViewWillBeginDragging(scrollView: UIScrollView) {
println("scrollViewWillBeginDragging")
self.removeTimer()
}
func scrollViewDidEndDragging(scrollView: UIScrollView,willDecelerate decelerate: Bool) {
println("scrollViewDidEndDragging")
self.addTimer()
}
第一个方法监听scrollview是否滑动,这里我们计算出当前page。第二个方法监听是否开始拖动的动作(把定时器关掉),第三个方法监听拖动结束的操作(把定时器重新打开)。
3、实现定时器Timer
func addTimer(){
self.timer = NSTimer.scheduledTimerWithTimeInterval(1,target: self,selector: "nextImage:",userInfo: nil,repeats: true)
NSRunLoop.currentRunLoop().addTimer(self.timer,forMode: NSRunLoopCommonModes)
}
func removeTimer(){
self.timer.invalidate()
}
func nextImage(sender:AnyObject!){
var page:Int = self.pagecontrol.currentPage
if(page == 4){
page = 0
}else{
++page
}
let x:CGFloat = CGFloat(page) * self.scrollview.frame.size.width
self.scrollview.contentOffset = CGPointMake(x,0)
}
定时器每个隔1s去出发nextImage这个方法,这里重新计算page。然后把timer加入NSRunLoop中,这个类的作用是监听timer是否触发,触发的时候就让他工作,没有触发就让它休眠。如果想要深入了解的话,大家可以去百度查官方文档。面试的时候经常会问到。
错误总结:
1、pageControl指示器拖到scrollview,然后被图片覆盖看不到。
解决办法:self.view.addSubView(pageControl),将pageControl加入父view中,这样的就不会再scrollview中了。