Botones en el Flow Builder

Los botones son los elementos interactivos del Flow Builder que responden a los toques del usuario. Úsalos para:

  • CTAs de compra que conectan con productos y procesan transacciones automáticamente
  • Navegación: mover a los usuarios entre pantallas (Siguiente, Atrás, Cerrar, Omitir)
  • Enlaces de utilidad: Restaurar compras, Términos de servicio y Política de privacidad

Esta sección describe el nuevo Flow Builder, que funciona con versiones 4.0 o superiores del SDK de Adapty.

Añadir botones

Para añadir cualquier botón:

  1. Haz clic en + y selecciona Button.
  2. Selecciona un tipo de botón.
button-type.webp
  1. Los botones de compra, los enlaces y los botones de cierre vienen con acciones preconfiguradas. Para los enlaces, configura las URLs a las que se dirigirá a los usuarios. Para los demás tipos de botones, ve al panel Interactions. Ahí, en la sección Button triggers, configura las acciones que debe realizar el botón.
button-action.webp
  1. Configura el diseño del botón en el panel Design.

Tipos de botones

Botones de compra

Para que los botones de compra funcionen, vincula productos a las pantallas y añade el elemento Products. Consulta la guía.

Un botón de compra inicia la compra in-app del producto que el usuario haya seleccionado en la pantalla. El SDK procesa la transacción automáticamente, por lo que no necesitas gestionar las compras en el código de la app.

Para añadir un botón de compra:

  1. Haz clic en + y selecciona Button, luego elige un preset de botón.
  2. Con el botón seleccionado, abre la pestaña Interactions en el panel derecho.
  3. Haz clic en Add trigger > On tap, luego haz clic en Add action.
  4. Establece Action en Purchase y Product en products.selectedProduct. La variable products.selectedProduct siempre se resuelve al producto actualmente seleccionado en la pantalla.

Puedes atraer más atención hacia los botones de compra animándolos. El Paywall Builder admite actualmente el tipo de animación Pulse. Configura el estilo de animación en el panel Design.

purchase-button.webp

Los botones Terms of Use y Privacy Policy tienen integrada la acción Open URL. Establece la URL de destino ahí. Las URLs de Open URL vacías y los enlaces en línea bloquean la previsualización y la publicación.

Para cumplir con algunos requisitos de los stores, puedes añadir enlaces a:

  • Términos de servicio
  • Política de privacidad
  • Restauración de compras Para añadir enlaces:
  1. Haz clic en + y selecciona Button > Links. Esto añadirá una fila de botones en línea con acciones predefinidas: restaurar compras o abrir una URL. Si no necesitas todos los botones incluidos, elimina los que no necesites en el panel de capas.
add-links.webp

  1. A continuación, configura las acciones de los botones:

    • El botón Restore purchases ya gestiona la restauración de compras.
    • Para cada enlace restante:
      1. Haz clic en el botón para seleccionarlo y cambia a la pestaña Interactions en el panel derecho.
      2. Pega la URL en el campo.
      3. Por defecto, la URL se abre en un navegador integrado para una mejor experiencia de usuario. Si prefieres llevar a los usuarios a un navegador externo, marca la casilla Open in external browser.
pb-links.webp

Cerrar flow

El botón Close cierra el flow automáticamente.

Para añadir un botón de cierre, haz clic en + y selecciona Button > Close flow.

close-flow.webp

Usa la posición Absolute para colocar el botón de cierre en la esquina de la pantalla.

También puedes configurar cualquier otro botón para cerrar el flow usando acciones.

Botones personalizados

Cualquier botón que añadas puede configurarse para realizar una acción al pulsarlo: