Identificar componentes para hacer que una aplicación de lienzo esté optimizada para dispositivos móviles

Completado

En esta unidad, exploramos algunos componentes de Power Apps para crear aplicaciones optimizadas para dispositivos móviles; estos son algunos de ellos:

  • Creación de una aplicación de lienzo

  • Configuración de visualización de la aplicación

  • Formularios con capacidad de respuesta

  • Consideraciones de control y diseño de formularios

  • Contenedores

  • Capacidades sin conexión

  • Alertar a los usuarios sobre la falta de conectividad

Creación de una aplicación de lienzo

Finalice la planificación y vaya a la página principal de Power Apps para empezar la aplicación. Seleccione la opción Crear y Comenzar desde una aplicación en blanco para crear una aplicación de lienzo en blanco. Power Apps propone la opción Formato o factor de forma incluso antes de crear su aplicación. Este es su primer punto de opción para adoptar el factor de forma que necesita para su aplicación móvil y que mejor se adapte a sus necesidades.

Captura de pantalla del cuadro de diálogo

Puede usar cualquier diseño en un teléfono móvil o tableta, pero tendrá diferentes experiencias. Por ejemplo, cuando crea un diseño de teléfono, la aplicación asumirá una orientación vertical e incluirá la capacidad para que el usuario se desplace hacia arriba y hacia abajo en una ventana estrecha del dispositivo. En el modo de tableta, el diseño en ese mismo dispositivo supondrá que el usuario trabaja en modo horizontal y que se sujeta el dispositivo en posición horizontal de manera predeterminada. La mejor aplicación varia según el caso.

Configuración de visualización de la aplicación

Al editar la aplicación de lienzo, puede navegar a Configuración > Pantalla y ver varias configuraciones importantes de visualización.

  • Orientación: la orientación de la aplicación será el diseño de presentación predeterminado de su aplicación. Puede estar en la orientación vertical más larga o en la orientación horizontal más amplia.

  • Escalar para ajustar: para un diseño de aplicación con capacidad de respuesta, la recomendación es establecer esta opción en Desactivado. De forma predeterminada, se establece en Activado.

  • Bloquear relación de aspecto: esta función mantiene automáticamente la relación entre alto y ancho. Solo está habilitada si la opción Escalar para ajustar está configurada en Activado. Si esta opción se establece en Desactivado, el diseñador ya no diseña una aplicación de lienzo para una dimensión de pantalla específica.

  • Bloquear orientación

    • Si esta opción se establece en Activado, la configuración en Orientación está bloqueada. Por ejemplo, si una aplicación está en modo vertical y Bloquear orientación se establece en Activado, la aplicación de lienzo nunca permitirá que el usuario introduzca una orientación horizontal.

    • Si esta opción se establece en Desactivado, la aplicación móvil permitirá al usuario cambiar la aplicación entre horizontal y vertical moviendo la orientación del dispositivo móvil.

Diseños dinámicos

Cuando agrega una nueva pantalla a su aplicación, puede seleccionar varias opciones dinámicas en la pestaña Diseño, como Pantalla dividida, Barra lateral y Encabezado y pie de página. Estas tres opciones son diseños dinámicos por diseño y se adaptan a la plataforma como corresponda.

Si ninguna de estas opciones se adapta a su propósito comercial, puede crear su propio diseño dinámico utilizando contenedores, fórmulas y condiciones.

Consideraciones de control y diseño de formularios

Los botones deben ser fáciles de localizar y seleccionar para los usuarios. Piense en colocarlos en la parte superior o inferior de un formulario que abarque la aplicación de un extremo a otro. Si se trata de una acción, como una acción de eliminación, coloque el botón en el lado del registro donde los usuarios probablemente sostienen el dispositivo (mano derecha o mano izquierda).

Cuando incluya campos en un formulario, agregue suficiente espacio entre los campos y el borde del dispositivo para proporcionar un búfer para las selecciones táctiles de pantalla imprecisas. Es probable que los usuarios toquen en mitad de un campo de manera desigual, por lo que la experiencia no debería mover accidentalmente el foco a otro campo no intencional. Los búferes entre el borde de un campo y el borde del formulario ayudarán a los usuarios a evitar activar accidentalmente acciones de deslizamiento del dispositivo, como navegar de vuelta a un formulario anterior. Si existen campos obligatorios, intente priorizarlos como los primeros.

Las cuadrículas con datos deben abarcar de borde a borde en un formulario y solo desplazarse en una dirección: vertical u horizontalmente. Si se necesitan otros campos en un formulario, inclúyalos debajo del campo principal del registro, no en otras columnas a la derecha o izquierda del mismo. Cuando utilice varios formularios, intente que el desplazamiento sea una experiencia uniforme en toda la aplicación.

Contenedores

Los contenedores son una gran herramienta para ayudarle a organizar sus controles. Además, puede utilizarlos para distribuir automáticamente los controles que hay en ellos de forma horizontal o vertical.

Los controles Contenedor horizontal y Contenedor vertical utilizan una función de diseño automático, que determina automáticamente la posición (propiedades x e y) de los componentes secundarios insertados en ellos. Además, estos controles pueden distribuir el espacio disponible a sus componentes secundarios y determinar la alineación vertical y horizontal de los componentes secundarios.

Los contenedores de diseño automático son ideales cuando necesita que la interfaz de usuario responda al tamaño de la pantalla o a los cambios del factor de forma. También cuando desee que Power Apps maneje el apilamiento y el espaciado de sus componentes automáticamente dentro del espacio disponible.

Capacidades sin conexión

Cuando los usuarios ejecutan Power Apps Mobile, pueden almacenar ciertos datos sin conexión en sus dispositivos móviles. Cuando el dispositivo móvil se vuelve a conectar a Internet, Power Apps Mobile puede transmitir datos almacenados desde el dispositivo. Dos funciones de las que no hemos hablado son LoadData y SaveData, que simplemente guardan y recargan una colección desde el almacenamiento del dispositivo de la aplicación. Asimismo, la función ClearData elimina la colección de la memoria del dispositivo móvil.

Alertar a los usuarios sobre la falta de conectividad

Power Apps puede alertar a los usuarios cuando una aplicación está desconectada mediante la fórmula de señal Conexión. Puede utilizar un control Icono que cambia de color según la retroalimentación de la conexión. También puede utilizar la función Notificar para alertar a su usuario sobre la conectividad, o incluso cambiar el modo de visualización de ciertos controles según la conexión.

En resumen, existen varias herramientas disponibles para ayudarle a diseñar una aplicación optimizada para dispositivos móviles. Desde el momento en que crea su aplicación hasta el momento en que agrega los toques finales, tiene opciones para aprovechar al máximo su aplicación. El resumen del módulo incluye algunos vínculos a más información sobre cómo integrar este tipo de funciones en su aplicación.