UIPageControl
UIPageControl manages control between pages.
Example
Instructions
Create
- Open Xcode
- Click File
- Click New
- Click Project...
- Under iOS, click Application
- Click Single View Application
- Click Next
- After Product Name, type your product name
- After Organization Name, type your organization name or leave blank
- After Organization Identifier, type your organization identifier
- After Language, select Swift
- After Devices, select Universal
- Uncheck Use Core Data
- Click Next
- Select a folder
- After Source Control, uncheck Create Git repository on
- Click Create
Edit ViewController.swift
- Open ViewController.swift
- Copy and paste code
Edit Main.storyboard
- Open Main.storyboard
- Click View
- Click Utilities
- Click Show Object Library
- Drag Page Control to View
- Click View
- Click Utilities
- Click Show Connections Inspector
- Under Sent Events, after Value Changed, drag + to View Controller
- Click valueChanged:
- Under Referencing Outlets, after New Referencing Outlet, drag + to View Controller
- Click interfaceBuilderPageControl
Run
- Click Product
- Click Run
Code
import UIKit class ViewController: UIViewController { @IBOutlet weak var interfaceBuilderPageControl: UIPageControl! var defersCurrentPageDisplayPageControl: UIPageControl! var blueView: UIView! var greenView: UIView! var redView: UIView! override func prefersStatusBarHidden() -> Bool { return true } override func viewDidLoad() { super.viewDidLoad() self.view.backgroundColor = UIColor.lightGrayColor() self.redView = UIView() self.redView.backgroundColor = UIColor.redColor() self.redView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(self.redView) self.view.removeConstraints(self.view.constraints()) self.view.addConstraint(NSLayoutConstraint(item: self.redView, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Height, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: self.redView, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) self.greenView = UIView() self.greenView.backgroundColor = UIColor.greenColor() self.greenView.hidden = true self.greenView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(self.greenView) self.view.addConstraint(NSLayoutConstraint(item: self.greenView, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Height, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: self.greenView, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) self.blueView = UIView() self.blueView.backgroundColor = UIColor.blueColor() self.blueView.hidden = true self.blueView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(self.blueView) self.view.addConstraint(NSLayoutConstraint(item: self.blueView, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Height, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: self.blueView, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) self.view.bringSubviewToFront(self.interfaceBuilderPageControl) self.view.addConstraint(NSLayoutConstraint(item: self.interfaceBuilderPageControl, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) let numberOfPagesPageControl = UIPageControl() numberOfPagesPageControl.numberOfPages = 5 numberOfPagesPageControl.setTranslatesAutoresizingMaskIntoConstraints(false) numberOfPagesPageControl.addTarget(self, action: "valueChanged:", forControlEvents: UIControlEvents.ValueChanged) self.view.addSubview(numberOfPagesPageControl) self.view.addConstraint(NSLayoutConstraint(item: numberOfPagesPageControl, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: self.interfaceBuilderPageControl, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: numberOfPagesPageControl, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) let currentPagePageControl = UIPageControl() currentPagePageControl.numberOfPages = 3 currentPagePageControl.currentPage = 2 currentPagePageControl.setTranslatesAutoresizingMaskIntoConstraints(false) currentPagePageControl.addTarget(self, action: "valueChanged:", forControlEvents: UIControlEvents.ValueChanged) self.view.addSubview(currentPagePageControl) self.view.addConstraint(NSLayoutConstraint(item: currentPagePageControl, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: numberOfPagesPageControl, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: currentPagePageControl, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) let currentPageIndicatorTintColorPageControl = UIPageControl() currentPageIndicatorTintColorPageControl.currentPageIndicatorTintColor = UIColor.blackColor() currentPageIndicatorTintColorPageControl.numberOfPages = 3 currentPageIndicatorTintColorPageControl.setTranslatesAutoresizingMaskIntoConstraints(false) currentPageIndicatorTintColorPageControl.addTarget(self, action: "valueChanged:", forControlEvents: UIControlEvents.ValueChanged) self.view.addSubview(currentPageIndicatorTintColorPageControl) self.view.addConstraint(NSLayoutConstraint(item: currentPageIndicatorTintColorPageControl, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: currentPagePageControl, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: currentPageIndicatorTintColorPageControl, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) let pageIndicatorTintColorPageControl = UIPageControl() pageIndicatorTintColorPageControl.numberOfPages = 3 pageIndicatorTintColorPageControl.pageIndicatorTintColor = UIColor.blackColor() pageIndicatorTintColorPageControl.setTranslatesAutoresizingMaskIntoConstraints(false) pageIndicatorTintColorPageControl.addTarget(self, action: "valueChanged:", forControlEvents: UIControlEvents.ValueChanged) self.view.addSubview(pageIndicatorTintColorPageControl) self.view.addConstraint(NSLayoutConstraint(item: pageIndicatorTintColorPageControl, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: currentPageIndicatorTintColorPageControl, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: pageIndicatorTintColorPageControl, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) let hidesForSinglePagePageControl = UIPageControl() hidesForSinglePagePageControl.hidesForSinglePage = true hidesForSinglePagePageControl.numberOfPages = 1 hidesForSinglePagePageControl.setTranslatesAutoresizingMaskIntoConstraints(false) hidesForSinglePagePageControl.addTarget(self, action: "valueChanged:", forControlEvents: UIControlEvents.ValueChanged) self.view.addSubview(hidesForSinglePagePageControl) self.view.addConstraint(NSLayoutConstraint(item: hidesForSinglePagePageControl, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: pageIndicatorTintColorPageControl, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: hidesForSinglePagePageControl, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) self.defersCurrentPageDisplayPageControl = UIPageControl() self.defersCurrentPageDisplayPageControl.defersCurrentPageDisplay = true self.defersCurrentPageDisplayPageControl.numberOfPages = 3 self.defersCurrentPageDisplayPageControl.setTranslatesAutoresizingMaskIntoConstraints(false) self.defersCurrentPageDisplayPageControl.addTarget(self, action: "valueChanged:", forControlEvents: UIControlEvents.ValueChanged) self.view.addSubview(self.defersCurrentPageDisplayPageControl) self.view.addConstraint(NSLayoutConstraint(item: self.defersCurrentPageDisplayPageControl, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: hidesForSinglePagePageControl, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: self.defersCurrentPageDisplayPageControl, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) let button = UIButton.buttonWithType(UIButtonType.System) as UIButton button.addTarget(self, action: "touchUpInside:", forControlEvents: UIControlEvents.TouchUpInside) button.setTitle("Update", forState: UIControlState.Normal) button.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(button) self.view.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: self.defersCurrentPageDisplayPageControl, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0)) } @IBAction func valueChanged(sender: UIPageControl!) { switch (sender.currentPage) { case 0: self.redView.hidden = false self.greenView.hidden = true self.blueView.hidden = true break; case 1: self.redView.hidden = true self.greenView.hidden = false self.blueView.hidden = true break; case 2: self.redView.hidden = true self.greenView.hidden = true self.blueView.hidden = false break; default: self.redView.hidden = true self.greenView.hidden = true self.blueView.hidden = true break; } } func touchUpInside(sender: UIButton!) { self.defersCurrentPageDisplayPageControl.updateCurrentPageDisplay() } }