iOSアプリ開発メモ No.16 -Page Controllの使い方-

ページを捲るようにラベルのテキストが切り替わるのに連動して、今が何個目か可視化したい。

方法

View ControllerにPage Controlをにゅっと持ってきます。そうすると驚きの白さのPage Controlが現れますが、これは初期設定で丸の色が白になっているせいです。

f:id:Mantra:20180223201021p:plain

Page Controlを選択してAttributes Inspectorを開き、Tint Color(非アクティブ時の丸の色)とCurrent Page(アクティブ時の丸の色)を設定します。ここで注意しておきたいのが、Pagesの# of Pagesという項目はページ数(丸の数)ですが0からカウントしています。 3 of Pagesとしたら0,1,2の3ページということです。 (私は1からだと勘違いしてつまずきました…)

f:id:Mantra:20180223201322p:plain

Buttonを押したとき、Labelの内容が変化するのと同時にPage Controlを次のページにしたいので、LabelとButtonを追加します。 ViewController.swiftにConnectします。 LabelとPage ControlはOutletとして適当な名前をつけて、ButtonはActionとしてそれっぽい名前をつけておきます。

f:id:Mantra:20180223201403p:plain

ページ数を指定する変数(pageNumber)を宣言・初期化して、Buttonを押したときのAction(toNext)を書きます。押すたびにページ数を+1して、if文の中で値に応じてラベル(textLabel)の内容を変化させます。 Actionの最後(if文の外)で、.currentPageメソッドを使ってPage Control(pageState)のページを指定して完了。

f:id:Mantra:20180223201452p:plain

@IBAction func toNext(_ sender: Any) {
    pageNumber += 1
    if(pageNumber == 1){
        textLabel.text = "2ページ目"
    }else if(pageNumber == 2){
        textLabel.text = "3ページ目"
    }else{
        textLabel.text = "もうないよ"
    }
    pageState.currentPage = pageNumber
}