Main.storybord チュートリアル 其の一

前回までは、SpriteKitのチュートリアルをやって見ました。
チュートリアルをやっているうちにあることに気がつきました。。。

XCodeでの基本的な開発方法わからなくね?」。。。と。。。
というわけで、表題の通り基本のチュートリアルをやります。

参考にするサイトは、Storyboards Tutorial in iOS 9: Part 1 - Ray Wenderlichです。
今まで参考にしていたサイトです。

早速、Main.storybordはUIKitでの開発を基本にしている様です。
基本的に「Scene」を作成し、遷移させて各コントロールする、という流れです。 

プロジェクト作成時に入力したものがプロジェクトを選択した時に見ることができます

f:id:Takunoji:20170816162516p:plain

ここで、iPhoneなどにデプロイするプロジェクトはウェブでデプロイするための設定を
行います。Profileの取得など。。。
あと、デプロイするデバイス(iPhoneなど)を指定してやります。

まぁ大雑把にApplicationDelegate.swiftとViewController.swiftがMain.storybordが
密接に関連しているということに留意する。

Main.storybordでViewを作成していきます。
上記のアイコンを選択すると以下の様な画面が見れると思います。

下の画像は、すでにタブを追加したものですが、下の様に各Viewがどの様に遷移するか
一覧できる様になっています。

f:id:Takunoji:20170816163532p:plain

上記のTabViewは、TabViewControllerをドラッグ&ドロップして追加します。
そして、画面の下部分にf:id:Takunoji:20170816163913p:plainがあります。この状態でコンパイルして起動すると
下の様に表示されます。下のタブを切り替えることでView1とView2を切り替えれます。f:id:Takunoji:20170816163944p:plain  f:id:Takunoji:20170816164100p:plain

そのほかに、TextField, Button, Labelなど追加できます。
ただし、実行する時に以下の様なエラーメッセージが出力されることがあります。

f:id:Takunoji:20170816164244p:plain

その時は、ルートになるViewに以下の設定がないために起こるエラーですので
下の様に設定を行います。左が未設定状態、右が設定済みの状態です。

「is Initial ViewController」の部分にチェックを入れるだけです。

f:id:Takunoji:20170816164622p:plain    f:id:Takunoji:20170816164634p:plain

そして、タブ切り替えのタブ部分にイメージアイコンなどの設定もできます。

以上の様にMain.storybordを使用してやると画面の作成が簡単にできます。
さらにSpriteKitでも各画面を「Scene」としているので入力コンポーネントの作成後
SpriteKitでのアニメーションや2D表現を追加してアプリケーションの作成ができるという次第です。

ソースと画面の関連ですが、以下の様にCustomClassを指定してやると
イベント処理などを実装できる様です。(画面とソースのバインドを行う)

f:id:Takunoji:20170815170903p:plain


紆余曲折しましたが、結局のところUIKitでのプロトタイプ作成からやろうと思いました。基本は大事ですね。。。

次回は、実装をやってみます