Nro.

DD-106
Programación Móvil para Redes
Página 1 de 9

Programación Móvil para Redes

LABORATORIO N° 06

Uso de animaciones con App Inventor

CODIGO DEL CURSO: II3401

Alumno(s): Gomez Villanueva, Darío Gabriel Nota

Grupo: B Ciclo: III

Excelente Requiere No acept.
Criterio de Evaluación Bueno (3pts) Regular (2pts)
(4pts) mejora (1pts) (0pts)

Cumple con la Cumple con Cumple con muy No cumple

Cumple con todo
mayoria de lo algo de lo poco de lo con nada de
lo requerido por
requerido por el requerido por el requerido por el lo requerido
el criterio
criterio criterio criterio por el criterio
Reconoce el uso de
componentes de animación
Reconoce el uso de bloques
para componentes de
animación
Realiza los ejercicios
propuestos
Realiza observaciones y
conclusiones que aporten un
opinión crítica y técnica
Muestra orden y respeto en el
laboratorio y redacta el informe
ordenamente, sin copias de
otros autores
 Nro. DD-106
Programación Móvil para Redes
Página 2 de 9

I.- OBJETIVOS:
• Uso de eventos y propiedades del grupo de “Dibujo y Animación”
• Uso de condicionales y variables
• Uso de Animaciones

II.- SEGURIDAD:
Advertencia:
En este laboratorio está prohibida la manipulación del
hardware, conexiones eléctricas o de red; así como la
ingestión de alimentos o bebidas.

III.- FUNDAMENTO TEÓRICO:

• Revisar el texto guía que está en el campus Virtual.

• Revisar informacion proporcionada en canvas

IV.- NORMAS EMPLEADAS:

• No aplica

V.- RECURSOS:

• En este laboratorio cada alumno trabajará con un equipo con sistema operativo
Windows.
• Para el uso de la plataforma de desarrollo App Inventor debe poseer conexión a
internet

VI.- METODOLOGÍA PARA EL DESARROLLO DE LA TAREA:

• El desarrollo del laboratorio es individual.

VII.- PROCEDIMIENTO:

Nota:
Las secciones en cursivas son demostrativas, pero sirven para que usted pueda instalar las
herramientas de desarrollo en un equipo externo.

CONSIDERACIONES

1. Se usara el software de desarrollo App Inventor 2

 Nro. DD-106
Programación Móvil para Redes
Página 3 de 9

1. DISPOSICIÓN DE ELEMENTOS

1.1 Cree un nuevo proyecto en App Inventor denominado : usoAnimaciones

1.2 Abra el proyecto creado
1.3 De diseñara un pequeño juego que utilice los metodos del grupo “Dibujo y
Animación”, esto nos permitira conocer como trabajan los metodos y propiedades
de los objetos. Se debe poder controlar movimientos, colisiones de objetos, etc.

1.4 Diseñe la siguiente interfaz mostrada siguiendo la vista de componentes mostrada

1.5 Solo se muestra la configuración de los elementos a utlizar, los demas compenentes
configure a su criterio para que quede como muestra la imagen de arriba

Objeto Propiedad
Screen1 OrientacionDeLaPantalla: horizontal
Etiqueta 1 Nombre Variable: txtVidas
Boton 1 Nombre Variable: btnJugar
SpriteImagen1 Nombre Variable: sprAvion
Pelota 1 Direccion: 0
Pelota 2 Intervalo: 0
Pelota 3 Velocidad: 0
Notificador 1 colorDeFondo: rojo
ColorDeTexto: blanco
SensorDeOrientacion 1 Dejar todo por defecto
 Nro. DD-106
Programación Móvil para Redes
Página 4 de 9

2. CREACIÓN DE LOGICA DE PROGRAMACIÓN

2.1 Se crearan 3 variables para almacenar las vidas que tenga el jugador y las posiciones
X y Y donde apareceran las balas que buscan colisionar con el objeto avion.

2.2 Se va a crear metodos para inicializar cada bala(pelota) en una posicion y color
aleatorio
 Nro. DD-106
Programación Móvil para Redes
Página 5 de 9

2.3 Crearemos un metodo que una los 3 metodos(colocarBala) creados

2.4 Ahora vamos a crear metodos para inicializar el movimiento, direccion y velocidad
con que se movera cada bala(pelota)

2.5 Crearemos un metodo que una los 3 metodos(iniciarBala) creados. Este metodo
permitira que las balas(pelotas) empiezen a moverse en una direccion y velocidad
aleatoria
 Nro. DD-106
Programación Móvil para Redes
Página 6 de 9

2.6 Ahora vamos a configurar las acciones a realizar cuando la aplicación se carge por
primera vez. En esta carga se colocaran las balas en una posicion aleatoria(funcion
colocarBalas), el numero de vidas, que se muestre en posicion horizontal el
dispositivo y el tamaño de las balas(pelotas)

2.7 Vamos a programar el boton btnJugar para que inicialize el movimiento de las
balas(pelotas)

2.8 Ejecute el aplicativo y comente los detalles de la funcionalidad hasta aquí programada

El presionar el botón de jugar este ya no se puede presionar de nuevo esto

se debe al bloque de boton.habilitado como falso.
Las pelotas se posición en un lugar aleatorio en el ancho, pero siempre al
final de la pantalla

2.9 Vamos a programar ahora el movimiento del objeto avión. Esto lo realizaremos para
que se mueva de acuerdo a lo que detecte el sensor de movimiento del celular (tanto
si es hacia la derecha o izquierda)
 Nro. DD-106
Programación Móvil para Redes
Página 7 de 9

2.10 Ejecute el aplicativo y verifique el funcionamiento implementado. Comente los

detalles más importantes

Utilizamos para mover el avión dentro del ancho del lienzo el cual nos permite evitar
chocar con las balas este desplazamiento se calcula sumando la posición actual
del avión con la sensor de movimiento multiplicado por menos1.

2.11 Ahora vamos a programar para que una vez que la bala(pelota) impacte con borde
superior del objeto Lienzo, vuelva a aparecer desde abajo; así como permitir que, si
impacta con los bordes izquierdo y derecho del Lienzo, rebote la bala(pelota)

2.12 Ejecute y verifique el funcionamiento. Comente los detalles mas importantes

Las balas al chocar en los bordes rebotan, pero al chocar en el borde superior se
ubica de nuevo en la parte de abajo y es lanzada nuevamente
 Nro. DD-106
Programación Móvil para Redes
Página 8 de 9

2.13 Ahora vamos a controlar las colisiones; cuando una bala(pelota) impacte con el
avión; para esto debemos detener el movimiento de las balas(pelotas). Crearemos
un método que haga este proceso

2.14 Ahora procedemos a controlar la colisión

 Nro. DD-106
Programación Móvil para Redes
Página 9 de 9

2.15 Ejecute el aplicativo y pruebe la funcionalidad.

2.16 Comente que es lo que realiza el código anterior implementado

Creamos un procedimiento el cual detiene todas las balas

Seguido manejamos la colisión el cual ira restando una vid, mostrando una alerta
de TEDIERON hasta que sea cero en este caso se llamara al notificador para que
cierre el juego o continúe con otro intento.
El notificador tendrá un condicional que al escoger Salir se cerrará la aplicación

3. EJERCICICOS PROPUESTOS
a. Utilizando el grupo de “Dibujo y Animación” cree un juego que le permita utilizar los
objetos de este grupo, asi como sus metodos y propiedades.
b. El juego debe ser funcional como el realizado en el laboratorio.
c. Adjunte capturas del proyecto realizado
d. El aplicativo sera revisado en clases y cuanto mas detalles posea, tendra una mejor
nota
 Nro. DD-106
Programación Móvil para Redes
Página 1 de 4
 Nro. DD-106
Programación Móvil para Redes
Página 2 de 4
 Nro. DD-106
Programación Móvil para Redes
Página 3 de 4
 Nro. DD-106
Programación Móvil para Redes
Página 4 de 4
 Nro. DD-106
Programación Móvil para Redes
Página 1 de 1

OBSERVACIONES (5 mínimo):
(Las observaciones son las notas aclaratorias, objeciones y problemas que se pudo presentar en el
desarrollo del laboratorio)
• El lienzo nos ayuda a utilizar la información de diferentes sensores para un juego.
• Se puede invertir al movimiento multiplicando por -1
• Para posicionar exactamente nuestros objetos dentro del lienzo podemos usar las matemáticas y
el alto y ancho de la pantalla
• Podemos dar valores aleatorios para así simular una inteligencia artificial
• El lienzo nos sirve para poder mover objetos dentro de la pantalla

CONCLUSIONES (5 mínimo):
(Las conclusiones son una opinión personal sobre tu trabajo, explicar como resolviste las dudas o
problemas presentados en el laboratorio. Ademas de aportar una opinión critica de lo realizado)
• Si puede deshabilitar la casilla de visible así se da un toque más artístico al momento de aparecer el
objeto.
• Se puede definir el tamaño de letra y el color dentro de un lienzo
• Es mejor trabajar con pixeles dentro del lienzo
• Las dentro del lienzo son fijos en cualquier dispositivo ya que trabaja en pixeles
• Hay que tener mas cuidado en la distribución dentro del lienzo ya que traba en pixeles
• Se puede limpiar el lienzo para escribir nuevamente
• Las notificaciones también pueden intervenir en el desarrollo de la aplicación
• Con el lienzo se puede interactuar mas con el celular