EJERCICIO 3 – Darth Vader
Para realizar esta práctica, vas a tener que seguir los pasos que se muestran a continuación
Paso 1: dirígete a la barra de herramientas y en la pestaña Proyectos escoge la opción Comenzar un proyecto nuevo.
Paso 2: aparecerá una pantalla en la que has de introducir el nombre que va a tener la App.
Vamos a descargar de la carpeta de material la imagen de Darth Vader para nuestra aplicación, será la portada cada vez que abramos nuestro ejercicio se verá así:
Lo primero de todo es colocar dentro de nuestro Screen la imagen en la parte superior. Seleccionamos el elemento imagen y lo arrastramos a la pantalla del móvil aquí representado.
Para agregar nuestra imagen a la pantalla deberemos irnos al menú medios y clicar en subir el archivo Fondo.jpg que tenemos en la carpeta de material del curso. Una vez hecho se nos visualizará el Darth Vader. Para que tenga el tamaño correcto le damos estos parámetros:
Seguidamente pondremos los botones de nuestra app debajo de esta dentro de una disposición horizontal, es decir en un contenedor que permita colocar dos botones en paralelo
Para ello desde la pestaña Disposición arrastramos la opción Disposición Horizontal hacía la parte baja de la imagen ya colocada:
Arrastramos desde la pestaña Interfaz de usuario el elemento Botón dentro de nuestra disposición horizontal y seguidamente otro botón que vaya justo al lado.
A la hora de colocar ambos botones tenemos que posicionarnos con el ratón encima del contenedor y esperar a que aparezca una arista azul en vertical la cual nos indica donde queremos que estén nuestros dos botones
Estos son los parámetros de los botones:
El cual será DarthVaderefectovoz.mp3 que estará dentro de la carpeta material del curso.
Por ultimo, en la vista diseno haremos que el screen tenga estos parametros para que el diseno sea el mas acorde a la naturaleza de Darth Vader
Una vez diseñada la parte visual vamos a trabajar la programación de nuestra app para ello nos vamos a la opción bloques y desde ahí vamos a trabajar el comportamiento de los botones Respira y Salir
Clicamos encima del botón respira y añadimos el primer condicional que vemos Cuando Respira Clic>Ejecutar>Llamar VozDarthVader
Es decir, cuando cliquemos encima del botón Respira haremos que llame a la variable voz o sonido que ya tenemos implementado en el visor Diseño.
La primera línea de código o bloque viene a decir que cuando clicamos en el botón respira ejecuta la acción de reproducir el sonido que tenemos en nuestra app.
Para que no esté reproduciendo en bucle, vamos a escribir esta línea de código la cual nos permitirá que cuando cliquemos en el botón salir o Finalizar parara nuestra grabación:
Para añadir el componente cerrar aplicación, debemos irnos a los componentes genéricos>Control>Cerrar aplicación
Finalizamos guardando el proyecto en nuestra carpeta de proyectos. De esta manera lo tendremos ya acabado y podremos volver a él siempre que queramos si hay que modificar cualquier elemento.