【Swift UI】画面遷移(ナビゲーション)

ナビゲーション遷移

 左から右に流れるようなアニメーションで遷移する。
 戻るボタンは自動で作成される。

Structure等

ルートビューと追加のビューを表示するためのビュー

 ナビゲーションプレゼンテーションを制御するビュー。
 ユーザはリンクをクリックまたはタップすることによって内側のビューを表示することができる。

コード

2SecondViewをクリックするとSecondViewへ遷移する。

struct ContentView: View {
  var body: some View {
    NavigationStack {
      NavigationLink {
        SecondView()
      } label : {
        Text("2SecondView")
      }
    }
  }
}

struct SecondView : View {
  var body : some View {
    ZStack {
      Color.black
      Text("SecondView").foregroundColor(.white)
    }
  }
}

struct ContentView_Previews: PreviewProvider {
  static var previews: some View {
    ContentView()
  }
}

複数遷移

struct ContentView: View {
  var body: some View {
    NavigationStack {
      List {
        NavigationLink("Apple") { ChildView(en: "Apple", ja: "りんご") }
        NavigationLink("Table") { ChildView(en: "Table", ja: "机") }
      }
      .navigationTitle("英語")
    }
  }
}

struct ChildView: View {
  let en: String
  let ja: String
  var body: some View {
    VStack {
      Text(ja).font(.title)
    }
    .navigationTitle(en)
  }
}