Red de conocimiento informático - Computadora portátil - ¿Cómo diseña axure un prototipo de barra lateral para una aplicación móvil?

¿Cómo diseña axure un prototipo de barra lateral para una aplicación móvil?

1. Primero abrimos nuestro software axure, hacemos clic en Nuevo, luego arrastramos nuestro modelo de teléfono móvil a nuestro axure, hacemos clic en nuestro "Panel dinámico" y lo arrastramos a la ventana de edición. Como se muestra a continuación

2. Después de crear nuestro panel dinámico, mantenga presionado "ctrl c" para copiarlo, luego haga doble clic en state1 debajo de nuestro "panel dinámico externo" y luego mantenga presionado "ctrl v" ". Copie nuestro "Panel dinámico exterior"

3. Luego haga doble clic en state1 debajo de nuestro "Panel dinámico interior", luego haga clic en "Rectángulo" y arrastre su patrón a nuestro En el panel dinámico interior, ajuste la posición y Llénalo de color.

4. Arrastra un marcador de posición y ajusta su posición como se muestra en la imagen.

5. Luego haga clic en la "capa exterior" encima de nuestra barra de navegación y arrastre nuestro patrón de "capa interior" para moverlo una cierta distancia, como se muestra a continuación.

6. Luego haga clic en "Rectángulo" para medir la distancia entre nuestra "capa exterior" y "capa interior" para facilitar el movimiento de nuestra barra lateral. Como se muestra a continuación. Una vez que hayas medido la distancia, puedes eliminarla.

7. Haga clic en la "capa interna" de nuestra barra de navegación, luego seleccione el "marcador de posición" que acabamos de crear y luego haga clic en nuestra opción "al hacer clic con el mouse", como se muestra a continuación.

8. Después de ingresar "Al hacer clic con el mouse", haga clic en "Mover", marque "Capa interna" y luego ingrese la distancia que acabamos de medir en la "y" a continuación, es decir, " -134. "

9. Haga clic en la opción "Agregar condición" arriba, seleccione "Valor variable", "! =" "0" y luego haga clic en Aceptar.

10. Repita los pasos octavo y noveno nuevamente, cambie el valor "y" a "134", mantenga los demás sin cambios, luego haga clic en la opción "Agregar condición" arriba, seleccione "Valor variable", " ==""0" y haga clic en Aceptar.

11. Luego haga clic en nuestro "caso1" nuevamente, busque y haga clic en "Establecer valor de variable" a continuación, marque "Variable", luego establezca el valor de la variable en "0", haga clic en Aceptar, "caso2" también. repita esta acción, pero al configurar el valor de la variable, no lo establezca en 0.

12. Finalmente, podemos obtener una vista previa del efecto que hemos realizado. Mantenemos presionado F5 o hacemos clic en "Vista previa" arriba. Después de ingresar a la página web, podemos desplazar el mouse hacia arriba y hacia abajo para ver nuestro efecto. .