EJERCICIO 12 – Multiventana
Vamos a aprender a crear una App con más de una ventana. Para ello deberás agregar más ventanas de navegación y botones para ir abriendo y cerrándolas.
Lo primero que debemos hacer, como en todas las App, es dirigirnos a la pestaña Proyectos, y crear uno nuevo.
Seguidamente le damos un nombre a la App tal y como ves en las imágenes.
Ahora, como en la gran mayoría de aplicaciones, vamos a agregar una capa de distribución para los objetos que se añadirán a continuación. En este caso se va a seleccionar una capa DisposiciónHorizontal tal y como vemos en las imágenes.
Modificamos las propiedades de la capa agregada, de manera que el contenido quede centrado y el ancho de la capa se ajuste al tamaño máximo de la pantalla.
A continuación, vamos a agregar tres botones que encargarán de llevarnos a la ventana deseada cuando haces clic encima.
Seguidamente vamos a modificar el nombre de los botones dentro de la lista de componentes.
Ahora vamos a modificar el texto que muestran los botones por pantalla mediante las propiedades de los componentes tal y como se muestra en la imagen.
Añadimos más ventanas para navegar por nuestra App.
Tal y como se ve en la imagen, hacemos clic en el botón y añadimos dos ventanas más, aparte de la que se crea al iniciar un proyecto.
Una vez tienes todas las ventanas creadas, vamos a agregar un botón para ir hacia atrás en la App.
Este botón lo pondremos en las ventanas 2 y 3, ya que la primera tendrá los tres botones agregados antes siendo el menú principal de la App.
Tal y como ves en la imagen deberás renombrar el botón de cada ventana y ya estará preparada la App para ser programada
Ahora nos vamos al visor de bloques y comenzamos con la programación de los objetos. En primer lugar, nos situamos en la primera ventana Screen1 y le decimos a los botones que reaccionen cuando hagamos clic encima de ellos.
Recuerda que los nombres que ves en las imágenes son los nombres que le hemos dado a los botones que van a abrir la ventana escogida
Ahora al hacer clic en cualquiera de estos tres botones, vamos a indicar que debe abrir la ventana deseada, y para ello vamos a seleccionar el conjunto de bloques Control y vamos a arrastrar dentro de los tres bloques anteriores, el bloque llamado “abrir otra pantalla Nombre de la pantalla”.
Añade un bloque de texto, con el nombre de la ventana que se desea abrir con cada botón.
Por último, vamos a repetir este mismo proceso en las ventanas 2 y 3 con el botón que hace retroceder hacia la ventana1 (botón de retroceso).
Después guardaremos nuestro proyecto y lo exportaremos a nuestro ordenador.