SwiftUI میں Form: یہ کیا ہے، فارم بنانا اور ترتیب دینا

SwiftUI میں Form کیا ہے؟

Form ایک خصوصی SwiftUI کنٹینر ہے جو ان پٹ فارمز اور سیٹنگز اسکرینز بنانے کے لیے ڈیزائن کیا گیا ہے۔ یہ List کے رویے کو وراثت میں لیتا ہے لیکن پلیٹ فارم کے مخصوص اسٹائلز شامل کرتا ہے: iOS پر، Form گول کونوں والے گروپڈ ٹیبل کے طور پر ظاہر ہوتا ہے؛ macOS پر، یہ چیک باکسز اور کنٹرولز کے ساتھ معیاری سسٹم کی فہرست کے طور پر نظر آتا ہے۔

VStack اور HStack کے ساتھ دستی لے آؤٹ کے برعکس، Form خود بخود عناصر کے درمیان اسپیسنگ کو ترتیب دیتا ہے، سیپریٹرز شامل کرتا ہے، اور سسٹم تھیم — ہلکے یا گہرے — کے مطابق اپنی ظاہری شکل کو ڈھالتا ہے۔ ڈویلپر صرف منطقی ساخت کو بیان کرتا ہے: گروپنگ کے لیے Section اور اس کے اندر کنٹرولز۔ فارم خود فیصلہ کرتا ہے کہ کسی مخصوص پلیٹ فارم پر Picker، Toggle یا Stepper کو بصری طور پر کیسے ترتیب دیا جائے۔

Form تمام معیاری SwiftUI ان پٹ عناصر کو سپورٹ کرتا ہے: ٹیکسٹ کے لیے TextField، پاس ورڈز کے لیے SecureField، فہرست انتخاب کے لیے Picker، آن/آف کے لیے Toggle، رینجز کے لیے Slider، مرحلہ وار اقدار کے لیے Stepper اور تاریخوں کے لیے DatePicker۔ ہر عنصر خود بخود ہدف پلیٹ فارم پر Apple کے HIG (Human Interface Guidelines) کے مطابق اسٹائل حاصل کرتا ہے۔

Form بمقابلہ List: کنٹینر کا موازنہ

اپنی بصری مماثلت کے باوجود، Form اور List مختلف کاموں کو حل کرتے ہیں۔ List سوائپ ایکشنز اور قطار میں ترمیم کی صلاحیتوں کے ساتھ اسکرول ایبل ڈیٹا فہرستوں کو ظاہر کرنے کے لیے ایک عالمگیر کنٹینر ہے۔ Form ڈیٹا ان پٹ اور سیٹنگز کے لیے ایک خصوصی کنٹینر ہے، جو سسٹم کنٹرول اسٹائلز کے لیے بہتر بنایا گیا ہے۔

List متحرک ڈیٹا ظاہر کرنے کے لیے موزوں ہے: نیوز فیڈز، چیٹس، پروڈکٹ کیٹلاگ۔ Form قابل پیشن گوئی فیلڈز کے سیٹ کے ساتھ جامد اسکرینوں کے لیے ہے: صارف پروفائل، ایپ سیٹنگز، رجسٹریشن فارم۔ اہم فرق: Form کے عناصر انٹرایکٹو کنٹرولز ہو سکتے ہیں، جبکہ List کی قطاریں زیادہ تر ڈیٹا ظاہر کرتی ہیں اور ٹیپ پر نیویگیشن یا ایکشن کے ساتھ جواب دیتی ہیں۔

Apple Human Interface Guidelines (2025) کے مطابق، Form کو سیٹنگز اور ان پٹ اسکرینوں کے لیے استعمال کرنا چاہیے جہاں ایک اسکرین پر 3 سے 20 کنٹرولز ہوں اور انہیں سیکشنز میں تقسیم کرنے سے استعمال میں بہتری آتی ہے۔

Form کے اندر Section

Section Form کا بنیادی تعمیراتی بلاک ہے، جو منطقی طور پر متعلقہ عناصر کو ایک ساتھ گروپ کرنے کی اجازت دیتا ہے۔ ہر Section میں ہیڈر، فوٹر، اور اندر کسی بھی تعداد میں کنٹرولز ہو سکتے ہیں۔ سسٹم خود بخود سیکشنز کے درمیان اسپیسنگ شامل کرتا ہے اور ہر ایک کو گول کونوں والے بصری بلاک میں لپیٹ دیتا ہے۔

Section کا استعمال فارم پڑھنے کی اہلیت کے لیے اہم ہے: معنی کے مطابق گروپ کیے گئے عناصر صارف کے لیے پروسیس کرنا آسان ہوتے ہیں۔ مثال کے طور پر، پروفائل سیٹنگز اسکرین پر، «ذاتی ڈیٹا»، «اطلاعات» اور «سیکیورٹی» کو انفرادی سیکشنز میں الگ کیا جا سکتا ہے۔ ہر سیکشن میں وضاحتی متن کے ساتھ فوٹر ہو سکتا ہے، جسے سسٹم عناصر کے گروپ کے نیچے چھوٹے فونٹ میں ظاہر کرتا ہے۔

Form {
    Section(header: Text("پروفائل")) {
        TextField("نام", text: $name)
        TextField("Email", text: $email)
    }

    Section(header: Text("اطلاعات"),
            footer: Text("میٹنگز کے دوران غیر فعال کریں")) {
        Toggle("Push notifications", isOn: $pushEnabled)
        Toggle("Email notifications", isOn: $emailEnabled)
    }
}

مثال میں، پہلا سیکشن «Profile» فوٹر کے بغیر دو ٹیکسٹ فیلڈز پر مشتمل ہے، دوسرا سیکشن «Notifications» گروپ کے نیچے وضاحت کے ساتھ دو ٹوگلز پر مشتمل ہے۔ فوٹر خود بخود اسپیسنگ شامل کرتا ہے اور caption فونٹ اسٹائل استعمال کرتا ہے۔ Section میں ہیڈر کے بغیر فوٹر یا فوٹر کے بغیر ہیڈر ہو سکتا ہے۔

Form میں کنٹرولز

Form تمام معیاری SwiftUI ان پٹ عناصر کو سپورٹ کرتا ہے۔ Picker Form میں خود بخود iOS پر علیحدہ انتخاب کی اسکرین میں منتقلی کے ساتھ نیویگیشن قطار کے طور پر ظاہر ہوتا ہے۔ Toggle دائیں طرف منسلک سوئچ کے ساتھ ایک قطار کے طور پر ظاہر ہوتا ہے۔ TextField پلیس ہولڈر کے ساتھ سسٹم ان پٹ اسٹائل حاصل کرتا ہے۔

عددی اقدار کے لیے، Stepper (مرحلہ وار تبدیلی) اور Slider (رینج میں ہموار تبدیلی) استعمال ہوتے ہیں۔ DatePicker کئی موڈز کو سپورٹ کرتا ہے: date, time, dateAndTime۔ رنگ انتخاب کے لیے ColorPicker دستیاب ہے۔ ہر عنصر اضافی کوڈ کے بغیر پلیٹ فارم کے مطابق ڈھل جاتا ہے — iOS پر کنٹرولز مقامی UIKit اسٹائلز استعمال کرتے ہیں، macOS پر AppKit استعمال کرتے ہیں۔

Form کے اندر حسب ضرورت کنٹرولز کے لیے، کوئی بھی SwiftUI View استعمال کی جا سکتی ہے — وہ معیاری سیکشن رویہ وراثت میں لیتے ہیں۔ تاہم، سفارش کی جاتی ہے کہ سسٹم عناصر پر قائم رہیں، کیونکہ وہ HIG کی تعمیل کی ضمانت دیتے ہیں اور اضافی کنفیگریشن کے بغیر رسائی (VoiceOver, Dynamic Type) کو سپورٹ کرتے ہیں۔

Form کوڈ کی مثالیں

آئیے Form استعمال کرتے ہوئے رجسٹریشن اسکرین بنائیں۔ فارم میں چار سیکشنز ہیں: ذاتی ڈیٹا، کردار کا انتخاب، سبسکرپشن سیٹنگز اور جمع کرانے کا بٹن۔ گروپنگ کے لیے Section اور معیاری SwiftUI کنٹرولز استعمال کیے گئے ہیں۔

struct RegistrationForm: View {
    @State private var name = ""
    @State private var email = ""
    @State private var role = "Developer"
    @State private var agreedToTerms = false

    let roles = ["Developer", "Designer", "Manager"]

    var body: some View {
        NavigationStack {
            Form {
                Section(header: Text("ذاتی معلومات")) {
                    TextField("Name", text: $name)
                    TextField("Email", text: $email)
                        .keyboardType(.emailAddress)
                }

                Section(header: Text("کردار")) {
                    Picker("Select role", selection: $role) {
                        ForEach(roles, id: \.self) { role in
                            Text(role).tag(role)
                        }
                    }
                }

                Section {
                    Toggle("Agree to terms", isOn: $agreedToTerms)
                }

                Section {
                    Button("رجسٹر کریں") {
                        submitForm()
                    }
                    .disabled(!agreedToTerms)
                }
            }
            .navigationTitle("Registration")
        }
    }

    private func submitForm() { }
}

فارم چار Section میں تقسیم ہے: دو ٹیکسٹ فیلڈز کے ساتھ ذاتی ڈیٹا، Picker کے ذریعے کردار کا انتخاب، Toggle کے ذریعے شرائط سے اتفاق، اور رجسٹریشن بٹن۔ بٹن اس وقت تک غیر فعال ہے جب تک صارف شرائط سے متفق نہ ہو — یہ Form کے اندر توثیق کی ایک مثال ہے۔ NavigationStack ایک عنوان شامل کرتا ہے اور Picker کو iOS پر علیحدہ انتخاب کی اسکرین کھولنے کی اجازت دیتا ہے۔

ذیلی سیکشنز کے ساتھ سیٹنگز فارم

struct SettingsForm: View {
    @State private var volume: Double = 0.5
    @State private var isDarkMode = false
    @State private var reminderDate = Date()

    var body: some View {
        NavigationStack {
            Form {
                Section(header: Text("ظاہری شکل")) {
                    Toggle("Dark mode", isOn: $isDarkMode)
                    Slider(value: $volume, in: 0...1) {
                        Text("آواز")
                    }
                }

                Section(header: Text("یاد دہانیاں"),
                        footer: Text("آپ کو منتخب وقت پر اطلاع ملے گی")) {
                    DatePicker("Remind at",
                        selection: $reminderDate,
                        displayedComponents: .hourAndMinute)
                }

                Section {
                    NavigationLink("Advanced Settings",
                        destination: AdvancedSettingsView())
                }
            }
            .navigationTitle("Settings")
        }
    }
}

یہ مثال Form کے اندر Slider, DatePicker اور NavigationLink کے امتزاج کو ظاہر کرتی ہے۔ DatePicker صرف وقت ظاہر کرنے کے لیے hourAndMinute موڈ استعمال کرتا ہے۔ آخری سیکشن میں NavigationLink جدید سیٹنگز اسکرین پر منتقلی پیدا کرتا ہے — Settings جیسے انٹرفیس کے لیے ایک عام پیٹرن۔ سیکشن ہیڈرز اور فوٹرز فارم کو خود دستاویزی بناتے ہیں: صارف فوراً سمجھ جاتا ہے کہ ہر کنٹرول کس گروپ سے تعلق رکھتا ہے۔