IOS控件学习之UI ScrollView（7）

来源：互联网发布：阿里巴巴微商软件编辑：程序博客网时间：2024/04/28 05:43

1、语言：swift

2、实现内容：图片轮播（把之前的总结下）

3、效果图：

4、控件列表（见下图）：

5、注意

pageControl控件不能直接拖到scrollView控件中。从上图左边的结构中可以看出，pageControl控件与scrollView控件是在同一个级下。

我的方法是：将pageControl控件拖到ScrollView控件同一级下，通过调整其坐标和大小设置到ScrollView控件上。

6、图片轮播源码示例：

import UIKitclass ViewController: UIViewController,UIScrollViewDelegate {    /// 控件关联    @IBOutlet weak var scrollView: UIScrollView!    @IBOutlet weak var pageControl: UIPageControl!    var imageView:UIImageView!;        /// 定时器    var timer:NSTimer?;    ///  var flag:Bool! = false;            override func viewDidLoad() {        super.viewDidLoad()               //===========  scrollView属性设置    =============//        ///创建        addSubImageViewInScrollView();                /// 设置滚动属性，宽度为 5个图片的总宽度 之和. 高度，我的素材是80X80的，高度＝ 80        scrollView.contentSize = CGSizeMake(5 * scrollView.frame.size.width, 80);                /// 设置以页单位滚动        scrollView.pagingEnabled = true;                /// 隐藏横向滚动条        scrollView.showsHorizontalScrollIndicator = false;                //===========  pageControl属性设置    =============//        /// 设置默认显示的是第0页        pageControl.currentPage = 0;                /// 设置pagecontrol的总页数（这里，我只准备了5张图）        pageControl.numberOfPages = 5;                        /// 创建定时器        createTimer();    }        /// 创建一个定时器    func createTimer()    {        /// 创建一个定时器,创建好后，自动启动       timer = NSTimer.scheduledTimerWithTimeInterval(1.0, target: self, selector: "scrollImage", userInfo: nil, repeats: true);            }    /// timer执行代码，定时器中指定，每秒滚动一次图片    func scrollImage()    {        /// 如何让UIScrollView滚动到下一页                /// 1、获取当前的UIPageControl 的页码        var curPage = pageControl.currentPage;                /// 2、判断是否到了最后一页？ 若到了最后一页，回到第一页，若没有，则在当前页码上＋1        if (pageControl.numberOfPages - 1 == curPage)        {            curPage = 0        }        else        {            curPage++;        }//        /// 正向滚动//        if (false == flag)//        {//            if (pageControl.numberOfPages - 1 == curPage)//            {//                curPage -= 1;//               /// print("当前是反向第\(curPage)页")//                flag = true;//            }//            else//            {//                curPage += 1;//              ///  print("当前是正向第\(curPage)页");//                flag = false;//            }//        }//        if (true == flag)    /// 反向滚动//        {//            if (0 == curPage)//            {//                curPage += 1;//               /// print("当前是正向第\(curPage)页")//                flag = false;//            }//            else//            {//                curPage -= 1;//              ///  print("当前是反向第\(curPage)页")//                flag = true;//            }//        }                      /// 3、每页的宽度 X (页码＋1) ＝＝ 计算出了下一页的contentOffset.X        let offsetX = CGFloat(curPage) * scrollView.frame.size.width;                /// 4、重新设置 contentOffset的值        scrollView.setContentOffset(CGPointMake(offsetX, 0), animated: true);    }        /// 创建5 ＊ imageview    func addSubImageViewInScrollView()    {        for i in 0 ..< 5        {            imageView = UIImageView(frame: CGRectMake(CGFloat(i * 80), 0, scrollView.frame.size.width, scrollView.frame.size.height));                        /// 我准备的素材的图片名字是从2开始的            imageView.image = UIImage(named: "\(Int(i + 2)).png");                        /// 把imageview添加到scrollview中            scrollView.addSubview(imageView);        }    }            /// 即将滚动    func scrollViewWillBeginDragging(scrollView: UIScrollView)    {        timer = nil;    }        /// 开始滚动,获取当前滚动到哪一页了    func scrollViewDidScroll(scrollView: UIScrollView)    {        /* 计算公式为：x 方向上的偏移除以每张拖片的大小，商就是当前滚动到哪一页了。        */        let curPage = scrollView.contentOffset.x / scrollView.frame.size.width;                /// 设置页码给pageControl        pageControl.currentPage = Int(curPage);    }          /// 滚动结束    func scrollViewDidEndDecelerating(scrollView: UIScrollView)    {        createTimer();    }                    override func didReceiveMemoryWarning() {        super.didReceiveMemoryWarning()        // Dispose of any resources that can be recreated.    }}<span style="font-size:12px;color:#3333ff;"></span>

7、说明

A、事先准备好数张图片，大小最好是一样的嘛－－－－美观

B、我准备的素材名称是从2开始的，所以在代码中才会有：

/// 我准备的素材的图片名字是从2开始的            imageView.image = UIImage(named: "\(Int(i + 2)).png");

C、pageControl.currentPage默认是从 0 开始的。

0 0