Published on: Thursday, September 17, 2026

SwiftUI-da ro'yxat surish amallar (Swipe Actions)

Authors

Name
ShoxruxC
@iOSdasturchi

Hammaga xush kelibsiz! Mening ismim Nick, bu — Swiftful Thinking kanali.

iOS 15 da Apple bizga yangi modifier berdi — .swipeActions(). Bu modifier ro'yxat qatorlarini surishda paydo bo'ladigan maxsus tugmalar qo'shish imkonini beradi. Ilgari faqat o'chirish amali (onDelete) mavjud edi. Endi istalgan tugmani, istalgan tomondan qo'shish mumkin.

Yangi fayl yaratish

Navigatorda o'ng tugma bosib yangi SwiftUI fayli yarating. Uni ListSwipeActionsBootcamp deb nomlang va Create tugmasini bosing. Canvas-da Resume bosing.

Boshlang'ich ro'yxat

struct ListSwipeActionsBootcamp: View {

    let fruits = ["olma", "apelsin", "banan", "shaftoli"]

    var body: some View {
        List {
            ForEach(fruits, id: \.self) { fruit in
                Text(fruit.capitalized)
            }
        }
    }
}

iOS 14 — faqat o'chirish

iOS 14 da yagona surish amali — .onDelete():

ForEach(fruits, id: \.self) { fruit in
    Text(fruit.capitalized)
}
.onDelete { indexSet in
    // o'chirish amali
}

iOS 15 — `.swipeActions()` bilan maxsus tugmalar

Endi har bir qatorga xohlagan tugmalarni qo'shish mumkin:

ForEach(fruits, id: \.self) { fruit in
    Text(fruit.capitalized)
        .swipeActions(
            edge: .trailing,
            allowsFullSwipe: true
        ) {
            Button("Arxiv") {
                // arxivlash amali
            }
            .tint(.green)
        }
}

Parametrlar

edge — tugmalar qaysi tomondan chiqadi: .trailing (o'ng, standart) yoki .leading (chap)
allowsFullSwipe — foydalanuvchi to'liq surishda birinchi tugmani avtomatik bajarsinmi

Bir nechta tugma qo'shish

ForEach(fruits, id: \.self) { fruit in
    Text(fruit.capitalized)
        .swipeActions(edge: .trailing, allowsFullSwipe: false) {
            Button("Arxiv") {}
                .tint(.green)

            Button("Saqlash") {}
                .tint(.blue)

            Button("Spam") {}
                .tint(.black)
        }
}

Bir nechta tugma bo'lganda allowsFullSwipe: false tavsiya etiladi — aks holda to'liq surishda tugmalar bir-birini bosib chiqadi.

Ikkala tomondan tugma qo'shish

.swipeActions() bir nechta marta qo'llanishi mumkin:

ForEach(fruits, id: \.self) { fruit in
    Text(fruit.capitalized)
        // O'ng tomondan
        .swipeActions(edge: .trailing, allowsFullSwipe: false) {
            Button("Arxiv") {}
                .tint(.green)

            Button("Saqlash") {}
                .tint(.blue)

            Button("Spam") {}
                .tint(.black)
        }
        // Chap tomondan
        .swipeActions(edge: .leading, allowsFullSwipe: true) {
            Button("Ulash") {}
                .tint(.yellow)
        }
}

`allowsFullSwipe` — to'liq surish

true — foydalanuvchi qatorni oxirigacha surishda birinchi tugma avtomatik bajariladi. Faqat bitta tugma bo'lganda qulayroq.
false — qanchalik surmasin, foydalanuvchi tugmani albatta bosishi kerak.

// Bitta tugma — to'liq surish mantiqli
.swipeActions(edge: .trailing, allowsFullSwipe: true) {
    Button("O'chirish") {}
        .tint(.red)
}

// Ko'p tugma — to'liq surishni o'chirish tavsiya etiladi
.swipeActions(edge: .trailing, allowsFullSwipe: false) {
    Button("Arxiv") {}
        .tint(.green)
    Button("Spam") {}
        .tint(.black)
}

To'liq kod

struct ListSwipeActionsBootcamp: View {

    let fruits = ["olma", "apelsin", "banan", "shaftoli"]

    var body: some View {
        List {
            ForEach(fruits, id: \.self) { fruit in
                Text(fruit.capitalized)
                    // O'ng tomondan uchta tugma
                    .swipeActions(edge: .trailing, allowsFullSwipe: false) {
                        Button("Arxiv") {
                            print("\(fruit) arxivlandi")
                        }
                        .tint(.green)

                        Button("Saqlash") {
                            print("\(fruit) saqlandi")
                        }
                        .tint(.blue)

                        Button("Spam") {
                            print("\(fruit) spam")
                        }
                        .tint(.black)
                    }
                    // Chap tomondan bitta tugma
                    .swipeActions(edge: .leading, allowsFullSwipe: true) {
                        Button("Ulash") {
                            print("\(fruit) ulashildi")
                        }
                        .tint(.yellow)
                    }
            }
        }
    }
}

Xulosa

Bu videoda o'rgandik:

.swipeActions() — iOS 15 da qo'shilgan, ro'yxat qatorlariga surish tugmalari qo'shadi
edge: .trailing — o'ng tomondan (standart)
edge: .leading — chap tomondan
.tint() — tugma rangini belgilaydi
allowsFullSwipe: true — to'liq surishda birinchi tugma avtomatik bajariladi (bitta tugma uchun qulay)
allowsFullSwipe: false — ko'p tugma bo'lganda tavsiya etiladi
Bir qatorga .swipeActions() ni bir necha marta qo'llash mumkin

List — SwiftUI-ning eng kuchli komponentlaridan biri va Apple har yangi versiyada unga yangi imkoniyatlar qo'shib bormoqda.

Rahmat tomosha qilganingiz uchun! Men — Nick, bu Swiftful Thinking. Keyingi videoda ko'rishamiz!