Published on

Picker

Authors

Picker foydalanuvchiga bir qator variantlardan birini tanlash imkonini beradi. iOS-da siz uni minalar: Sozlamalar > Umumiy > Til, Podcast ilova saralash tartibi, xarid ilovasidagi rang tanlash β€” hammasi Picker. SwiftUI-dagi Picker uslubiga qarab turli ko'rinishda bo'ladi, lekin asosiy mantiq bir xil: binding va .tag() belgilangan view-lar to'plami.

Picker uchun poydevor: @State o'zgaruvchisi (tanlangan qiymatni saqlaydi), enum yoki massiv (variantlar ro'yxati), va har bir variant uchun .tag() (tanlanganda binding qaysi qiymatga o'zgarishini belgilaydi).

Swift
ContentView.swift
import SwiftUI // String enum: rawValue label sifatida, CaseIterable barcha holatlarni beradi enum TartibVarianti: String, CaseIterable, Identifiable { case yangi = "Yangi" case eski = "Eski" case mashhur = "Mashhur" // Identifiable: rawValue allaqachon noyob β€” id sifatida ishlatamiz var id: String { rawValue } } struct ContentView: View { @State private var tanlangan: TartibVarianti = .yangi var body: some View { VStack(spacing: 20) { // Picker: label (VoiceOver uchun) + selection binding + qatorlar Picker("Saralash", selection: $tanlangan) { // ForEach barcha enum holatlarini aylanadi ForEach(TartibVarianti.allCases) { variant in // Text ko'rinadigan matn, .tag tanlanganda saqlanadigan qiymat Text(variant.rawValue).tag(variant) } } // Segmented uslub 2–4 variant uchun gorizontal tugmalar ko'rsatadi .pickerStyle(.segmented) Text("Saralash: \(tanlangan.rawValue)") .foregroundStyle(.secondary) } .padding() } }

Picker uslublari

.pickerStyle(.menu) β€” dropdown

Picker("Mavzu", selection: $tanlangan) {
    ForEach(TartibVarianti.allCases) { v in
        Text(v.rawValue).tag(v)
    }
}
.pickerStyle(.menu)
// Ixcham β€” bitta qatorda label + tanlangan qiymat ko'rsatadi
// Bosish dropdown ochadi β€” ko'p variant uchun eng mos

.pickerStyle(.wheel) β€” aylanuvchi barabans

Picker("Soat", selection: $tanlananSoat) {
    ForEach(0..<24, id: \.self) { soat in
        Text("\(soat):00").tag(soat)
    }
}
.pickerStyle(.wheel)
// Vaqt tanlash yoki katta tartibli ro'yxat uchun
// Vertikal joy egallaydi β€” asosiy element bo'lganda mos

Form ichida .inline

Form {
    Section("Mavzu") {
        Picker("Mavzu", selection: $tanlangan) {
            ForEach(TartibVarianti.allCases) { v in
                Text(v.rawValue).tag(v)
            }
        }
        .pickerStyle(.inline)
        // List qatorlari ko'rinishida β€” Form ichida natural
    }
}

Tezkor ma'lumotnoma

UslubKo'rinishQachon
.pickerStyle(.menu)Tappable label β†’ dropdown4+ variant uchun standart
.pickerStyle(.segmented)Gorizontal segmentlar2–4 variant
.pickerStyle(.wheel)Aylanuvchi barabansTartibli son ro'yxati
.pickerStyle(.inline)List qatorlariForm/List ichida

Topshiriq: rang tanlash

enum Rang: String, CaseIterable, Identifiable yarating (Qizil, Ko'k, Yashil, Sariq). @State private var tanlangan: Rang = .qizil. Segmented Picker qo'shing. Tanlangan rangni Circle() ko'rinishida pastda ko'rsating (.fill(Color(...)) uslubida). Simulyatorda sinab ko'ring.

Buy mea coffee