[SwiftUI] NavigationView の使い方 (特にタイトルバー周り)

SwiftUI

SwiftUI でよく使われる NavigationView の覚書です。

特に、タイトルバー周りについて詳細に書きます。

親子画面の移動

一般的な使い方。情報が階層化されているときに、その階層に従って、ビューを辿ることができます。

NavView Example

以下のようなコードで実現できます。

概要画面

詳細画面

タイトルバーの表示/非表示

NavigationView には、タイトルを設定することができます。.navigationBarTitle modifierを使います。例:.navigationBarTitle(“NavBar”)

この modifier は、NavigationView に対して設定するのではなく、NavigationView の内部の View に設定する必要があります。

注意
NavigationView に対して、.navigationBarTitle の modifier を設定することができてしまいますが、効果がありません。エラーにもなりませんので、気付きにくいです。

このタイトルバーを非表示にするための modifier が用意されていまして、それが、.navigationBarTitleHidden です。

まとめると、タイトルバーは、以下のときに表示されます。
・.navigationBarTitle でタイトルが設定されている
・.navigationBarTitleHidden でタイトルが非表示になるように設定されていない

タイトルが設定されていなければ表示されませんし、タイトルが設定されていても、非表示設定されていれば表示されません。

.navigationBarTitleHidden の影響範囲
.navigationBarTitleHidden は、現在のビューだけではなく、NavigationLink 等を使って辿ったビューの表示にも影響を与えたり与えなかったりします。(バグかも)

例えば、親Viewの NavigationView で、タイトルが設定されていて、.navigationBarTitleHidden が設定されていると、子ビューでは、Backボタンが表示されません。
タイトルが設定されずに、.hidden 設定されると、子ビューでは、Backボタンが表示されます。

この振る舞いには、統一感を感じないので、将来的に変更されそうな気もしますが、Xcode11.5 の現在では上記のような振る舞いをします。

.navigationViewTitleBarHidden は、landscape モードでは、うまく動かない

手持ちのシミュレータ、iPhone6Sで確認しましたが、landscape モードでは、タイトルバーが .navigationBarHiddenTitle としても表示されてしまいます。

NavigationBar を透明色にする方法があるので、それで対応するのが良いかと思います。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です