SwiftUI Academy · Pelajaran

Detent & Indikator Geser

Ubah ukuran sheet dengan detent presentasi.

Detent & Indikator Geser adalah pelajaran SwiftUI Academy gratis di CoddyKit. Ini adalah pelajaran 2 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 SwiftUI Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus SwiftUI Academy mencakup 4 pelajaran total.

Bagian dari pelajaran ini belum diterjemahkan dan ditampilkan dalam bahasa Inggris.

What Are Detents?

A detent is a stopping height a sheet can rest at, like half-open or full. They let users resize the sheet by dragging it. 📏

The presentationDetents Modifier

Add presentationDetents inside the sheet content to list the heights it can snap to. Pass a set of detents to enable resizing.

.presentationDetents([.medium, .large])

Medium and Large

The two built-in detents are .medium, about half the screen, and .large, nearly full height. Offer both so users pick what fits.

.presentationDetents([.medium, .large])

A Fixed Height Detent

Use .height to pin a sheet to an exact point size. This is great for short forms that should not grow taller than needed.

.presentationDetents([.height(220)])

A Fraction Detent

The .fraction detent sizes the sheet to a share of the screen, like a third. It adapts nicely across different device sizes.

.presentationDetents([.fraction(0.33)])

The Drag Indicator

The little grabber bar at the top is the drag indicator. It hints that the sheet can be pulled up, down, or dismissed.

Showing the Grabber

Add presentationDragIndicator set to .visible to always show the grabber, even when only one detent is available.

.presentationDragIndicator(.visible)

Combining Modifiers

Detents and the drag indicator stack together on the sheet content. Apply both for a resizable sheet with a clear grab handle. ✨

ContentView()
    .presentationDetents([.medium, .large])
    .presentationDragIndicator(.visible)

Tracking the Selected Detent

Bind presentationDetents to a state value to know which height the user chose, so your layout can react to the current size.

.presentationDetents([.medium, .large], selection: $detent)

Why Detents Matter

Detents keep sheets non-blocking. A medium sheet lets users glance at content while still seeing the screen behind it.

One Detent, No Resize

If you pass a single detent, the sheet stays one fixed height and cannot be resized, though it can still be swiped to dismiss.

.presentationDetents([.medium])

Quick Check

Which modifier lets a sheet snap to multiple heights?

Recap: Detents

You can now resize sheets with detents like .medium, .large, and .fraction, plus show a grabber with the drag indicator. Great progress! 🎉

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Detent & Indikator Geser” gratis?

Ya — teks lengkap “Detent & Indikator Geser” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus SwiftUI Academy, upgrade ke CoddyKit PRO. Kursus SwiftUI Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Detent & Indikator Geser”?

Ubah ukuran sheet dengan detent presentasi. Kamu berlatih SwiftUI 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 SwiftUI Academy?

Tidak diperlukan pengalaman sebelumnya. SwiftUI 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 2 dari 4.

Berapa lama pelajaran “Detent & Indikator Geser” 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 SwiftUI Academy ini?

Ya. Setiap pelajaran SwiftUI 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

← Kembali ke SwiftUI Academy