Published on: Saturday, February 14, 2026

Bo'limlar va sarlavhalar

Authors

Name
ShoxruxC
@iOSdasturchi

Bo'limlar va sarlavhalar

Ro'yxatlar o'sib borgani sari tekis qatorlar to'plami haddan tashqari katta bo'lib qolishi mumkin. Section — tegishli qatorlarni umumiy sarlavha ostida guruhlashtiruvchi SwiftUI usuli, xuddi Kontaktlar nomlarni alfavit bo'yicha yoki Sozlamalar nazoratlarni kategoriya bo'yicha guruhlagani kabi.

Bo'limlarni kitobdagi boblar sifatida tasavvur qiling. Har bir bobning sarlavhasi nimalar kelishini aytadi, tegishli kontent uning ostida joylashadi. List ichida istalgancha bo'lim bo'lishi mumkin, har birining o'z sarlavhasi, pastki sarlavhasi yoki ikkisi ham bo'lishi mumkin.

Swift•

ContentView.swift

import SwiftUI

struct ContentView: View {
let oqilmoqda = ["Dune", "1984"]
let tugatilgan = ["Hobbit", "Ender's Game", "Foundation"]

  var body: some View {
      NavigationStack {
          List {
              // Section tegishli qatorlarni guruhlaydi va ustida sarlavha beradi
              Section("O'qilmoqda") {
                  ForEach(oqilmoqda, id: \.self) { sarlavha in
                      Text(sarlavha)
                  }
              }
              // Ikkinchi Section pastda alohida guruh yaratadi
              Section("Tugatilgan") {
                  ForEach(tugatilgan, id: \.self) { sarlavha in
                      Text(sarlavha)
                  }
              }
          }
          .navigationTitle("Kitoblarim")
      }
  }

}

Bo'lim variantlari

Sarlavha va pastki sarlavha bilan Section

Section {
    Toggle("Bildirishnomalar", isOn: $bildirishnomalarYoqilgan)
    Toggle("Tovushlar", isOn: $tovushlarYoqilgan)
} header: {
    // Maxsus sarlavha view — faqat Text emas, istalgan view
    Text("Ogohlantirishlar")
} footer: {
    // Pastki sarlavha bo'lim ostida kichik kulrang matnda ko'rinadi
    Text("Bildirishnomalar qulf ekranida ko'rinadi.")
}

header: va footer: parametrlari istalgan view-ni qabul qiladi — faqat Text qatorini emas. Pastki sarlavhalar sozlamalar yoki forma maydonlari guruhidan qo'shimcha kontekst berish uchun ajoyib.

.listStyle(.insetGrouped)

List {
    Section("Hisob") { /* qatorlar */ }
    Section("Maxfiylik") { /* qatorlar */ }
}
// iOS 16+ da default — aniqlik uchun ochiq belgilanadi
.listStyle(.insetGrouped)

SwiftUI-dagi iOS uchun standart ro'yxat uslubi — har bir bo'limga yumaloq burchakli karta ko'rinishini va chetlarda chekinish beradi. Boshqa variantlar: .plain, .grouped, .sidebar.

Maxsus sarlavha View bilan Section

Section {
    ForEach(kitoblar) { kitob in KitobQatori(kitob: kitob) }
} header: {
    HStack {
        Image(systemName: "star.fill")
            .foregroundStyle(.yellow)
        // Avtomatik katta harfga o'tkazilishining oldini olish
        Text("Eng Yaxshilar").textCase(nil)
    }
}

Sarlavha qatorini to'liq view bilan almashtirish ikonkalar, ranglar yoki istalgan layoutni qo'shish imkonini beradi. .textCase(nil) SwiftUI-ning sarlavhalarni avtomatik katta harfga o'tkazishini oldini oladi.

Sarlavha matni avtomatik stillanadi: SwiftUI platform konventsiyalariga mos kelish uchun bo'lim sarlavha matnini avtomatik bosh harf bilan yozadi va stillashtiradi. Ko'rinishni moslashtirmoqchi bo'lmasangiz, unga shrift yoki ranglar belgilashingiz shart emas.

Tezkor ma'lumotnoma

Sintaksis	Vazifasi
`Section("Sarlavha") { }`	Oddiy matnli sarlavha bilan bo'lim
`Section { } header: { } footer: { }`	Maxsus sarlavha va pastki sarlavha view bilan bo'lim
`.listStyle(.insetGrouped)`	Yumaloq karta bo'limlari — iOS-da default
`.listStyle(.plain)`	Bo'lim karta uslubisiz — to'liq kengilikli ajratgichlar
`Text("sarlavha").textCase(nil)`	Sarlavhalarning avtomatik katta harfga o'tkazilishini o'chiradi

Topshiriq: sozlamalar ekrani

3 ta bo'limli sozlamalar ekrani yarating: "Hisob" (ism, email qatorlari), "Bildirishnomalar" (2 ta Toggle) va "Ilova haqida" (versiya, litsenziya qatorlari). "Bildirishnomalar" bo'limiga pastki sarlavha qo'shing. .insetGrouped uslubini qo'llang. Simulyatorda sinab ko'ring.