NavigationView: بنیادی باتیں، SwiftUI ایپس میں نیویگیشن اسٹیک

NavigationView کیا ہے؟

NavigationView ایک SwiftUI کنٹینر ہے جو اسکرینوں کا ایک درجہ بندی لپیٹتا ہے اور ایک نیویگیشن انٹرفیس فراہم کرتا ہے۔ NavigationView کے اندر NavigationLink کام کرتا ہے — ایک عنصر جسے دبانے پر موجودہ اسکرین ایک نئی اسکرین سے بدل جاتی ہے۔ NavigationView خود بخود عنوان اور «واپس» بٹن کے ساتھ ایک نیویگیشن بار شامل کرتا ہے۔

NavigationView SwiftUI کے ساتھ iOS 13 میں ظاہر ہوا۔ تصوراتی طور پر، یہ UIKit سے UINavigationController کی جگہ لیتا ہے، لیکن اعلانیہ طور پر نافذ کیا گیا ہے۔ دستی push/pop کے بجائے، ڈویلپر NavigationLink کے ذریعے اسکرینوں کے درمیان تعلق کو بیان کرتا ہے۔ نظام خود بخود اسٹیک کا نظم و نسق کرتا ہے۔

NavigationView موڈیفائر .navigationTitle، .navigationBarTitleDisplayMode، .toolbar اور .searchable کو سپورٹ کرتا ہے۔ iOS 16+ کے لیے، Apple نے NavigationStack متعارف کرایا، جو NavigationView API کو محفوظ رکھتا ہے لیکن NavigationPath کے ذریعے پروگراماتی اسٹیک نظم و نسق کا اضافہ کرتا ہے۔ iOS 15 اور اس سے نیچے کو سپورٹ کرنے والے منصوبوں کے لیے، NavigationView واحد آپشن رہتا ہے۔

NavigationLink اور اسکرینوں کے درمیان منتقلی

NavigationLink ایک SwiftUI عنصر ہے جو NavigationView یا NavigationStack کے اندر ہدف اسکرین پر منتقلی پیدا کرتا ہے۔ NavigationLink دبانے پر، نظام ہدف اسکرین کو نیویگیشن اسٹیک میں شامل کرتا ہے۔ منتقلی اینیمیشن iOS پر دائیں سے معیاری push ہے، جو پلیٹ فارم کے مطابق ڈھل جاتی ہے۔

struct ContentView: View {
    var body: some View {
        NavigationView {
            List(items) { item in
                NavigationLink(destination: DetailView(item: item)) {
                    Text(item.title)
                }
            }
            .navigationTitle("فہرست")
        }
    }
}

struct DetailView: View {
    let item: Item

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

NavigationLink دو پیرامیٹر لیتا ہے: destination — ہدف View، اور label — وہ عنصر جسے صارف دباتا ہے۔ فہرستوں کے لیے، value اور NavigationLink(value:) کے ساتھ نحو آسان ہے — یہ خود بخود سیل کو غیر منتخب کرتا ہے اور NavigationPath کے ساتھ کام کرتا ہے۔

NavigationStack بمقابلہ NavigationView: API موازنہ

iOS 16 کے ساتھ، Apple نے NavigationView کے متبادل کے طور پر NavigationStack متعارف کرایا۔ NavigationStack اعلانیہ نحو کو محفوظ رکھتا ہے لیکن ایک انتہائی اہم خصوصیت کا اضافہ کرتا ہے — NavigationPath قسم یا Hashable کی صف کے path پراپرٹی کے ذریعے پروگراماتی اسٹیک نظم و نسق۔

کم از کم ورژن iOS 16+ والے منصوبوں کے لیے، NavigationStack استعمال کریں۔ iOS 14-15 سپورٹ کے لیے — NavigationView۔ NavigationStack کے پرانے ورژن کے لیے براہ راست مشابہ نہیں ہے، لہذا اپ گریڈ کے لیے مطابقت کی جانچ درکار ہے۔

Toolbar اور navigationTitle ترتیب

.toolbar اور .navigationTitle موڈیفائر نیویگیشن بار کے مواد کو کنٹرول کرتے ہیں۔ .navigationTitle اسکرین کا عنوان سیٹ کرتا ہے، .navigationBarTitleDisplayMode انداز منتخب کرتا ہے: .large (بڑا، ڈیفالٹ) یا .inline (کمپیکٹ، جیسے ترتیبات میں)۔ .toolbar بٹن، تلاش اور سیگمنٹڈ کنٹرول شامل کرتا ہے۔

struct SettingsView: View {
    var body: some View {
        NavigationStack {
            Form {
                Section("پروفائل") {
                    Text("صارف نام")
                    Toggle("اطلاعات", isOn: $notifications)
                }
            }
            .navigationTitle("ترتیبات")
            .navigationBarTitleDisplayMode(.large)
            .toolbar {
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button("محفوظ کریں") { save() }
                }
                ToolbarItem(placement: .navigationBarLeading) {
                    EditButton()
                }
            }
        }
    }
}

.searchable ایک اور موڈیفائر ہے جو نیویگیشن بار میں تلاش بار کو ضم کرتا ہے۔ NavigationView اور NavigationStack دونوں کے ساتھ کام کرتا ہے۔ اسکرول کرتے وقت تلاش خود بخود چھپ جاتی ہے اور نیچے سوائپ کرنے پر ظاہر ہوتی ہے۔ Binding String کے ذریعے فہرست فلٹرنگ کو سپورٹ کرتا ہے۔

NavigationPath کے ساتھ پروگراماتی نیویگیشن

NavigationPath ایک iOS 16+ قسم ہے جو نیویگیشن اسٹیک کو Hashable اقدار کے مجموعہ کے طور پر پیش کرتی ہے۔ ڈویلپر پروگراماتی منتقلی کے لیے path میں عناصر شامل کرتا ہے، واپس آنے کے لیے ہٹاتا ہے۔ NavigationPath ڈیپ لنکس، push اطلاعات اور حالت کی بحالی کو سپورٹ کرتا ہے۔

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

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

        // ڈیپ لنک کے ذریعے پروگراماتی منتقلی
        .onOpenURL { url in
            guard let productId = DeepLinkParser.parse(url) else { return }
            path.append(Product(id: productId))
        }
    }
}

.navigationDestination(for:) ڈیٹا کی قسم رجسٹر کرتا ہے جس کے لیے اسکرین دکھانی ہے۔ جب اس قسم کی قدر path میں شامل کی جاتی ہے، نظام خود بخود ہدف View بنا دیتا ہے۔ یہ طریقہ واضح NavigationLink(destination:) کی جگہ لیتا ہے اور نیویگیشن کو سختی سے ٹائپ شدہ بناتا ہے۔

iPad، watchOS اور tvOS پر NavigationView

NavigationView اور NavigationStack تمام Apple پلیٹ فارمز پر کام کرتے ہیں: iOS، iPadOS، watchOS، tvOS اور macOS۔ رویہ اسکرین کے مطابق ڈھل جاتا ہے۔ iPad پر، NavigationStack NavigationSplitView کو سپورٹ کرتا ہے، جو UIKit سے UISplitViewController کی جگہ لیتا ہے اور چوڑی اسکرین پر دو کالم دکھاتا ہے۔

NavigationSplitView (iOS 16+) اسکرین کو سائڈبار (فہرست) اور تفصیل میں تقسیم کرتا ہے۔ iPhone پر، سائڈبار چھپا ہوتا ہے، صرف NavigationLink کے ذریعے تفصیل دکھاتا ہے۔ iPad پر، سائڈبار اور تفصیل اسپلٹ موڈ میں ایک ساتھ دکھائی جاتی ہیں۔

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

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

NavigationSplitView ہر ڈیوائس کے لیے خود بخود بہترین ڈسپلے موڈ منتخب کرتا ہے۔ پورٹریٹ میں iPhone پر — اسٹیک، لینڈ اسکیپ میں iPad اور iPhone پر — اسپلٹ۔ ڈویلپر کو مختلف سائز کلاسز کے لیے علیحدہ کوڈ لکھنے کی ضرورت نہیں ہے۔