Project 作成

まずプロジェクトを作成します。

Webviewを入れ込む

プロジェクトが作成できると上の写真のようにMain.storyboardが作られてます。右側の下のところにあるobject liblaryでWebviewを探してview controllerに入れ込みます。

右側の上の方にあるassistant editorをクリックすると下のように画面が分けられてWebviewをオブジェクト化しやすくなります。


名前を作成したら、

その名前を持つオブジェクトが作れます。

Webviewの設定

上のようにWebviewを設定してURLをロードします。
delegateを指定しないとエラーになるので必ず入力します。そしてloadRequestメソッドを使ってURLを読み込みます。

Webviewのlayoutを指定して、

デバイスを選択し、runすると、

こういうふうに起動します。
単純にview controllerだけではなくてTabbar ControllerやNavigation Controllerを使うことも可能です。
今回はTabbar Controllerを使ってみます。

Tabbar Controllerの使い方

まず、右下のObject LibraryでTabbar Controllerを探して中に入れ込みます。

View Controllerの隣にある'->‘をEntryPointと言います。簡単にいうとアプリのスタートになるところを指定するPointです。

View ControllerにあるEntryPointをTabbar Controllerに移動します。

次は、Tabbar ControllerのSegueを該当View ControllerにつないでRelationshipを作ります。

そしたら上のようにView ControllerはTabbar Controllerの一つのItemとなります。

Tabbar Itemを編集して名前やImageも変えることができます。右のところで編集すると、

簡単に変わります。
デバイスで確認すると、

こう変わりました。

次は、Tabbarの色を変えてみます。Tabbarを選択し、右のところを編集すると、

色が変わります。
もう一度デバイスで確認すると、

こういうふうに変わるのを見ることができます。

個人的な意見では、Tabbar Controllerはそれぞれの機能を持てる画面を使用するNativeアプリにもっと合う気がします。Webviewを使うHybridアプリにはNativeアプリに使うことよりは効率性が高くないんじゃないかなと思います。