Crear un paywall con un interruptor de prueba
Un interruptor de prueba te permite cambiar un paywall entre productos con prueba gratuita y productos sin ella. Pero el interruptor en sí es solo un conmutador: activado o desactivado. Tú escribes las reglas que muestran las tarjetas correctas y las reglas que cambian qué producto está seleccionado.
Esta receta te muestra cómo configurar estas reglas y crear un paywall completamente funcional con toggle.
Antes de empezar
- Construye una pantalla de paywall — por ejemplo, sigue la receta Crear una pantalla de paywall básica.
- Crea tus productos y añádeles la oferta de prueba.
Si quieres que la prueba sea opcional (lo cual es necesario para usar el toggle de prueba), no crees una oferta introductoria. En iOS, las ofertas introductorias se aplican automáticamente a todos los usuarios elegibles. No puedes desactivarlas. Usa una oferta promocional en su lugar. Consulta Cómo funciona Adapty con las ofertas.
1. Añadir las tarjetas de producto
- Haz clic en el menú Añadir elemento + > Paywall & Commerce > Products y elige un preset.
- Selecciona una tarjeta — en el canvas o en el panel Layers. Asigna un producto a la tarjeta y deja el desplegable de oferta en No offer.
- Repite el proceso para cada plan que vendas — una tarjeta por plan, sin el periodo de prueba.
- Duplica cada tarjeta. En cada copia, selecciona la oferta de prueba en el desplegable de oferta.
Cada plan tendrá ahora dos tarjetas que apuntan al mismo producto: una con la oferta y otra sin ella.
2. Añade el toggle de prueba
-
Haz clic en + > Paywall & Commerce > Trial Toggle.
-
Asegúrate de que el toggle pertenece a un grupo seleccionable del tipo correcto. Haz clic en un área vacía del canvas para abrir Screen settings. En Selectable groups, abre
trial_toggle, establece Group Type en Toggle y haz clic en Save. El cuadro de diálogo muestra la variable que usaremos para detectar si el toggle está activado:trial_toggle.isActive.
-
Edita la etiqueta del toggle.
Deja el toggle desactivado por defecto. Un toggle de prueba preseleccionado puede provocar el rechazo en la App Store por considerarse un patrón oscuro — consulta Toggles.
3. Muestra las tarjetas correctas según el estado del toggle
En la pestaña Design de cada tarjeta, en Visibility, selecciona Conditional y define su condición:
| Tarjeta | Condición |
|---|---|
| Con el trial | trial_toggle.isActive Equals True |
| Sin el trial | trial_toggle.isActive Equals False |
4. Selecciona una tarjeta visible cuando cambia el toggle
Las tarjetas ahora cambian con el toggle, pero el producto seleccionado no. Una tarjeta que se vuelve invisible sigue seleccionada, y la acción Purchase sigue apuntando a ella — así que un usuario que activa el período de prueba podría seguir siendo cobrado.
Añade una Conditional Action al toggle para que reinicie la selección a una tarjeta visible en cada toque.
- En el panel Layers, selecciona el contenedor Trial toggle.
- Abre la pestaña Interactions, añade el disparador On tap y una Conditional Action:
| Bloque | Qué configurar |
|---|---|
| if | trial_toggle.isActive Equals True |
| then | Select Product, apuntando a una tarjeta con el trial |
| else | Select Product, apuntando al mismo producto sin el trial |
5. Actualiza la etiqueta del botón
La llamada a la acción debe mostrar un texto diferente cuando el período de prueba está activo.
-
Selecciona el elemento de texto del botón.
-
En la pestaña Design, dentro de Content, selecciona Conditional y haz clic en Edit conditions.
-
Rellena los bloques:
Bloque Qué configurar if trial_toggle.isActiveEquals Truethen La etiqueta para el período de prueba, por ejemplo Start your free trialelse La etiqueta estándar, por ejemplo Purchase
Para más información sobre el texto condicional, consulta Añadir texto condicional.