UIPageControl - ホーム画面のように横方向にページ切り替え

f:id:oynop:20150227053211p:plain:h300 f:id:oynop:20150227053214p:plain:h300 f:id:oynop:20150227053209p:plain:h300

説明

UIPageControlはUIControlのサブクラス
これは今表示しているページを示す小さな丸のみを扱っている.
ページ遷移を扱うには自分でUIScrollViewを用いて実装する必要がある(MYPageControlView.swift).

ソースコード

UIPageControlSample.swift

import UIKit
class UIPageControlSample: UIView {
    override init(frame: CGRect) {
        super.init(frame: frame)
        self.backgroundColor = colorPattern.back()
        let pageFrame = CGRectMake(0, 0, 200, 300)
        let pcv = MYPageControlView(frame: pageFrame)
        pcv.center = self.center
        self.addSubview(pcv)
        
        for i in 0 ..< 6 {
            // 新たなページを作成
            let page = UIView(frame: pageFrame)
            if i%2 == 0 {
                page.backgroundColor = colorPattern.main()
            } else {
                page.backgroundColor = colorPattern.sub()
            }
            
            let label = UILabel(frame: CGRectMake(0, 0, 100, 30))
            label.center = CGPointMake(page.frame.width/2, page.frame.height/2)
            label.textAlignment = NSTextAlignment.Center
            label.text = "Page \(i)"
            label.textColor = colorPattern.lightText()
            //label.backgroundColor = colorPattern.back()
            page.addSubview(label)
            
            // ページを追加
            pcv.addPage(page)
        }
    }

    required init(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

MYPageControlView.swift

import UIKit
class MYPageControlView: UIView, UIScrollViewDelegate {
    var pc: UIPageControl!
    var sv: UIScrollView!
    var numberOfPages = 0
    override init(frame: CGRect) {
        super.init(frame: frame)
        self.backgroundColor = colorPattern.accent()
        
        // スクロールビューの初期化
        self.sv = UIScrollView(frame: frame)
        self.addSubview(self.sv)
        self.sv.delegate = self
        self.sv.showsHorizontalScrollIndicator = false
        self.sv.showsVerticalScrollIndicator = false
        self.sv.pagingEnabled = true

        // ページコントロールの初期化
        self.pc = UIPageControl(frame: CGRectMake(0, 0, frame.width, 30))
        self.addSubview(self.pc)
        self.pc.layer.position = CGPointMake(frame.width/2, frame.height - 30)
        // ページ数
        self.pc.numberOfPages = 0

        // 最初のページ番号
        self.pc.currentPage = 0

        // ページコントロールを対象にするタッチやキーボードなどのイベントを無効にする
        self.pc.userInteractionEnabled = false
        
        // デザイン
        self.pc.pageIndicatorTintColor = colorPattern.accentSub()
        self.pc.currentPageIndicatorTintColor = colorPattern.accent()
    }

    required init(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    // ページ追加
    func addPage(view: UIView) {            
        self.numberOfPages++
        view.frame = CGRectMake(view.frame.minX + CGFloat(self.numberOfPages-1) * self.sv.frame.maxX, view.frame.minY, view.frame.width, view.frame.height)
        sv.contentSize = CGSizeMake(CGFloat(self.numberOfPages) * frame.width, frame.height)
        sv.addSubview(view)
        self.pc.numberOfPages = self.numberOfPages
    }

    func setPage(page: Int) {
        self.pc.currentPage = page
    }
    
    func scrollViewDidEndDecelerating(sv: UIScrollView) {
        if fmod(sv.contentOffset.x, sv.frame.maxX) == 0 {
            pc.currentPage = Int(sv.contentOffset.x / sv.frame.maxX)
        }
    }
}

ViewController.swift

import UIKit
class ViewController: UIViewController {
    override func viewDidLoad() {       
        super.viewDidLoad()
        self.view.backgroundColor = colorPattern.back()
        self.view.addSubview(クラス(frame: self.view.frame))
    }
   
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}