加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

Swift-轻松实现图片轮播

发布时间:2020-12-14 01:53:24 所属栏目:百科 来源:网络整理
导读:我写android的时候实现图片轮播用的viewpager,其实还算可以,也不是特麻烦,用swift实现图片轮播我用的scrollview+pageControl ,今天我记录一下实现的过程,理清一下思路。 思路是这样的。 这个一个scrollview,横着放,里面放了四张图片,计算出图片的fr

我写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中了。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读