Toolbar va panel elementlari

SwiftUI navigatsiya: toolbar va panel elementlari

Navigatsiya paneliga .toolbar va ToolbarItem yordamida amallar va boshqaruv elementlarini qo‘shing.

Oddiy toolbar

ToolbarItem joylashuvlari bilan .toolbar yordamida panelning chap (leading) va o‘ng (trailing) tomonlariga tugmalar qo‘shing.

import SwiftUI

struct ToolbarBasicDemo: View {
  var body: some View {
    NavigationStack {
      Text("Content")
        .navigationTitle("Toolbar")
        .toolbar {
          ToolbarItem(placement: .navigationBarLeading) { Button("Cancel") {} }
          ToolbarItem(placement: .navigationBarTrailing) { Button("Add") {} }
        }
    }
  }
}

import SwiftUI

struct ContentView: View {
  var body: some View { ToolbarBasicDemo() }
}

import SwiftUI

@main
struct MyApp: App {
  var body: some Scene { WindowGroup { ContentView() } }
}

Yuqoridagi misolda .toolbar modifikatori chap tomonga Cancel, o‘ng tomonga esa Add tugmasini qo‘shadi.

Joylashuvlar (placements)

Elementlarni pastki panelga joylashtiring yoki klaviaturaga biriktirilgan amallarni ko‘rsating.

import SwiftUI

struct ToolbarPlacementsDemo: View {
  @State private var text = ""
  var body: some View {
    NavigationStack {
      VStack(spacing: 12) {
        TextField("Type...", text: $text).textFieldStyle(.roundedBorder)
      }
      .padding()
      .navigationTitle("Placements")
      .toolbar {
        ToolbarItem(placement: .bottomBar) { Button("Edit") {} }
        ToolbarItemGroup(placement: .keyboard) { Spacer(); Button("Done") { } }
      }
    }
  }
}

import SwiftUI

struct ContentView: View {
  var body: some View { ToolbarPlacementsDemo() }
}

import SwiftUI

@main
struct MyApp: App {
  var body: some Scene { WindowGroup { ContentView() } }
}

Yuqoridagi misolda .bottomBar va .keyboard joylashuvlaridan foydalanilgan.