UIScrollViewとUIPageControlを使う。都合によりiOS 6 SDK、Xcode 4.6.3を使っている。ARCは使う設定。
(0)準備
サンプルはSingle View Applicationのテンプレートで作成。プレフィックスはPGとした。
アプリケーションデリゲートクラス：PGAppDelegate
ベースとなるビューコントローラクラス：PGViewController
スクロール上に配置されるページ毎のクラス：PGPageViewController
(1)UIScrollViewの配置。
Viewの上に配置すると自然と全画面サイズになってくれてビューサイズ変更に追随されるように設定されるのはInterface Builderならでは。
ポイントとしてはPaging Enabled をセットする。これでページ単位にスナップしてくれるようになる。または今回は横スクロールのみなのでShows Vertical ScrollersははずしてOK。bouncesはないほうがいいので外しているが好みなのでどちらでもいい。
(2)UIPageControlの配置
UIScrollViewの上に載せるのだが、位置関係に注意しないとUIScrollViewの子になってしまう。Interface Builderでは左側の階層ビューで正しく配置する。親ビューとの関係では上方にあるビューが、実際には下になるので実行時に隠れてしまう。
ダメな例1:
ダメな例2:
(3)ページビューの生成
複数ページの生成をNib上で配置することができないので、viewDidLoad:の中でページ数分だけ生成してUIScrollViewのサブビューとして配置する。ViewControllerはiOS5からはchildViewControllersとして保持できるそこに追加すればいい。
実装の構造上このViewの生成時にはまだWindowには配置されていないのでサイズが確定していない。なのでここではページビューの生成だけにして位置の設定は後回しにする。
(4)ページビューの位置調整
AutoLayoutについて未だ勉強不足なので、もしかしたらもっと適切な設定方法があるのかもしれないが今回は位置調整が必要なタイミングで都度調整することに。
必要なタイミングは二カ所のはず。
初期化時：viewDidAppear:
縦横変更時：didRotateFromInterfaceOrientation:
UIScrollViewのサイズは実際にView上に表示されている範囲を示しているframeと、スクロールされる全体像の大きさを表すcontentSizeがある。
page viewは0ページ目はUIScrollViewの(x,y)=(0,0)から配置するが、1ページはx座標がframeの幅1つ分ずらして配置、2ページ目はx座標がframeの幅2つ分ずらして配置する。
サンプルはgithubから。
