Published on

SwiftUI-da Menu komponentidan qanday foydalanish kerak

Authors

Bu β€” Menu.

Ushbu seriyaning oldinroq qismida men Picker haqida video qilgan edim, va Picker-da menu picker style degan narsa bor edi. Ammo SwiftUI-da shunchaki Menu deb ataladigan alohida komponent ham mavjud, va u Picker-dan hech bo'lmaganda osonroq, agar undan oson bo'lmasa, ishlatiladi. Menimcha, Apple aynan shu yo'nalishga β€” bitta umumiy Picker o'rniga, har bir holat uchun alohida komponentlar yaratishga β€” o'tib bormoqda (buni so'zimga olmang, aniq bilmayman), ammo, baribir, bu juda-juda oson ishlatiladi. Menimcha, bu video taxminan ikki daqiqa davom etadi β€” keling, ko'rib chiqaylik, fikringizni bilib olaman.


Bu, ehtimol, ushbu seriyadagi eng tezkor video bo'lishi mumkin. shu komponentni sizning asboblar qutingizga qo'shib qo'ymoqchiman.

Yangi SwiftUI fayl yaratish

Navigator-da o'ng tugmani bosib, yangi fayl yaratamiz β€” bu SwiftUI View bo'ladi, va unga MenuBootcamp deb nom beramiz.

Bu juda tushunarli, ammo to'g'ridan-to'g'ri ishga kirishaylik. Ushbu seriyaning oldinroq videosida men, nima derdim... Picker Bootcampni ko'rib chiqgan edim, va u yerda Picker-ning menu picker stylei bor edi β€” tezda shu ko'rinishini eslatib o'taman:

Picker("Select an option", selection: $selectedOption) {
    Text("One").tag(1)
    Text("Two").tag(2)
    Text("Three").tag(3)
}
.pickerStyle(.menu)

Bu, taxminan, shunday ko'rinishga ega edi. Shunday tuyuladi: Apple endi shu umumiy Pickerdan uzoqlashib, ehtimol, biroz maxsuslashtirilgan komponentlarga o'tmoqda. Buning aniq sababini bilmayman, ammo Menu β€” aynan shu UI-ni yaratishning yangi yo'li.


Oddiy Menu yaratish

Shuning uchun, endi biz juda sodda bir Menu yaratamiz. title va **content**dan foydalanamiz β€” title sifatida "Click me" deb yozamiz, va content qismida bir nechta tugma qo'shamiz:

Menu("Click me") {
    Button("One") {
        // amal
    }

    Button("Two") {
        // amal
    }

    Button("Three") {
        // amal
    }

    Button("Four") {
        // amal
    }
}

Men shunchaki shu tugmani nusxalab, ikki-uch marta yana joylashtirdim β€” to'rt tugma, juda sodda va oson mantiq.

Menu β€” aynan, ochiladigan menyu (dropdown) kabi ishlaydi. Ekrandagi joylashishiga qarab, u tugmaning ustida yoki ostida paydo bo'ladi.

Bu β€” juda qulay kichik komponent, va men buni ilovangizga qo'shishni tavsiya qilaman. Bu, masalan, bir nechta variantga ega filter yoki toggle uchun juda mos kelishi mumkin β€” Picker ishlatadigan har qanday holat uchun, faqat bu sana tanlovchi (date picker) emas, balki besh-o'n ta variantdan iborat bo'lgan har qanday tanlov bo'lsa, bu β€” buning uchun ajoyib variant.


Xulosa

Mana shu β€” butun video shu qadar, juda-juda sodda bir video bo'ldi. Men buni shunchaki qog'ozga tushirib, sizning asboblar qutingizga qo'shib qo'ymoqchi edim.

Tomosha qilganingiz uchun rahmat! , va keyingi videoda ko'rishamiz!

Buy mea coffee