Published on: Sunday, February 15, 2026

Swipe amallari

Authors

Name
ShoxruxC
@iOSdasturchi

Pochta ilovasini oching va xabar ustidan chapga siljiting — o'chirish tugmasi paydo bo'ladi. O'ngga siljiting — o'qilgan/o'qilmagan almashadi. Bu iOS-da swipe amallari deb ataladi va foydalanuvchilar ularni tabiiy kutadi.

SwiftUI-da ikkita yondashuv mavjud: .onDelete — standart qizil o'chirish uchun tezkor usul, va .swipeActions — ikonka, rang va xatti-harakat ustida to'liq nazorat uchun.

.onDelete ForEach-ga qo'llaniladi, List-ga emas. Massiv @State bo'lishi kerak — o'zgartirib bo'ladigan va view-ga tegishli.

Swift•

ContentView.swift

import SwiftUI

struct ContentView: View {
@State private var kitoblar = ["Dune", "1984", "Hobbit", "Foundation"]

  var body: some View {
      NavigationStack {
          List {
              ForEach(kitoblar, id: \.self) { kitob in
                  Text(kitob)
              }
              // .onDelete swipe-to-delete qo'shadi — ForEach-ga qo'llanadi
              .onDelete(perform: kitobniOchir)
          }
          .navigationTitle("Kitoblar")
          // EditButton edit mode-ni boshqaradi — o'chirish doiralari ko'rinadi
          .toolbar { EditButton() }
      }
  }

  // Bu funksiya o'chiriladigan qatorlarning IndexSet-ini qabul qiladi
  func kitobniOchir(at offsets: IndexSet) {
      // .remove(atOffsets:) berilgan pozitsiyalardagi elementlarni olib tashlaydi
      kitoblar.remove(atOffsets: offsets)
  }

}

Swipe amallari variantlari

.swipeActions — maxsus tugmalar

ForEach(kitoblar) { kitob in
    KitobQatori(kitob: kitob)
        // .swipeActions chapga siljitganda (trailing) tugmalar qo'shadi
        .swipeActions(edge: .trailing) {
            Button(role: .destructive) {
                kitobniOchir(kitob)
            } label: {
                Label("O'chirish", systemImage: "trash")
            }
        }
        // .swipeActions o'ngga siljitganda (leading) ham ishlaydi
        .swipeActions(edge: .leading) {
            Button {
                sevimlilaragaQosh(kitob)
            } label: {
                Label("Sevimli", systemImage: "star.fill")
            }
            .tint(.yellow)
        }
}

Ikkala chetga ham swipe amallari qo'shish mumkin. role: .destructive tugmani avtomatik qizil qiladi. Boshqa amallar uchun .tint() bilan maxsus rang bering.

.onMove — qayta tartiblash

ForEach(kitoblar, id: \.self) { kitob in
    Text(kitob)
}
.onDelete(perform: kitobniOchir)
// .onMove edit mode-da drag tutqichlarini yoqadi
.onMove(perform: kitobniKochir)

func kitobniKochir(from source: IndexSet, to destination: Int) {
    // .move(fromOffsets:toOffset:) massivni joyida yangilaydi
    kitoblar.move(fromOffsets: source, toOffset: destination)
}

.onMove edit mode-da uch gorizontal chiziqli drag tutqichlarini ko'rsatadi. Foydalanuvchi qatorni bosib ushlab sudraydi. EditButton() edit mode-ni yoqadi.

Keng tarqalgan xato: Massiv uchun @State o'rniga let ishlatish. Agar massiv @State bo'lmasa, elementlarni o'chirishda ro'yxat yangilanmaydi — xato yoki hech qanday vizual o'zgarish bo'lmaydi. O'zgartirmoqchi bo'lgan har qanday ro'yxat @State ishlatishi kerak.

Tezkor ma'lumotnoma

Sintaksis	Vazifasi
`.onDelete(perform:)`	ForEach-ga swipe-to-delete qo'shadi — IndexSet bilan funksiya chaqiradi
`massiv.remove(atOffsets: offsets)`	Massivdan berilgan indekslardagi elementlarni olib tashlaydi
`.swipeActions(edge: .trailing)`	Chapga siljitganda maxsus tugmalar
`.swipeActions(edge: .leading)`	O'ngga siljitganda maxsus tugmalar
`Button(role: .destructive)`	Tugmani avtomatik qizil qiladi
`.onMove(perform:)`	Edit mode-da drag-to-reorder
`EditButton()`	Tizim tugmasi — ro'yxat edit mode-ni almashadi

Topshiriq: vazifalar ro'yxati

@State massiv bilan vazifalar ro'yxati yarating. .onDelete qo'shing. Chapga swipe qilganda sariq "Keyinga qoldirish" tugmasi chiqsin (.swipeActions). .onMove va EditButton() qo'shing. Simulyatorda barchasini sinab ko'ring.