【開発】画面のタッチ操作で複数の画像をスライド表示する

ここではiPhone/iPad/Apple Watchの開発環境であるXcode 6.3.1 (英語版)を使って画面のタッチ操作で複数の画像をスライド表示するまでの手順を説明します。
なお、Xcode起動からプロジェクト作成、WatchKitの追加までの手順は「【開発】Apple Watchの画面に文字を表示する」のページと同じですので省略しています。
あらかじめApple Watchに表示する画像をいくつか用意します。ここではimagesフォルダ内に1.jpg、2.jpg、3.jpg、4.jpgというJPEG形式の画像を4枚用意します。ちなみに、この画像は4K/ハイビジョン映像素材のページにあるものを利用しています。

まず、imagesフォルダをプロジェクト内にドラッグドロップします。

ドラッグ＆ドロップすると図のような画面になります。Destination：のCopy items if neededにチェックを入れます。次にAdd to targets：の○○○WatchKit Appにチェックを入れます。あとはFinishボタンをクリックします。

ドラッグドロップで追加したimagesフォルダの▼をクリックして展開します。

「○○○ WatchKit App」フォルダを展開します。展開するとImages.xcassetsという項目があるのでクリックします。この中にApple Watchに表示する画像データをドラッグドロップして入れます。

1.jpgから4.jpgまでの画像をドラッグ＆ドロップします。

次にInterface.stroyboardをクリックします。

UI一覧の中からInterface Controllerをドラッグドロップします。Interface Controllerは一番先頭の項目になっています。

図のように新しいInterfaceが追加されます。

今回は画像が4枚あるので4つInterfaceを追加します。先ほどと同様にドラッグ＆ドロップします。
次に最初のInterface上でctrlキーを押したままマウスの左ボタンを押したまま2番目に表示するInterfaceまでマウスを移動させます。すると青い線（セグエ）が伸びます。2番目のInterfaceがハイライトしたらマウスの左ボタンを離します。

すると図のようなポップアップが表示されますので「next page」をクリックして選択します。

図のように接続されたInterface間に接続を示すアイコンが表示されます。

同様に2番目から3番目、3番目から4番目まで接続していきます。

次にUIの一覧からImageをドラッグ＆ドロップして4つのInterface上に配置します。

図のようになります。次にそれぞれの画面に表示する画像を指定していきます。

Imageのポップアップメニューから表示する画像を選択していきます。

すべての画面に画像が表示されます。

画像だけでは物足りない場合はラベルを追加して文字を表示することもできます。

全てのInterfaceに画像、ラベルを追加したらProductメニューから「Run」を選択し実行します。

図のように画面が複数あると画面の数だけ●が時計画面下に表示されます。

マウスでドラッグして次の画面に移動させることができます。

画像が正しく表示されるか確認します。

これは3番目の画面です。

最後の4番目の画面です。

シミュレーターで問題なく実行できるのを確認したら実機でも確認します。実行するApple Watchと連携しているiPhoneを選択します。選択したらProductメニューから「Run」を選択します。

実行前にはApple Watchのロックを解除しておきます。しばらくして画面が表示されます。

タッチして画面をスライドさせることができます。

2番目の画面です。

3番目の画面です。

4番目（最後）の画面になります。実機でも正しく動作できました。