1

Xcode6 + SwiftにてStoryboardで設置したUIPageControlとUIScrollViewを連携させたいのですが、

import UIKit

class ViewController: UIViewController, UIScrollViewDelegate {

    //UIScrollViewの紐付け
    @IBOutlet weak var scrollView: UIScrollView!

    //UIPageControlの紐付け
    @IBOutlet weak var pageControl: UIPageControl!


    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

}

紐付けしか出来ず、肝心の中身ついては何も書けず……
スライドと共にLabelとImageを表示させたいのですが
お詳しい方がいましたら、UIPageControlとUIScrollViewの連携の仕方を教えてくださると幸いです。

2 件の回答 2

1

UIScrollViewUIPageControlを連携させるためにはスクロール位置(contentOffset)と選択ページ(currentPage)を互いに同期させる必要があるため、両者のイベントを処理する必要があります。

UIScrollViewについてはViewControllerにUIScrollViewDelegatescrollViewDidScrollを実装します。

func scrollViewDidScroll(scrollview: UIScrollView) {
    pageControl.currentPage = scrollView.contentOffset.x / scrollView.frame.size.width
}

UIPageControlはtapを拾います。

@IBAction func pageControlTapped(sender:AnyObject) {
    scrollView.contentOffset = CGPointMake(scrollView.frame.size.width * pageControl.currentPage, 0)
}
2
  • Storyboardで既に高さや幅の数値は設定しているのに、ViewControllerで再度設定する必要があるのでしょうか?
    – らりん
    Commented 2015年1月19日 12:29
  • 少し追記しました。設定しているのはサイズではなく、ユーザーに操作されると変わる性質の値です。
    – pgrho
    Commented 2015年1月19日 12:38
0

まず、サンプルコードを載せます。(コメントをいただいた後で、加筆しています。Page Controlをタップしたときの処理、スクロールビューをスクロールしたときの処理、両方に対応しました。)

import UIKit

class ViewController: UIViewController, UIScrollViewDelegate {

    @IBOutlet weak var scrollView: UIScrollView!
    @IBOutlet weak var pageControl: UIPageControl!

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    @IBAction func changePage(sender: UIPageControl) {
        scrollView.setContentOffset(CGPoint(x: scrollView.bounds.size.width * CGFloat(sender.currentPage), y: 0.0), animated: true)
    }

    func scrollViewDidEndDecelerating(scrollView: UIScrollView) {
        var page = Int(scrollView.contentOffset.x / scrollView.bounds.size.width)
        pageControl.currentPage = page
    }

}

Page Controlは、ボタンなどと同じUIControlサブクラスです。Outletとしてでなく、Actionで「接続」します。そのとき、senderの型を、AnyObjectからUIPageControlに変えておくと、コードを書くのが楽になります(senderを型変換せずにすむ)。サンプルでは、UIPageControlのActionメソッドをchangePage()としています。
スクロールビューをスクロールするのに、メソッドscrollRectToVisible()を使っていましたが、やはりメソッドsetContentOffset()を使ったほうがコードが短くなるので、変更しました。
ここで注意すべきは、Swiftでは異なる型の四則演算ができないことです。CGFloat(浮動小数点数)とInt(整数)のかけ算はできませんので、一方(ここではIntのほう)をCGFloatに変換(CGFloat(value: Int))しています。
Scroll ViewのDelegateメソッドは、scrollViewDidScroll()でなく、scrollViewDidEndDecelerating()を使います。前者を使ってみるとわかりますが、Page Controlをタップすると、点滅が起きます。これはユーザのアクションだけでなく、プログラムによるスクロールでも、Delegateが発生するためだと考えられますが、それを回避するためです。前者のメソッドは、スクロールのアニメーションの途中で動きますが、後者のメソッドは、アニメーションが完了した時点で動くという違いがあります。

3
  • ご回答有り難うございます。 試してみたのですが、ビルドすると落ちてしまいます…。 UIScrollViewDelegateなどのクラスを実装しなくても出来るものなのでしょうか?
    – らりん
    Commented 2015年1月20日 6:05
  • Storyboard上の設定は、説明していません。していませんが、必須な設定はいくつかあります。 UIScrollViewDelegateは、逆にスクロールビューをスクロールしたときに、UIPageControllの表示を変更する処理に使います。それはサンプルコードでは触れていません。
    – Harawo
    Commented 2015年1月20日 6:43
  • なるほど……!今やっと理解しました。 教えて頂いたサンプルコードで引き続き、作業してみます。
    – らりん
    Commented 2015年1月20日 7:11

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。