APP Inventor

Bloque 1

En esta sección cada ejercicio consta de los siguientes recursos:

ÍNDICE DE EJERCICIOS

PULSA SOBRE EL EJERCICIO QUE QUIERAS VER

EJERCICIO 1: Cara de gato con sonido

APP INVENTOR BÁSICO

En este ejercicio se mostrará la imagen de un gato en la pantalla del móvil y al pulsar sobre ella, éste emitirá el sonido del maullido de un gato, acompañado de una vibración del móvil

Apartados del vídeo

👉0:00 Introducción 

👉0:37 1y2.- Comienzo del proyecto 

👉1:15 3.- Configurar la pantalla de inicio 

👉2:30 4.- Colocar botón en la pantalla 

👉2:51 5.- Modificar propiedades del botón insertado 

👉4:06 6.- Insertar un sonido 

👉5:18 7.- Insertar acelerómetro 

👉5:48 8.- Seleccionar botón bloques y acceder a programación 

👉6:06 9.- Hacer que el móvil suene y vibre al pulsar botón 

👉7:40 10.- Hacer que móvil suene y vibre al moverlo 

👉8:13 Créditos finales 

deo explicativo

EJERCICIO 2: Sonido de animales

APP INVENTOR BÁSICO

En este ejercicio se mostrarán doce imágenes de doce animales distintos. Al pulsar en cada una de las imágenes se emitirá el sonido del animal correspondiente.

Apartados del vídeo

👉0:00 Introducción 

👉0:58 1.- Comienzo de nuevo proyecto 

👉1:28 2.- Modificar propiedades de ventana "Screen1" 

👉3:00 3.- Insertar nueva etiqueta con nombre de autor 

👉3:41 4.- Colocar disposición tabular 

👉4:18 5.- Insertar 12 botones en disposición tabular 

👉6:30 6.- Agregar 12 sonidos 

👉8:30 7.- Colocar botón salir 

👉9:44 8.- Seleccionar botón Bloques 

👉10:02 9.- Asignar a cada borón el sonido correspondiente 

👉11:19 10.- Programar el botón cerrar 

👉12:00 Créditos finales 

deo explicativo

EJERCICIO DE REFUERZO

Realiza una aplicación similar a la descrita anterioemente en la que se muestren 9 botones que reproducirán 9 sonidos de algún tema (instrumentos mucicales, sonidos de naturaleza....)

Cada botón tendrá una imagen relacionada con el sonido que se reproduce

El nombre de la aplicación dependerá de los sonidos que se vayan a reproducir

Se mostrará el nombre del autor y se colocará un icono para la aplicación

Se pondrá un botón que permita salir de la aplicación

EJERCICIO 3: Monumentos de Sevilla

APP INVENTOR BÁSICO

En este ejercicio se mostrará una pantalla inicial con una imagen de Sevilla y cuatros botones. Tres de los botones abrirán tres pantallas distintas de tres de los monumentos de Sevilla. En cada una de esas pantallas se visualizará una imagen del monumento, una pequeña descripción, y dos botones, desde los que se accederá a la wikipedia del monumento y se podrá escuchar un audio sobre el mismo.

Cada pantalla dispondrá de un botón cerrar, para poder acceder a la pantalla principal, mientras que la pantalla principal tendrá un botón salir, que saldrá de la aplicación.

Apartados del vídeo

👉0:00 Introducción 

👉1:24 1.- Comienzo del proyecto "MonumentoSevilla" 

👉1:47 2.- Modificar propiedades de ventana "Screen1" 

👉3:12 3.- Colocar etiqueta 

👉4:12 4.- Colocar imagen 

👉4:55 5.- Insertar un primer botón 

👉5:42 6.- Insertar un segundo botón 

👉6:28 7.- Insertar un tercer botón 

👉7:10 8.- Insertar un cuarto botón 

👉8:01 9.- Insertar etiqueta con nombre autor 

👉8:40 10.- Añadir tres ventanas 

👉9:39 11.- Modificar propiedades de las ventanas 

👉10:35 12.- Incluir etiqueta en cada ventana 

👉11:28 13.- Agregar una imagen en cada ventana 

👉12:07 14.- Agregar una segunda etiqueta en cada ventana 

👉13:10 15.- Insertar un primer botón en cada ventana 

👉14:09 16.- Insertar un segundo botón en cada ventana 

👉14:48 17.- Insertar un tercer botón en cada ventana 

👉15:45 18.- Inserar el elemento reproductor en cada ventana 

👉16:45 19.- Insertar el elmento ActivityStarter en cada ventana 

👉18:45 Créditos finales 

deo explicativo - diseño

1ª parte

Apartados del vídeo

👉0:00 Introducción 

👉0:20 1.- Acceso a la sección bloques 

👉0:35 2.- Código de BtnGiralda 

👉1:37 3.- Repetición apartado 2 

👉2:35 4.- Código del BtnSalir 

👉3:03 5.- Seleccionar ventana VGiralda 

👉3:15 6.- Asignar código al botón "Escuchar audio" 

👉3:52 7.- Asignar código al botón "Wikipedia" 

👉6:12 8.- Asignar código al botón "Volver" 

👉7:25 9y10.- Repetir pasos 6, 7 y 8 en otras dos ventanas 

👉8:01 Créditos finales 

Vídeo explicativo - bloques

2ª parte

EJERCICIO 4: Háblame

APP INVENTOR BÁSICO

En este ejercicio se va a realizar una aplicación que hable y que reproduzca el texto que previamente se ha escrito.

El resultado final va a tener un cuadro de texto donde podamos escribir el texto que diga el móvil y un botón, que al pulsarlo nos diga lo que se ha escrito.

Además, se va a incluir la posibilidad de que el texto lo pronuncie con un acento determinado de entre los siguientes: español, alemán, francés, inglés e italiano.

Por último, si movemos el dispositivo, este nos hablará y nos dirá algo como "deja de moverme".

Apartados del vídeo

👉0:00 Introducción 

👉1:19 1.- Comienzo dle proyecto "Habla" 

👉1:38 2.- Modificar propiedades de ventana "Screen1" 

👉2:43 3.- Insertar etiqueta con nombre de autor 

👉3:03 4.- Colocar disposición vertical 

👉3:38 5.- Insertar botón en la disposición vertical 

👉4:24 6.- Insertar segundo botón 

👉5:05 7.- Insertar campo de texto en la disposición vertical 

👉5:41 8.- Insertar una disposición horizontal 

👉6:19 9.- Insertar una etiqueta en la disposición horizontal 

👉7:09 10.- Insertar una etiqueta en la disposición horizontal 

👉7:49 11.- Insertar etiqueta bajo la disposición horizontal 

👉8:34 12.- Insertar disposición tabular 

👉8:53 13.- Insertar cuatro botones en la disposición tabular 

👉10:56 14.- Insertar disposición vertical 

👉11:27 15.- Insertar botón dentro de disposición vertical 

👉12:04 16.- Insertar botón bajo la disposición vertical 

👉12:56 17.- Insertar el componente "TextoAVoz" 

👉13:12 18.- Insertar componente "Acelerómetro" 

👉13:33 Créditos finales 

deo explicativo - diseño

1ª parte

Apartados del vídeo

👉0:00 Introducción 

👉0:24 1.- Acceder a la sección bloques 

👉0:37 2.- Código del botón BtnHablame 

👉1:08 3.- Código del condicional BtnHablame 

👉3:06 4.- Código para el boton BtnLimpiar 

👉3:50 5.- Código para el botón BtnEspanol 

👉5:18 6.- Código para el botón BtnAleman 

👉5:43 7.- Código para el botón BtnFrances 

👉6:00 8.- Código para el botón BtnIngles 

👉6:18 9.- Código para el botón BtnItaliano 

👉5:43 10.- Código para el botón BtnSalir 

👉6:00 11.- Código para decir "No me muevas por favor" 

👉6:18 Créditos finales 

Vídeo explicativo - bloques

2ª parte

EJERCICIO 5: Calculadora

APP INVENTOR BÁSICO

En este ejercicio se va a realizar una aplicación que hable y que reproduzca el texto que previamente se ha escrito.

El resultado final va a tener un cuadro de texto donde podamos escribir el texto que diga el móvil y un botón, que al pulsarlo nos diga lo que se ha escrito.

Además, se va a incluir la posibilidad de que el texto lo pronuncie con un acento determinado de entre los siguientes: español, alemán, francés, inglés e italiano.

Por último, si movemos el dispositivo, este nos hablará y nos dirá algo como "deja de moverme".

Apartados del vídeo

👉0:00 Introducción 

👉1:21 1.-Comienzo del proyecto 

👉1:41 2.- Modificar propiedades de la ventana Screen 

👉2:44 3.- Colocar etiqueta con nombre autor 

👉3:14 4.- Colocar una disposición horizontal 

👉3:29 5.- Colocar etiqueta en disposición horizontal 

👉3:55 6.- Colocar campo de texto en disposición horizontal 

👉4:51 7.- Colocar una segunda disposición horizontal 

👉5:05 8.- Colocar etiqueta en disposición horizontal 

👉5:37 9.- Colocar campo de texto en disposición horizontal 

👉6:27 10.- Colocar una tercera disposición horizontal 

👉6:53 11.- Insertar cuatro botones en la disposición horizontal 

👉9:31 12.- Insertar una etiqueta bajo la disposición horizontal 

👉9:57 13.- Insertar un campo de texto bajo la etiqueta 

👉10:52 14.- Colocar disposición horizontal bajo el campo anterior 

👉11:10 15.- Insertar botón en la disposición horizontal 

👉12:01 16.- Insertar segundo botón en disposición horizontal 

👉13:04 17.- Insertar botón bajo al disposición horizontal 

👉13:42 18.- Insertar etiqueta 

👉14:30 19.- Insertar elemento "TextoAVoz" 

👉14:47 Créditos finales 

deo explicativo - diseño

1ª parte

Apartados del vídeo

👉0:00 Introducción 

👉0:18 1.- Acceder a sección bloques 

👉0:29 2.- Código de BtnSuma 

👉0:49 3.- Código para el condicional del botón BtnSuma 

👉3:52 4.1.- Código botón BtnResta 

👉4:38 4.2.- Código botón BtnMultiplica 

👉5:21 4.3.- Código botón BtnDivide 

👉5:55 5.- Código BtnRdoHablado 

👉6:13 6.- Código para condicional del BtnRdoHablame 

👉9:04 7.- Modificación del condicional 

👉9:31 8.- Incluir código en primer "si no, si entonces" 

👉10:20 9.- Incluir código en segundo "si no, si entonces" 

👉11:09 10.- Incluir código en tercer "si no, si entonces" 

👉11:56 11.- Código para el botón BtnLimpiar 

👉13:02 12.- Código para el botón BtnSalir 

👉13:39 Créditos finales 

Vídeo explicativo - bloques

2ª parte

EJERCICIO 6: Traductor Multilenguaje

APP INVENTOR BÁSICO

En este ejercicio se va a realizar una aplicación en la que se introduce un texto hablado. 

El móvil reconocerá el texto y lo traducirá al idioma que se seleccione, escribiéndolo y hablándolo.

Apartados del vídeo

👉0:00 Introducción 

👉1:08 1.- Comienzo del nuevo proyecto Traductor 

👉1:31 2.- Modificación de las propiedades de la ventana "Screen1" 

👉2:26 3.- Colocar una etiqueta en la parte superior con el nombre del autor 

👉3:14 4.- Colocar una disposición vertical 

👉3:46 5.- Colocar una etiqueta dentro de la disposición vertical 

👉4:20 6.- Colocar un botón dentro de la disposición vertical 

👉5:11 7.- Colocar una etiqueta debajo de la disposición vertical 

👉5:50 8.- Colocar disposición tabular 

👉6:11 9.- Insertar cuatro botones en la disposición tabular 

👉8:57 10.- Insertar etiqueta debajo de la disposición tabular 

👉9:37 11.- Insertar componente "TextoAVoz" 

👉9:52 12.- Insertar componente "TraductorYandex" 

👉10:05 13.- Insertar componente "ReconocimientoDeVoz" 

👉10:21 Créditos finales 

deo explicativo - diseño

1ª parte

Apartados del vídeo

👉0:00 Introducción 

👉0:21 1.- Acceder a la sección bloques 

👉0:30 2.- Código para botón BtnHablar 

👉0:57 3.- Código para ReconocimientodeVoz1 

👉1:42 4.- Código de BtnEspana 

👉3:28 5.1.- Código de BtnFrancia 

👉4:07 5.2.- Código de BtnItalia 

👉4:37 5.3.- Código de BtnReinoUnido 

👉5:06 6.- Código TraductorYandex1 

👉6:42 Créditos finales 

Vídeo explicativo - bloques

2ª parte

EJERCICIO 7: Mi Paint

APP INVENTOR BÁSICO

En este ejercicio se mostrará un lienzo donde se podrá pintar, pudiendo seleccionar entre varios colores, además del grosor del pincel

Se escribirán puntos si hacemos un tic sobre el lienzo

El dibujo realizado se podrá guardar

Apartados del vídeo

👉0:00 Introducción 

👉1:34 1.- Comenzar proyecto MiPaint 

👉1:59 2.- Modificar propiedades de la ventana "Screen1" 

👉2:37 3.- Colocar una etiqueta en la parte superior con nombre autor 

👉3:14 4.- Colocar una disposición horizontal 

👉3:40 5.- Insertar cinco botones en la disposición horizontal 

👉5:58 6.- Insertar otra disposición horizontal 

👉6:23 7.- Insertar un deslizador 

👉6:59 8.- Insertar un lienzo 

👉7:31 9.- Insertar una disposición horizontal 

👉8:07 10.- Insertar un botón en la disposición horizontal anterior 

👉8:41 11.- Insertar un segundo botón 

👉9:08 12.- Insertar un tercer botón 

👉9:43 13.- Insertar una etiqueta junto al botón salir 

👉10:17 Créditos finales 

deo explicativo - diseño

1ª parte

Apartados del vídeo

👉0:00 Introducción 

👉0:20 1.- Acceder a sección bloques 

👉0:26 2.- Código de BtnNegro 

👉1:13 3.- Repetir código de BtnNegro para resto botones 

👉2:18 4.- Código para pintar círculo 

👉3:31 5.- Código para pintar al deslizar dedo 

👉4:36 6.- Código del deslizador 

👉5:40 7.- Código para BtnLimpiar 

👉6:20 8.- Código para BtnGuardar 

👉7:11 9.- Código para BtnSalir 

👉7:43 Créditos finales 

Vídeo explicativo - bloques

2ª parte

EJERCICIO 8: Pong

APP INVENTOR BÁSICO

Vamos a desarrollar el juego del pong, donde se va a disponer de una barra que vamos a poder desplazar de forma horizontal sobre la pantalla.

Una pelota irá rebotando en los bordes y deberemos evitar que dicha pelota caiga bajo la barra que nosotros movemos.

Cada vez que la barra toque la bola se acumulará un punto en el marcador.

El juego finalizará cuando la pelota sobrepase la barra que movemos.

Apartados del vídeo

👉0:00 Introducción 

👉1:03 1.- Comenzar el proyecto Pong 

👉1:20 2.- Modificar las propiedades de "Screen1" 

👉2:08 3.- Insertar un lienzo 

👉2:47 4.- Insertar una pelota en el lienzo 

👉3:29 5.- Insertar una "SpriteImagen" 

👉4:23 6.- Colocar una etiqueta 

👉5:18 7.- Colocar una casilla de verificación 

👉6:01 8.- Insertar una disposición horizontal 

👉6:27 9.- Colocar un botón dentro de la disposición horizontal 

👉7:23 10.- Colocar un segundo botón 

👉8:01 11.- Insertar una etiqueta 

👉8:43 12.- Insertar el elemento Sonido 

👉9:00 13.- Subir los elementos a usar en los bloques 

👉9:43 14.- Insertar una etiqueta con el nombre 

👉10:09 Créditos finales 

deo explicativo - diseño

1ª parte

Apartados del vídeo

👉0:00 Introducción 

👉0:20 1.- Acceder a la sección de bloques 

👉0:30 2.- Inicializar variable "puntos" a 0 

👉0:51 3.- Crear función "CambiarYMostrarPuntos" 

👉2:54 4.- Código para botón "BtnComenzar" 

👉6:56 5.- Código para "Barra" 

👉8:00 6.- Código para "BtnReset" 

👉9:36 7.- Crear función "TocaSonido" 

👉11:19 8.- Código para cuando la bola toca un borde 

👉14:26 9.- Código para cuando la bola toca la barra 

👉16:54 Créditos finales 

Vídeo explicativo - bloques

2ª parte

EJERCICIOS 9: Topo golpeado

APP INVENTOR BÁSICO

Vamos a desarrollar el juego llamado Topo Golpeado.

En este juego se mostrará un topo que se moverá aleatoriamente por la pantalla y durante 10 segundos deberemos “golpearlo” el máximo número de veces.

Visualizaremos el número de aciertos (número de veces que golpeamos al topo) y el número de errores (número de veces que fallamos), así como una cuenta atrás de 10 segundos.

Finalizados los 10 segundos, se mostrará un botón “restablecer” que permitirá comenzar de nuevo el juego.

Apartados del vídeo

👉0:00 Introducción 

👉1:07 1.- Comenzar proyecto "TpoGolpeado" 

👉1:20 2.- Modificar las propiedades de "Screen1" 

👉2:55 3.- Insertar un lienzo 

👉3:55 4.- Insertar un SpriteImagen 

👉4:47 5.- Insertar una disposición horizontal 

👉5:28 6.- Insertar una etiqueta dentro de la disposición horizontal 

👉6:25 7.- Insertar una segunda etiqueta 

👉7:23 8.- Insertar una segunda disposición horizontal 

👉8:02 9.- Insertar una etiqueta dentro de la disposición horizontal 

👉8:49 10.- Insertar una segunda etiqueta 

👉9:24 11.- Insertar una tercera disposición horizontal 

👉10:04 12.- Insertar una etiqueta 

👉10:45 13.- Insertar un botón 

👉11:39 14.- Insertar el elemento reloj 

👉11:53 15.- Insertar el elemento sonido 

👉12:10 Créditos finales 

deo explicativo - diseño

1ª parte

Apartados del vídeo

👉0:00 Introducción 

👉0:23 1.- Acceder a la sección bloques 

👉0:39 2.- Crear la función "MoverTopo" 

👉2:32 3.- Crear la funión "comenzar" 

👉4:46 4.- Llamada a la función "comenzar" 

👉5:07 5.- Mover el topo mientras el tiempo no sea 0 

👉7:45 6.- Código al tocar el lienzo 

👉11:27 7.- Código de BtnRestablecer 

👉11:53 8.- Código al tocar el topo 

👉12:53 Créditos finales 

Vídeo explicativo - bloques

2ª parte

EJERCICIOS 10: Presidentes de los EE.UU

APP INVENTOR BÁSICO

En la siguiente aplicación se van a ir mostrando fotos de distintos presidentes de los Estados Unidos y se deberá seleccionar el nombre de cada uno de ellos en una lista.

Si el nombre seleccionado es correcto, se indicará mostrando un texto junto con un sonido de aplausos, por otro lado, si el nombre seleccionado no es el que corresponde con la foto, se mostrará un texto indicando que es erróneo y se reproducirá un sonido de error.

Apartados del vídeo

👉0:00 Introducción 

👉1:13 1.- Comenzar un proyecto llamado "PresidentesEEUU" 

👉1:32 2.- Modificar las propiedades de "Screen1" 

👉2:42 3.- Subir las imágenes de los distintos presidentes 

👉3:55 4.- Colocar una etiqueta con nombre autor 

👉4:44 5.- Insertar disposición horizontal 

👉5:20 6.- Insertar imagen dentro de contenedor 

👉5:57 7.- Colocar disposición vertical 

👉6:28 8.- Colocar etiqueta 

👉7:20 9.- Insertar un "Selector de lista" 

👉8:18 10.- Colocar un botón bajo el Selector de lista 

👉9:05 11.- Colocar otro botón 

👉9:58 12.- Insertar un elemento Sonido 

👉10:18 Créditos finales 

deo explicativo - diseño

1ª parte

Apartados del vídeo

👉0:00 introducción 

👉0:23 1.- Acceder a la sección de bloques 

👉0:35 2.- Inicializar una variable "PreguntaActual" 

👉1:02 3.- Inicializar una variable "RespuestasCorrectas" 

👉2:23 4.- Inicializar variable "TodasLasPreguntas" 

👉4:48 5.- Acciones al inicializar la aplicación 

👉6:12 6.- Eventos antes de seleccionar el "SelectorDeLista1" 

👉7:41 7.- Código para controlar respuesta correcta 

👉11:16 8.- Código de botón BtnSiguiente 

👉15:17 9.- Código botón BtnSalir 

👉15:58 Créditos finales 

Vídeo explicativo - bloques

2ª parte