【Swift/iOS】ナビゲーションコントローラーの使い方

iOSアプリではよく見かけるNavigation Controllerの使い方を解説します。

スポンサーリンク

環境

この記事の情報は次のバージョンで動作確認しています

【Xcode】Version 10.1
【Swift】Version 4.2.1
【iOS】12.1.4

Navigation Controllerとは?

複数の画面をナビゲーション表示付きで階層的に管理する部品です。

Navigation Controllerの管理下に置かれた画面の上部にはナビゲーションバー(Navigation Bar)とBackボタンが表示され、統一された操作で画面の移動ができます。

iOS標準の「設定」アプリ等はこのNavigation Controllerが使われている代表例です。

【図:設定アプリ】

Navigation Controller の設定方法

StoryboardでNavigation Controllerを追加する方法を解説します。

メニューから追加する方法と、部品のドラックによる2パターンあります。

メニューから追加

Navigation Controllerの管理下にしたい画面(View2)を選択した状態で、メニューからEditor→Embed In→NavigationControllerを選びます。

【図:メニューからNavigationControllerを選ぶ】

下図のようにView2の手前に、Navigation Controllerが配置されます。

【図:追加されたNavigationController】

一見、新たな画面が追加されたように見えますが、あくまでコントローラーですので、画面が増えるわけではありあません。当然ながら部品なども配置できません。

このケースではView1からの遷移先はView2でなくNavigation Controllerになりますので注意して下さい。Segueを使っている場合は自動的に切り替わりますが、コードで遷移している場合は遷移先の指定を明示的に変える必要があります。

なお、NavigationControllerと直接つながった画面(View2)は、コントローラーによって管理される画面ツリーのトップ画面(rootView)になります。

部品のドラッグによる追加

ラベルやボタンと同じように、Object LibraryからNavigation Controller部品をドラッグして配置する事も可能です。

ただ、必ずTable Viewがセットでついてきて、使い勝手はあまりよくありませんので、前途のメニューからの追加方法をおすすめします。

【図:部品のドラックによる追加】

画面遷移の方法

Navigation Controller管理下での画面遷移方法ついて、Segueを使ったケースとSegueを使わないケースでそれぞれ解説します。

Segueを使った画面遷移

ナビゲーション付きで画面遷移するには、Segueの種類にShowを選択します。横にスライドする独自のアニメーションで画面が切り替わるようになります。

Showの代わりにPresent Modallyを選択した場合は、通常のモーダル型画面遷移となります。この場合はNavigation Controllerの管理下から外れ、遷移先ではナビゲーションが表示されません。

Segueを使った画面遷移の詳細な手順はこちらの記事(↓)を参照してください。

【Swift/iOS】Segueを使った画面遷移
Segueとは、storyboard上で画面遷移を表す部品です。この記事では、Segueを使った2種類の画面遷移方法を解説します。ノンコーディングでお手軽に遷移するAction Segueコード上の任意のタイミングで画面遷移させるM...

Segueを使わない画面遷移

ナビゲーション付きで画面遷移するには、UINavigationController.pushViewController()メソッドを使って画面遷移します。

通常の画面遷移メソッドUIViewController.present()を使うと、Navigation Controllerの管理下から外れ、モーダル画面表示となります。

実装例はこちらの記事(↓)を参照して下さい。

【Swift/iOS】Segueを使わない画面遷移
(2019/04/07 更新)Segueを使わないで画面遷移をする方法を解説します。異なるstoryboard上にあるViewControllerに遷移するなどの場合はSegueが使えませんので、必然的にこちらの方法を使う事になります。...

画面の戻り方

Navigation Controller配下では、特別な実装不要でナビゲーションバーに標準で表示されるBackボタン、または画面スワイプで1つ前の画面に戻る事ができます。

任意のタイミングで戻りたい、あるいは戻る画面を指定したい場合は、コードによる実装が必要となります。

一階層戻るにはUINavigationController.popViewController()メソッドを使います。

実装例はこちらの記事(↓)を参照して下さい。

【Swift/iOS】遷移元画面への戻り方
遷移元画面へ戻る方法について解説します。モーダル型の通常の画面遷移と、Navigation Controller管理下での階層型画面遷移では、戻り方が違いますので注意して下さい。

最後に

ナビゲーションバーのカスタマイズ方法について、こちらの記事(↓)にまとめていますので合わせて御覧ください。

【Swift/iOS】ナビゲーションバーのカスタマイズ
ナビゲーションコントローラー(Navigation Controller)を利用した時に自動で適用されるナビゲーションバー(Navigation Bar)のカスタマイズ方法について解説します。storybord上でもある程度のカスタマイズ...

コメント