Published on: Tuesday, February 17, 2026

List, ForEach yoki ScrollView: qaysi birini tanlash kerak

Authors

Name
ShoxruxC
@iOSdasturchi

Hozirgacha List, ForEach va ehtimol ScrollView haqida eshitgansiz. Ular barchasi viewlar to'plamini ko'rsatishni o'z ichiga oladi, shuning uchun noto'g'risini tanlash va nima uchun ishlayotgani yo'qligini hayron bo'lib o'ylash oson. Bu dars yangi API yo'q — faqat ravshanlık. Har bir yondashuvning nima qilib, nima qilmasligini, noto'g'ri tanlaganda qanday xatolar yuzaga kelishini va yangi ekran boshlaganingizda o'zingizga beradigan oddiy savollarni ko'rasiz.

Buni erta to'g'ri tushunish keyinchalik ko'p debug vaqtini tejaydi. ScrollView + ForEach kerak bo'lganida List tanlash yoki aksincha — tushunarsiz layoutdagi muammolarga olib keladi.

Swift•

List — standart iOS ro'yxat xususiyatlari kerak bo'lganda

import SwiftUI

struct ContentView: View {
let kontaktlar = ["Alisher", "Bobur", "Dildora", "Jasur"]

  var body: some View {
      NavigationStack {
          // List — swipe amallari, edit mode, NavigationLink kerak bo'lganda to'g'ri tanlov
          List(kontaktlar, id: \.self) { kontakt in
              NavigationLink(kontakt, value: kontakt)
          }
          .navigationDestination(for: String.self) { ism in
              Text(ism).navigationTitle(ism)
          }
          .navigationTitle("Kontaktlar")
      }
  }

}

Uch vosita bir ko'rinishda

Vosita	Nima	Nima beradi
`List`	Qator uslubi bilan scrollable konteyner	Separatorlar, swipe amallari, edit mode, selection, pull-to-refresh, bo'lim sarlavhalari — barchasi avtomatik
`ForEach`	Faqat view yaratuvchi sikl — konteyner emas	Faqat generatsiya qilingan view-lar. Konteyner (List, VStack, ScrollView) ichiga joylashtirilishi shart
`ScrollView`	Qator uslubisiz scrollable konteyner	Scroll va to'liq layout nazorati. Spacing, ajratgich va interaksiyani o'zingiz boshqarasiz

Qaysi birini ishlating

List qachon

// List quyidagilar kerak bo'lganda to'g'ri tanlov:
// - Swipe-to-delete yoki maxsus swipe amallari
// - Edit mode, selection yoki qayta tartiblash
// - Pull-to-refresh
// - Standart viewdagi bo'lim sarlavhalari
// - NavigationLink qatorlari
List(kontaktlar) { kontakt in
    NavigationLink(kontakt.ism, value: kontakt)
}
.swipeActions { /* ... */ }
.refreshable { await yuklash() }

ScrollView + ForEach qachon

// ScrollView quyidagilar kerak bo'lganda to'g'ri:
// - Maxsus karta layoutlari (qator separatorlari yoki inset uslubi yo'q)
// - Gorizontal scroll
// - Aralash kontent turlari (bannerlar, kartalar, matn, rasmlar)
// - Spacing va vizual uslub ustida to'liq nazorat
ScrollView {
    VStack(spacing: 16) {
        ForEach(retseptlar) { retsept in
            RetseptKartasi(retsept: retsept)
        }
    }
    .padding()
}

ForEach yolg'iz qachon

// ForEach yolg'iz (ScrollView yoki List wrappersiz) qachon to'g'ri:
// - Form, Group yoki HStack ichida view-lar generatsiya qilishda
// - Ota-ona konteyner allaqachon layout va scrollni boshqarayotganda
// - Generatsiya qilingan va statik view-larni bir blokda aralashtirishda
Form {
    Section("Teglar") {
        // ForEach mavjud Form konteyneri ichida Toggle qatorlari generatsiya qiladi
        ForEach(teglar) { teg in
            Toggle(teg.nomi, isOn: $teg.tanlangan)
        }
    }
}

Umumiy xatolar

Xato	Nima bo'ladi	Yechim
To'liq layout nazorati kerak bo'lganda `List` ishlatish	Qator separatorlari, inset marginslar va tizim uslubi istamaganingizda paydo bo'ladi	`ScrollView + VStack + ForEach` ga o'ting
`ScrollView + ForEach` ga swipe-to-delete qo'shish	Ko'p kod, izchilsiz ko'rinish, tizim xatti-harakati bilan mos kelmaydi	`.onDelete` bilan `List` ishlatish
`List` ni `ScrollView` ichiga joylash	Layout buziladi, scroll ziddiyatlari, oldindan aytib bo'lmaydigan balandliklar	`List`-ni hech qachon `ScrollView` ichiga joylamang
Uzun kontent uchun `ForEach`-ni scrollable konteynerda ishlatmaslik	Kontent ekrandan tashqariga chiqib ketadi, scroll yo'q	`ScrollView` yoki `List`-ga o'rang
`List` selection kerak bo'lganda `ScrollView` ishlatish	Selection ajratish va edit mode ishlamaydi	`List(selection:)` ishlating

Vaziyat bo'yicha eng yaxshi tanlov

Vaziyat	Eng yaxshi tanlov
Toggle va navigatsiya havolalari bilan sozlamalar ekrani	`List`
Maxsus spacing bilan foto kartalar sotsial feed	`ScrollView + VStack + ForEach`
Gorizontal aylanish karuseli	`ScrollView(.horizontal) + HStack + ForEach`
Swipe-to-complete va delete bilan vazifalar ro'yxati	`List`
Form bo'limi ichida Toggle qatorlari	`ForEach` Form Section ichida (wrapper shart emas)
Rasm thumbnail gridi	`LazyVGrid` (Stage 9-da o'rganiladi)
A–Z bo'lim sarlavhalari bilan kontaktlar ro'yxati	Har harf uchun Section bilan `List`

Stage 5 xulosa: ro'yxatlar va ma'lumotlarni ko'rsatish

Real iOS ilovasi markazida deyarli har doim ma'lumotlar ko'rsatish qatlami bo'ladi — va endi siz uni qurishni bilasiz.

Mavzu	Asosiy fikr
List Asoslari	iOS ro'yxat uslumida scrollable konteyner. `Identifiable` struct-lar bilan yoki `id:` bilan ishlating. `.listStyle` bilan uslubni o'zgartiring.
ForEach	View generator — konteyner emas. `List`, `VStack` yoki `ScrollView` ichiga joylashtiring. `.onDelete` va `.onMove` ForEach-ga qo'llaniladi.
Maxsus Qatorlar	Har bir qator uchun alohida view struct. `HStack + VStack` kombinatsiyasi va `Spacer()` bilan professional patternlar.
Bo'limlar	`Section` bilan tegishli qatorlarni guruhlang. Sarlavha va pastki sarlavha qo'shing. `.insetGrouped` iOS standart ko'rinishi.
Swipe Amallari	`.onDelete` standart o'chirish uchun, `.swipeActions` maxsus tugmalar uchun. `EditButton()` edit mode-ni yoqadi.
Tortib Yangilash	`.refreshable { await ... }` — spinner, gesture va kutish avtomatik. `async/await` to'liq Stage 8-da.
To'g'ri Vositani Tanlash	List — tizim xususiyatlari kerak bo'lganda; ScrollView+ForEach — maxsus layout; ForEach yolg'iz — mavjud konteyner ichida.

Topshiriqlardan birini o'tkazib yuborgan bo'lsangiz, qaytib bajaring — barchasi bitta kitoblar ro'yxati loyihasining davomi va har biri oldingilarning ustiga quriladi.

Keyingi: Stage 6 — Formalar va Foydalanuvchi Kirishi. Matn yig'ish, sozlamalarni almashtirish, sanalarni tanlash va har bir ilova uchun zarur bo'lgan ma'lumot kiritish ekranlarini qurish.