码迷,mamicode.com
首页 > 编程语言 > 详细

Swift - 页控件(UIPageControl)的用法

时间:2015-09-25 16:18:18      阅读:195      评论:0      收藏:0      [点我收藏+]

标签:

使用页控件可以用来展示多个桌面。比如很多应用第一次登陆时,会在开始页面使用页控件来介绍功能,通过左右滑动来切换页。

通常我们使用UIPageControl和UIScrollView相互结合来实现多页切换,滑动页面时页控件标签(即页面下方的小白点)会更新到对应的页面。而直接点击页标签时,滚动条也会滚到相应的页。
UIPageControl的当前页小圆点和非当前小圆点的颜色是可以设置的,同时如果只有一页的时候也可以选择是否显示圆点

效果图如下:
  技术分享  技术分享

代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
import UIKit
 
class ViewController: UIViewController, UIScrollViewDelegate {
     
    //界面设计元素引用
    @IBOutlet var pageControl: UIPageControl!
    @IBOutlet var scrollView: UIScrollView!
     
    //需要显示的页面内容
    var courses = [
        ["name":"Swift","pic":"swift.png"],
        ["name":"ObjectC","pic":"oc.jpg"],
        ["name":"Java","pic":"java.png"]
    ]
     
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
         
         
        //设置scrollView的内容总尺寸
        scrollView.contentSize = CGSizeMake(
            CGFloat(CGRectGetWidth(self.view.bounds)) * CGFloat(self.courses.count),
            CGRectGetHeight(self.view.bounds)
        )
        //关闭滚动条显示
        scrollView.showsHorizontalScrollIndicator = false
        scrollView.showsVerticalScrollIndicator = false
        scrollView.scrollsToTop = false
        //协议代理,在本类中处理滚动事件
        scrollView.delegate = self
        //滚动时只能停留到某一页
        scrollView.pagingEnabled = true
        //添加页面到滚动面板里
        let size = scrollView.bounds.size
        for (seq,course) in enumerate(courses) {
            var page = UIView()
            var imageView=UIImageView(image:UIImage(named:course["pic"]!))
            page.addSubview(imageView);
            page.backgroundColor = UIColor.greenColor()
            let lbl = UILabel(frame: CGRect(x: 0, y: 20, width: 100, height: 20))
            lbl.text = course["name"]
            page.addSubview(lbl)
             
            page.frame = CGRect(x: CGFloat(seq) * size.width, y: 0,
              width: size.width, height: size.height)
            scrollView.addSubview(page)
        }
         
        //页控件属性
        pageControl.backgroundColor = UIColor.clearColor()
        pageControl.numberOfPages = courses.count
        pageControl.currentPage = 0
        //设置页控件点击事件
        pageControl.addTarget(self, action: "pageChanged:", forControlEvents: UIControlEvents.ValueChanged)
    }
 
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
     
    //UIScrollViewDelegate方法,每次滚动结束后调用
    func scrollViewDidEndDecelerating(scrollView: UIScrollView!) {
        //通过scrollView内容的偏移计算当前显示的是第几页
        let page = Int(scrollView.contentOffset.x / scrollView.frame.size.width)
        //设置pageController的当前页
        pageControl.currentPage = page
    }
     
    //点击页控件时事件处理
    func pageChanged(sender:UIPageControl) {
        //根据点击的页数,计算scrollView需要显示的偏移量
        var frame = scrollView.frame
        frame.origin.x = frame.size.width * CGFloat(sender.currentPage)
        frame.origin.y = 0
        //展现当前页面内容
        scrollView.scrollRectToVisible(frame, animated:true)
    }
}


--- Main.storyboard ---

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="6154.21" systemVersion="13D65" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" initialViewController="BYZ-38-t0r">
    <dependencies>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="6153.13"/>
    </dependencies>
    <scenes>
        <!--View Controller-->
        <scene sceneID="tne-QT-ifu">
            <objects>
                <viewController id="BYZ-38-t0r" customClass="ViewController" customModule="SwiftInAction_008_019" customModuleProvider="target" sceneMemberID="viewController">
                    <layoutGuides>
                        <viewControllerLayoutGuide type="top" id="y3c-jy-aDJ"/>
                        <viewControllerLayoutGuide type="bottom" id="wfy-db-euE"/>
                    </layoutGuides>
                    <view key="view" contentMode="scaleToFill" id="8bC-Xf-vdC">
                        <rect key="frame" x="0.0" y="0.0" width="480" height="480"/>
                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                        <subviews>
                            <scrollView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" fixedFrame="YES" translatesAutoresizingMaskIntoConstraints="NO" id="MQq-Dc-kWf">
                                <rect key="frame" x="0.0" y="20" width="320" height="460"/>
                            </scrollView>
                            <pageControl opaque="NO" contentMode="scaleToFill" fixedFrame="YES" contentHorizontalAlignment="center" contentVerticalAlignment="center" numberOfPages="3" translatesAutoresizingMaskIntoConstraints="NO" id="Rre-R2-IHS">
                                <rect key="frame" x="150" y="339" width="60" height="37"/>
                                <color key="pageIndicatorTintColor" white="0.66666666666666663" alpha="1" colorSpace="calibratedWhite"/>
                            </pageControl>
                        </subviews>
                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
                        <simulatedOrientationMetrics key="simulatedOrientationMetrics" orientation="landscapeRight"/>
                    </view>
                    <connections>
                        <outlet property="pageControl" destination="Rre-R2-IHS" id="R3n-tp-UIl"/>
                        <outlet property="scrollView" destination="MQq-Dc-kWf" id="scK-rG-Yia"/>
                    </connections>
                </viewController>
                <placeholder placeholderIdentifier="IBFirstResponder" id="dkx-z0-nzr" sceneMemberID="firstResponder"/>
            </objects>
        </scene>
    </scenes>
</document>

Swift - 页控件(UIPageControl)的用法

标签:

原文地址:http://www.cnblogs.com/Free-Thinker/p/4838316.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!