Поваренная книга SwiftUI: NavigationStack в SwiftUI

При создании приложения с несколькими представлениями важно иметь способ навигации между ними. В SwiftUI NavigationStack обеспечивает простой и интуитивно понятный способ навигации между представлениями.

Чтобы добавить NavigationStack в приложение SwiftUI, оберните представление верхнего уровня в NavigationStack. Внутри NavigationStack можно добавить несколько представлений в качестве элементов навигации. Каждый элемент навигации представлен в виде кнопки на панели навигации, которую пользователь может нажать для перехода к этому представлению.

Ниже приведен пример добавления NavigationStack в приложение SwiftUI:

struct ContentView: View {
  var body: some View {
    NavigationStack {
      Text("Welcome to my app!")
        .navigationTitle("Home")
        .navigationBarTitleDisplayMode(.large)
    }
  }
}

В этом примере представление Text заключено в NavigationStack. Модификатор navigationTitle используется для задания текста, отображаемого на панели навигации. Модификатор navigationBarTitleDisplayMode задает режим отображения заголовка панели навигации, который в данном случае имеет значение .large.

Пример NavigationStack в SwiftUI.

Для добавления другого представления в качестве элемента навигации можно использовать модификатор .toolbar следующим образом:

struct ContentView: View {
  var body: some View {
    NavigationStack {
      VStack {
        Text("Welcome to my app!")
        NavigationLink(destination: DetailView()) {
          Text("Go to Detail View")
        }
      }
      .navigationTitle("Home")
      .navigationBarTitleDisplayMode(.large)
      .toolbar {
        ToolbarItem(placement: .navigationBarTrailing) {
          Button(action: {
            print("Settings tapped")
          }) {
            Text("Settings")
          }
        }
      }
    }
  }
}

struct DetailView: View {
  var body: some View {
    Text("This is the detail view!")
      .navigationTitle("Detail")
      .navigationBarTitleDisplayMode(.large)
  }
}

В окне предварительного просмотра должно появиться следующее:

Пример NavigationStack с детальным представлением в SwiftUI.

В этом примере мы включили в наш NavigationStack новый VStack с представлением Text и NavigationLink. Навигационная ссылка позволяет пользователю перейти к DetailView при нажатии на нее. Мы также добавили кнопку Settings на панель навигации с помощью модификатора .toolbar и представления ToolbarItem.

Для получения более подробной информации обратитесь к разделу «Списки и навигация в SwiftUI» данного руководства.

Предложите исправление: выделите текст и нажмите Ctrl+ Enter

← Предыдущая статья: Изображения и кнопки

Источник