0Pricing
Swift Academy · Pelajaran

Dasar-Dasar VStack, HStack, dan ZStack

Menumpuk view secara vertikal, horizontal, dan berdasarkan kedalaman dengan jarak serta perataan.

Dasar-Dasar VStack, HStack, dan ZStack adalah pelajaran Swift Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar Swift Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus Swift Academy mencakup 4 pelajaran total.

Selamat Datang

`VStack`, `HStack`, dan `ZStack` adalah tiga wadah tata letak utama dalam SwiftUI. Memahaminya sangat penting untuk membangun antarmuka apa pun.

VStack—Vertikal

```swift VStack(alignment: .leading, spacing: 8) { Text("Title").font(.title) Text("Subtitle").foregroundColor(.secondary) Button("Action") {} } ```

HStack—Horizontal

```swift HStack(spacing: 16) { Image(systemName: "star") Text("Favourite") Spacer() Text("4.9") } ```

ZStack—Kedalaman

```swift ZStack(alignment: .bottomTrailing) { Image("background") Text("Overlay") .padding() .background(Color.black.opacity(0.5)) } ```

Opsi Perataan

Perataan VStack: `.leading`, `.center`, `.trailing` Perataan HStack: `.top`, `.center`, `.bottom`, `.firstTextBaseline` Perataan ZStack: `Alignment` apa pun yang menggabungkan horizontal+vertikal

Parameter Jarak

```swift VStack(spacing: 0) { // no space between views Divider() Text("A") Divider() Text("B") } ```

Menumpuk Stack

```swift VStack { HStack { Image("icon"); Text("Name") } Text("Description") } ``` Stack dapat ditumpuk secara bebas untuk mencapai tata letak apa pun.

Spacer

```swift HStack { Text("Left") Spacer() // pushes views to edges Text("Right") } ```

Divider

```swift VStack { Text("Above") Divider() // horizontal line Text("Below") } ```

Performa: Group vs Stack

Untuk lebih dari 10 View anak, bungkus dalam `Group` atau beralih ke `LazyVStack` untuk menghindari batasan pohon View: ```swift ScrollView { LazyVStack { ForEach(items) { Text($0.name) } } } ```

Pemeriksaan Cepat

Stack mana yang menempatkan View sepanjang sumbu kedalaman, dari depan ke belakang?

Ringkasan

Inti pembelajaran: • `VStack`—vertikal; `HStack`—horizontal; `ZStack`—kedalaman • Gunakan parameter `alignment:` dan `spacing:` • `Spacer()` mendorong View di sebelahnya ke tepi • Tumpuk stack untuk tata letak yang kompleks • Gunakan `LazyVStack`/`LazyHStack` untuk daftar besar Selanjutnya: LazyVGrid dan LazyHGrid.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Dasar-Dasar VStack, HStack, dan ZStack” gratis?

Ya — teks lengkap “Dasar-Dasar VStack, HStack, dan ZStack” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus Swift Academy, upgrade ke CoddyKit PRO. Kursus Swift Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Dasar-Dasar VStack, HStack, dan ZStack”?

Menumpuk view secara vertikal, horizontal, dan berdasarkan kedalaman dengan jarak serta perataan. Kamu berlatih Swift Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai Swift Academy?

Tidak diperlukan pengalaman sebelumnya. Swift Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 1 dari 4.

Berapa lama pelajaran “Dasar-Dasar VStack, HStack, dan ZStack” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran Swift Academy ini?

Ya. Setiap pelajaran Swift Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

  1. Dasar-Dasar VStack, HStack, dan ZStack
  2. LazyVGrid dan LazyHGrid
  3. Modifier Spacer, Padding, dan Frame
  4. GeometryReader untuk Tata Letak Adaptif
← Kembali ke Swift Academy