← Documentación
General

Tarjetas

Una pila de TARJETAS como en Tinder: se ve la de arriba, se arrastra con el dedo y, si la sueltas lejos hacia un lado, sale volando y corre el evento de esa dir

Una pila de TARJETAS como en Tinder: se ve la de arriba, se arrastra con el dedo y, si la sueltas lejos hacia un lado, sale volando y corre el evento de esa dirección (Al deslizar a la derecha = «me gusta», a la izquierda = «no me gusta»…). Después aparece la siguiente; al acabarse corre «Al acabarse las tarjetas». Cómo se arma: agrega tarjetas con «+ Agregar tarjeta» (en Estilo) y arrastra a cada una sus controles. Cada tarjeta es un contenedor normal. Para llenarla con datos (una tarjeta por elemento de un JSON) usa «Agregar tarjetas (colección)»: en los eventos, el elemento de la tarjeta que decidiste se lee con «Items» (por ejemplo su id), y «Dato del evento» trae la dirección. Opciones: deslizar también arriba/abajo, botones ✕ (izquierda) y ♥ (derecha) para decidir sin arrastrar, y un texto opcional que aparece mientras arrastras hacia cada lado (ej. «ME GUSTA» / «NO»). En el editor se ve una tarjeta a la vez con flechas para cambiar; el arrastre y los eventos funcionan en Preview y en el celular.

Estilo

  • También deslizar arriba y abajo
  • Botones ✕ y ♥ debajo

Data

  • Texto al ir a la izquierda (opcional)
  • Texto al ir a la derecha (opcional)

Eventos

  • Al cargar — Cuando el componente aparece en pantalla
  • Al deslizar a la derecha — Un deslizamiento del dedo hacia la derecha sobre este componente
  • Al deslizar a la izquierda — Un deslizamiento del dedo hacia la izquierda sobre este componente
  • Al deslizar hacia arriba — Un deslizamiento del dedo hacia arriba sobre este componente
  • Al deslizar hacia abajo — Un deslizamiento del dedo hacia abajo sobre este componente
  • Al acabarse las tarjetas — Cuando ya no quedan tarjetas por decidir