19.制作自动切换滚动的图片轮播

在某些软件里, 我们会经常看到一些广告图片在自动轮播, 比如淘宝, 京东这些电商软件就经常有了, 现在让我们也来动手自己试试看!


1.布局界面

1

2


2.实现代码

绑定控件, 声明变量

// 1.绑定scrollView控件 
@IBOutlet weak var scrollview: UIScrollView! 

// 2.绑定pageControl控件 
@IBOutlet weak var pageControl: UIPageControl! 

// 3.创建一个NSTimer变量 
var timer: NSTimer!

ViewDidLoad

override func viewDidLoad() { 
    super.viewDidLoad() 
    // 4.设置一共有多少张图片 
    var totalCount: NSInteger = 3 

    // 5.遍历有多少张图片 
    for index in 0 ..< totalCount { 
        // 5.1.声明一个UIImageView 
        var imageView: UIImageView = UIImageView() 

        // 5.2.设置UIImageView的Frame 
        imageView.frame = CGRectMake(CGFloat(index) * self.view.frame.size.width, 0, self.view.frame.size.width, self.view.frame.size.height) 

        // 5.3.设置Image的名称 
        let name: NSString = NSString(format: "image_0%d", index+1) 

        // 5.4.使用Image 
        imageView.image = UIImage(named: name as String) 

        // 5.5.把设置好的ImageView添加到ScrollView中 
        self.scrollview.addSubview(imageView) 
    } 

    // 6.设置ScrollView的contentSize 
    self.scrollview.contentSize = CGSizeMake(self.view.frame.size.width * CGFloat(totalCount), 0) 

    // 7.开启ScrollView的翻页效果 
    self.scrollview.pagingEnabled = true 

    // 8.设置ScrollView的代理对象 
    self.scrollview.delegate = self 

    // 9.设置pageControl的page数量 
    self.pageControl.numberOfPages = totalCount 

    // 10.添加定时器 
    self.addTimer() 
}

UIScrollView的代理方法

// 11.UIScrollView的代理方法, 当UIScrollView滚动时调用
func scrollViewDidScroll(scrollView: UIScrollView) { 
    // 11.1.计算出当前的page数 
    let page: Int = (Int)((scrollview.contentOffset.x + scrollview.frame.size.width / 2) / scrollview.frame.size.width) 

    // 11.2.把计算出的page数赋给pageControl当前的page 
    self.pageControl.currentPage = page 
} 

// 12.UIScrollView的代理方法, 当UIScrollView开始滚动时调用
func scrollViewWillBeginDragging(scrollView: UIScrollView) { 
    self.removeTimer() 
} 

// 13.UIScrollView的代理方法, 当UIScrollView结束滚动时调用 
func scrollViewDidEndDragging(scrollView: UIScrollView, willDecelerate decelerate: Bool) { 
    self.addTimer() 
}

自定义的方法

// 14.自定义定时器的方法 
func addTimer(){ 
    // 14.1.自定义定时器, 设置时间是2秒调用一次, 监听方法为"nextImage" 
    self.timer = NSTimer.scheduledTimerWithTimeInterval(2.0, target: self, selector: "nextImage:", userInfo: nil, repeats: true); 

    // 14.2.开始执行定时器 
    NSRunLoop.currentRunLoop().addTimer(self.timer, forMode: NSRunLoopCommonModes)
} 

// 15.删除定时器的方法 
func removeTimer(){ 
    self.timer.invalidate()
} 

// 16.自定义自动切换到下一张图片的方法, 定时器的监听方法 
func nextImage(sender:AnyObject!){ 
    // 16.1.使用UIView的animate 

    UIView.animateWithDuration(1.0, animations: { () -> Void in 
        // 16.2.获取self.pageControl的当前page 
        var page: Int = self.pageControl.currentPage 

        // 16.3.判断当前的page数, 如果当前的page数是最后一个, 那么就重置为第0个 
        if page == 2 { 
            page = 0 
        } else { 
            // 16.4.否则就继续自增 
            ++page 
        } 

        // 16.5.设置scrollView的偏移量 
        self.scrollview.contentOffset = CGPointMake(CGFloat(page) * self.view.frame.size.width, 0) 
    }, completion: nil) 
}

3.最终效果

0


工程项目地址: 链接: http://pan.baidu.com/s/1c0hkrgk 密码: 39s9

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值