NavigationView: asoslari, SwiftUI ilovalarida navigatsiya steki

NavigationView nima?

NavigationView — SwiftUI konteyneri, ekranlar iyerarxiyasini o'rab oladi va navigatsiya interfeysini taqdim etadi. NavigationView ichida NavigationLink ishlaydi — bosilganda joriy ekranni yangisi bilan almashtiradigan element. NavigationView avtomatik ravishda sarlavha va «Orqaga» tugmasi bilan navigation bar qo'shadi.

NavigationView iOS 13 da SwiftUI bilan birga paydo bo'ldi. Konseptual jihatdan UIKit dan UINavigationController ni almashtiradi, ammo deklarativ tarzda amalga oshirilgan. Qo'lda push/pop o'rniga, dasturchi NavigationLink orqali ekranlar o'rtasidagi bog'lanishni tavsiflaydi. Tizim avtomatik ravishda stekni boshqaradi.

NavigationView .navigationTitle, .navigationBarTitleDisplayMode, .toolbar va .searchable modifierlarini qo'llab-quvvatlaydi. iOS 16+ uchun Apple NavigationStack ni taqdim etdi, u NavigationView API sini saqlaydi, lekin NavigationPath orqali dasturiy stek boshqaruvini qo'shadi. iOS 15 va undan eski versiyalarini qo'llab-quvvatlaydigan loyihalar uchun NavigationView yagona variant bo'lib qoladi.

NavigationLink va ekranlar o'rtasidagi o'tishlar

NavigationLink — NavigationView yoki NavigationStack ichida maqsadli ekranga o'tish yaratadigan SwiftUI elementi. NavigationLink bosilganda tizim maqsadli ekranni navigatsiya stekiga qo'shadi. O'tish animatsiyasi — iOS uchun standart o'ngdan push, platformaga moslashadi.

struct ContentView: View {
    var body: some View {
        NavigationView {
            List(items) { item in
                NavigationLink(destination: DetailView(item: item)) {
                    Text(item.title)
                }
            }
            .navigationTitle("Ro'yxat")
        }
    }
}

struct DetailView: View {
    let item: Item

    var body: some View {
        VStack {
            Text(item.description)
                .navigationTitle(item.title)
                .navigationBarTitleDisplayMode(.inline)
        }
    }
}

NavigationLink ikki parametrni qabul qiladi: destination — maqsadli View, va label — foydalanuvchi bosadigan element. Ro'yxatlar uchun value va NavigationLink(value:) bilan sintaksis qulay, u avtomatik ravishda katakchani tanlovdan chiqaradi va NavigationPath bilan ishlaydi.

NavigationStack vs NavigationView: API taqqoslashi

iOS 16 dan boshlab Apple NavigationStack ni NavigationView ning o'rnini bosuvchi sifatida taqdim etdi. NavigationStack deklarativ sintaksisni saqlaydi, lekin muhim imkoniyat qo'shadi — NavigationPath turidagi path xususiyati yoki Hashable massivi orqali dasturiy stek boshqaruvi.

Minimal iOS 16+ versiyasi bo'lgan loyihalar uchun NavigationStack dan foydalaning. iOS 14-15 qo'llab-quvvatlash uchun — NavigationView. NavigationStack ning eski versiyalar uchun to'g'ridan-to'g'ri analogi yo'q, shuning uchun yangilash moslikni tekshirishni talab qiladi.

Toolbar va navigationTitle sozlamasi

.toolbar va .navigationTitle modifierlari navigatsiya panelining mazmunini boshqaradi. .navigationTitle ekran sarlavhasini o'rnatadi, .navigationBarTitleDisplayMode uslubni tanlaydi: .large (katta, standart) yoki .inline (ixcham, Sozlamalardagi kabi). .toolbar tugmalar, qidiruv va segmentli boshqaruv qo'shadi.

struct SettingsView: View {
    var body: some View {
        NavigationStack {
            Form {
                Section("Profil") {
                    Text("Foydalanuvchi nomi")
                    Toggle("Bildirishnomalar", isOn: $notifications)
                }
            }
            .navigationTitle("Sozlamalar")
            .navigationBarTitleDisplayMode(.large)
            .toolbar {
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button("Saqlash") { save() }
                }
                ToolbarItem(placement: .navigationBarLeading) {
                    EditButton()
                }
            }
        }
    }
}

.searchable — navigation bar ga qidiruv satrini integratsiya qiladigan yana bir modifier. Ham NavigationView, ham NavigationStack bilan ishlaydi. Qidiruv skrollash paytida avtomatik yashirinadi va pastga surishda ko'rinadi. Binding String orqali ro'yxat filtrlashni qo'llab-quvvatlaydi.

NavigationPath bilan dasturiy navigatsiya

NavigationPath — iOS 16+ tipi, navigatsiya stekini Hashable qiymatlar kolleksiyasi sifatida ifodalaydi. Dasturchi dasturiy o'tish uchun path ga elementlar qo'shadi, qaytish uchun olib tashlaydi. NavigationPath chuqur havolalar, push bildirishnomalari va holatni tiklashni qo'llab-quvvatlaydi.

struct AppNavigation: View {
    @State private var path = NavigationPath()

    var body: some View {
        NavigationStack(path: $path) {
            List(categories) { category in
                NavigationLink("Kategoriya \(category.name)",
                               value: category)
            }
            .navigationTitle("Kategoriyalar")
            .navigationDestination(for: Category.self) { category in
                ProductListView(category: category)
            }
            .navigationDestination(for: Product.self) { product in
                ProductDetailView(product: product)
            }
        }

        // Deep link orqali dasturiy o'tish
        .onOpenURL { url in
            guard let productId = DeepLinkParser.parse(url) else { return }
            path.append(Product(id: productId))
        }
    }
}

.navigationDestination(for:) ekran ko'rsatilishi kerak bo'lgan ma'lumot turini ro'yxatdan o'tkazadi. Path ga ushbu turning qiymati qo'shilganda, tizim avtomatik maqsadli View yaratadi. Bu yondashuv aniq NavigationLink(destination:) ni almashtiradi va navigatsiyani qat'iy tipizatsiya qiladi.

iPad, watchOS va tvOS da NavigationView

NavigationView va NavigationStack barcha Apple platformalarida ishlaydi: iOS, iPadOS, watchOS, tvOS va macOS. Xatti-harakat ekranga moslashadi. iPad da NavigationStack UIKit dan UISplitViewController ni almashtiradigan NavigationSplitView ni qo'llab-quvvatlaydi va keng ekranda ikki ustun ko'rsatadi.

NavigationSplitView (iOS 16+) ekranni sidebar (ro'yxat) va detail (tafsilotlar) ga ajratadi. iPhone da sidebar yashirin, faqat NavigationLink orqali detail ko'rsatiladi. iPad da sidebar va detail split rejimida bir vaqtda ko'rsatiladi.

struct AdaptiveNavigation: View {
    @State private var selectedCategory: Category?

    var body: some View {
        NavigationSplitView {
            List(categories, selection: $selectedCategory) { category in
                Text(category.name)
            }
            .navigationTitle("Kategoriyalar")
        } detail: {
            ProductListView(category: selectedCategory)
        }
    }
}

NavigationSplitView har bir qurilma uchun optimal ko'rsatish rejimini avtomatik tanlaydi. iPhone da portret rejimida — stek, iPad va iPhone da landscape rejimida — split. Dasturchi turli size class lar uchun alohida kod yozishi shart emas.