gladtolinkblog

Aprovecha tu pantalla, rota el móvil

soporte

soporte

Share on linkedin
Share on facebook
Share on twitter
Share on google
Share on whatsapp

En ocasiones construimos formularios que se completan mejor con una vista apaisada pero las pantallas de los móviles al ser verticales nos complican el proceso.

En este tutorial, te enseñaré cómo sugerirle al usuario que gire su móvil para poder aprovechar toda su pantalla.

En el siguiente video podrás ver el resultado que obtendrías asl seguir todos los pasos.

Configuración:

Necesitarás crear dos etiquetas.

La etiqueta Alta Cliente será donde tendremos el formulario que queremos que el usuario rellene. Esto al ser un ejemplo hemos creado un formulario en el que se rellenarán los datos personales de un cliente.

La etiqueta Rota móvil contendrá el campo dónde almacenaremos el Gif.

El formulario de la etiqueta Alta Cliente.

El formulario de la etiqueta Rota el móvil.

Hola

A continuación deberás crear dos Bloques que concentrarán cada uno un botón para realizar diferentes acciones dentro del automatismo.

Hola

El Bloque Botón Enviar contendrá un botón llamado Continuar

Hola

El Bloque Botón enviar, contendrá un botón llamado Enviar

Hola

 

Una vez hemos creado todos los elementos, podemos crear el automatismo.

El nombre del automatismo será Dar de alta y será de tipo Crear PDF por defecto. Tendrás que introducir las etiquetas y los bloques creados anteriormente y dejar visibles únicamente la etiqueta de Rota el móvil y el Bloque Botón Continuar

Hola

La próxima configuración se encuentra en los Valores por campo. El campo que recibirá una modificación será el de tipo imagen que hay en la etiqueta Rota el móvil.

El tipo de valor tendrá que ser Constante y habrá que subir el Gif que se quiera, en nuestro ejemplo hemos puesto uno en el que dice Turn your phone

Hola

Este campo de tipo imagen recibirá un estilo con la siguiente configuración:

Hola

La distribución del espacio que se ha aplicado en este ejemplo es la siguiente:

Hola

Al entrar en el automatismo aparecerá la recomendación de rotar el móvil y el botón enviar, como no tendría ninguna lógica que el usuario pudiera dar al botón de enviar o enviar y nuevo, vamos a ocultar la barra de acciones inferior.

Hola

Finalmente, solo nos queda configurar las dos acciones de automatismo.

Una acción que la desencadenará el botón de Continuar y otra el botón Enviar.

El botón de Continuar ocultará la etiqueta de Rota móvil y el propio botón haciendo seguidamente visible la etiqueta que contiene el formulario a completar y el botón de enviar  ya que anteriormente hemos ocultado la barra inferior.

Hola

Configuración del botón Continuar

Hola

Configuración del botón Enviar

Hola

Comparteix-ho
Share on linkedin
Share on facebook
Share on twitter
Share on google
Share on whatsapp

Deja un comentario

ARTICLES RELACIONATS