【SwiftUI入門】navigationTitle

NavigationTitleとは

NavigationTitleというのはタイトルを作るモディファイアのことです。

NavigationTitleはNavigationStackというものの中でTextやButtonなどのViewに追加して使います。

NavigationTitleは

NavigationStack {
    何らかのView
        .navigationTitle(Text(“タイトルとして表示したい文字”))}

と記述して使います。

実際に使ってみる

それでは実際に使ってみましょう。

適当にSwiftUIのプロジェクトを作ってください。

navigationTitleはNavigationStackの中で使う必要があるので、まずはNavigationStackを作っていきましょう。

最初に記述されている

VStack {
    Image(systemName: “globe”)
        .imageScale(.large)
        .foregroundColor(.accentColor)
    Text(“Hello, world!”)}
.padding()

NavigationStack {
    Text(“Hello”)}

と書き換えましょう。

このコードはNavigationStackを作って、その中に適当にHelloと表示されるTextを作るといったものです。

次にタイトルを追加していきましょう。

先ほど作ったTextにNavigationTitleを追加します。

Text(“Hello”)の下に

.navigationTitle(Text(“タイトル”))

と記述しましょう。

.navigationTitleの引数に入れたTextがタイトルとして表示されるので、『タイトル』というように表示されます。

プレビューで確認してみると、ちゃんと表示されているはずです。

このようにしてSwiftUIではタイトルをつけることができます。