Contenido del curso

Fundamentos de SwiftUI y desarrollo de Interfaces

Gestos en SwiftUI: tap, drag y long press

Resumen

Aprender a manejar gestos en SwiftUI te permite transformar una pantalla estática en una experiencia interactiva. Los gestos son la forma en que SwiftUI interpreta las interacciones físicas del usuario, como un toque, doble toque o arrastrar el dedo, y se aplican mediante modifiers sobre cualquier vista.

¿Cómo detectar un toque con onTapGesture?

El gesto más básico es onTapGesture, que ejecuta un bloque de código cuando el usuario toca una vista. Para probarlo, puedes crear una figura simple como un Circle y combinarlo con una variable de estado de tipo Color que inicie en negro y se aplique mediante foregroundStyle.

Dentro del bloque de onTapGesture cambias el valor de esa variable a rojo, y al presionar el círculo en pantalla, el color se actualiza al instante. Aquí entra en juego el concepto de state: SwiftUI redibuja la vista automáticamente cuando una variable marcada con @State cambia.

¿Cómo hago que un tap solo funcione con doble toque? Pasa el parámetro count: 2 dentro de onTapGesture. Así el bloque de código solo se ejecuta cuando el usuario toca dos veces seguidas.

¿Qué pasa si quiero detectar una pulsación larga?

Para las pulsaciones sostenidas existe onLongPressGesture. Funciona igual que el tap: recibe un bloque de código que se dispara cuando SwiftUI detecta que el usuario mantiene presionada la vista. En la práctica de la clase, ese gesto cambia el color del círculo a azul.

Lo interesante es que puedes ajustar cuánto tiempo debe durar la presión usando el atributo minimumDuration. Si le asignas un valor de tres segundos, el usuario tendrá que mantener el dedo presionado ese lapso exacto antes de que se ejecute la acción.

¿Cómo mover una vista con DragGesture en SwiftUI?

El gesto de arrastre es un poco más elaborado porque combina detección de movimiento con cambios de posición en pantalla. Se aplica con el modifier gesture, al que le pasas un DragGesture() seguido de su método onChanged, que entrega un value con la información del arrastre en tiempo real.

Para que el círculo realmente se mueva, necesitas tres piezas trabajando juntas:

  • Una variable de estado offset de tipo CGSize, inicializada en cero, que representa un punto en pantalla.
  • Dentro de onChanged, asignas el valor de la traslación del gesto a esa variable de estado.
  • Aplicas el modifier offset al círculo, pasándole el CGSize que acabas de actualizar.

Con esa conexión, cada vez que arrastras el dedo, el value del DragGesture actualiza el offset, SwiftUI redibuja la vista y el círculo sigue tu movimiento de forma fluida.

¿Qué es CGSize y por qué lo uso aquí? CGSize es una estructura que representa un ancho y un alto, y en este caso se usa para describir el desplazamiento del círculo respecto a su posición original.

¿Por qué los gestos requieren paréntesis y no llaves?

Un detalle técnico fácil de pasar por alto: cuando agregas un DragGesture dentro del modifier gesture, debes abrir paréntesis, no llaves. Las llaves son para closures como el onChanged, que sí recibe un bloque con value in. Confundir esa sintaxis es uno de los errores más comunes al empezar.

¿Qué gestos vale la pena dominar primero?

Si estás empezando con SwiftUI, estos son los tres gestos base que cubren la mayoría de interacciones:

  1. onTapGesture para toques simples o múltiples con el parámetro count.
  2. onLongPressGesture con minimumDuration para acciones que requieren intención.
  3. DragGesture combinado con @State y offset para mover elementos en pantalla.

Dominar estos tres te da una base sólida para luego explorar gestos más complejos como magnification, rotation o combinaciones simultáneas. La clave está en entender que cada gesto es un modifier que reacciona a un evento y modifica el estado de tu vista.

¿Qué interacción vas a construir primero en tu app? Cuéntame en los comentarios cómo piensas usar estos gestos para mejorar la experiencia de tus usuarios.