Programar una apk

Vamos a programar tu primer apk para Android

 

Aprenderás los controles básicos de programacion con bloques en App Inventor

¡Empezamos a programar!

Antes de nada, para este ejercicio necesitamos dos recursos que tenemos que
descargar en nuestro ordenador:

● gato.png
● miau.mp3

Podemos descargarlos del siguiente contenedor: http://evassmat.com/Ibl4 o también puedes probar acá, si el anterior falla: http://evassmat.com/21689785/archivos-miau

(Esperas 5 segundos y saltas la publicidad)

Seleccionamos el primer archivo y luego hacemos clic sobre la segunda opción de la parte de arriba de color naranja llamado "Download".
Se abrirá una pantalla mostrando el archivo.
Pulsaremos entonces sobre el botón Descargar y hacemos lo mismo con el segundo archivo.

Incluir un botón en la pantalla

En la parte izquierda hacemos clic en el tipo de objeto Botón, y sin soltar arrastramos
hasta el visor. Si todo funciona bien se verá en el visor, y también en la pantalla del
móvil, o del emulador.

Un botón es un objeto sobre el que podemos hacer clic, y puede tener diferentes
aspectos.

Para que el botón tenga la imagen del gato hacemos clic en el botón, y en la parte
derecha de App Inventor, en Propiedades, y bajo la propiedad Imagen, hacemos clic en
Ninguno…
Elegimos la opción Subir archivo…, y después Seleccionar archivo

Elegimos el archivo del gato en nuestro disco duro y pulsamos Aceptar para subirlo a la
página de nuestro proyecto en App Inventor. Se verá el gato como imagen del botón,
que ahora será más grande.

Para quitar el texto “Texto para el Botón1” que aparece por debajo del gato hay que
borrar el valor de una propiedad Texto del botón, en la parte derecha de la ventana.

Si no vemos la cara del gato entera en la pantalla del dispositivo deberemos cambiar
los valores de las propiedades Ancho y Alto del botón por “Ajustar al contenedor”,
para que se ajusten al tamaño máximo disponible en la pantalla del dispositivo.

Para incluir una etiqueta debajo del gato que ponga “Hola, soy Kitty” arrastramos un
componente Etiqueta hasta el visor, y la soltamos debajo del gato.

Investiguemos ahora para descubrir cómo cambiar el texto “Texto para Etiqueta1” por
“Hola, soy Kitty”. Una pista: hay que seleccionar la etiqueta en el visor, y luego cambiar
sus propiedades en la parte derecha de la ventana de trabajo de App Inventor.

Añadir un sonido

Ahora añadiremos un sonido a nuestra aplicación, arrastrando hasta el visor el icono
Sonido, que está dentro del grupo Medios, en la Paleta. Ojo, este objeto no se verá en
el móvil o en el emulador, porque no es una imagen, ni un botón, ni una etiqueta. Por
eso aparece debajo del visor, en el apartado Componentes no visibles.

Investiguemos ahora de nuevo para saber cómo asociar a este objeto que hemos
creado el sonido “Miau.pm3” que hemos descargado. De nuevo hay que usar el panel
de propiedades para este componente. No es difícil, haremos clic sobre el valor de la
propiedad Origen del componente Sonido1 y subiremos el archivo descargado.

Con esto hemos terminado de diseñar el aspecto de nuestra aplicación Ahora viene la
magia, tenemos que programar cómo se comportará la aplicación. ¡Eso es programar!

Hacemos clic en el botón Bloques situado en la esquina superior derecha.

Esto abre la ventana de programación con bloques. La parte más amplia, ahora en
blanco, es el Editor, donde colocaremos los bloques de nuestros programas.

Vamos a hacer que suene el sonido del gato cada vez que hagamos clic sobre la imagen
del gato (botón).

Hacemos clic en Botón para que se muestren los bloques de colores disponibles para
escribir nuestro código, el programa. Se abre un “cajón de herramientas” con todos los
bloques que podemos utilizar. Arrastramos hasta el editor el que dice Botón1.Clic.

Los bloques color mostaza son los manejadores o gestores de sucesos. Indican qué hay
que hacer cuando sucede algo en la aplicación. En este caso, el manejador nos
permitirá decirle al ordenador qué debe hacer cuando hagamos clic sobre el gato.

Ahora hacemos clic sobre nuestro componente Sonido1 para abrir su cajón. Entonces
arrastramos la instrucción Llamar.Sonido1.Reproducir hasta “encajarla” dentro del
manejador que hemos creado para el botón.

¡Enhorabuena por la primera aplicación!

Ya podemos probarla en el móvil, pero la perderemos si cerramos la aplicación AI2 que
nos conecta con el ordenador. Para instalarla en el móvil permanentemente, como
cualquier otra aplicación, podemos generar un código QR.

Para ello hacemos clic en Generar y elegimos la opción App (generar código QR para el
archivo.apk).

Esto tomará un poco de tiempo, después del cuál aparecerá un código QR que
podremos capturar en nuestro móvil. La aplicación quedará descargada entonces en
nuestro teléfono/Tablet, para ejecutarla siempre que queramos.