0Pricing
SwiftUI Academy · Lección

Detents e indicadores de arrastre

Cambie el tamaño de las sheets con presentation detents.

Detents e indicadores de arrastre es una lección gratuita de SwiftUI Academy en CoddyKit. Esta es la lección 2 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de SwiftUI Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de SwiftUI Academy incluye 4 lecciones en total.

Partes de esta lección aún no han sido traducidas y se muestran en inglés.

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! 🎉

Preguntas frecuentes

¿La lección «Detents e indicadores de arrastre» es gratis?

Sí — el texto completo de «Detents e indicadores de arrastre» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de SwiftUI Academy, actualiza a CoddyKit PRO. El curso de SwiftUI Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Detents e indicadores de arrastre»?

Cambie el tamaño de las sheets con presentation detents. Practicas SwiftUI Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar SwiftUI Academy?

No se requiere experiencia previa. SwiftUI Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 2 de 4.

¿Cuánto tiempo toma la lección «Detents e indicadores de arrastre»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de SwiftUI Academy?

Sí. Cada lección de SwiftUI Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

  1. Presentar una Sheet
  2. Detents e indicadores de arrastre
  3. Alertas con acciones
  4. Diálogos de confirmación
← Volver a SwiftUI Academy