Parcial 3 Lizbeth Ximello Hernandez Anayeli Morales Mendez Centro bachillerato tecnológico industrial y de servicios 153 Desarrolla aplicaciones móviles Guadalupe Vázquez Gonzales 4°B MP
1 Anayeli Morales Mendez Lizbeth Ximello Hernandez
PRACTICA 1 SONIDO DE PERRO Objetivo:
En este programa realizaremos una App, para poder escuchar el sonido de un perro a través de darle clic a la imagen, este programa se puede realizar con cualquier animal pero esta vez es específicamente para un sonido de perro Descripción de cada uno de los elementos
Se entra a App inventor (http://ai2.appinventor.mit.edu/ ) Ingresas tus correo electrónico y tu contraseña Dar clic a New Proyect Ponerle el nombre en este caso lo llamaremos “sonido de perro”
Utilizaremos el botón arrastrándolo hacia la pantalla de muestra para darle clic Le agregamos a la imagen en el mismo botón Como fondo del botón le agregamos la imagen del perro y ajustamos el tamaño Después nos fuimos a media y le pusimos sound el cual se configuro con el sonido de perro Agregamos un label para colocar el nombre y configuramos cambiando el color de fondo, la letra y tamaño Después nos fuimos a blocs para colocar el sonido en la imagen seleccionamos button button después arrastramos la etiqueta when button 2
Anayeli Morales Mendez Lizbeth Ximello Hernandez
Lo unimos con otra etiqueta que se llama call sound play Lo descargamos con la opción budil y en App (save.apk to my computer)
Para finalizar lo instalamos en el celular para que funcionara
3 Anayeli Morales Mendez Lizbeth Ximello Hernandez
PRACTICA 2 Llamada de foto OBJETIVO
En este programa realizaremos una APP para poder realizar una llamada con solo dar clic en la foto Así mismo puedes realizar tu llamada fácilmente ningún problema
y sin
Esta práctica primero se realizara en la computadora y después la paceremos al celular para probar la práctica y ver si se realizó tal como se hizo Descripción de cada uno de los elementos
Entrar a tu correo electrónico Entrar a APP INVENTOR Dar clic a new proyect Poner el nombre de la práctica que le vamos a poner LLAMADA EN FOTO Utilizaremos un botón para realizar la llamada, el cual le pondremos una imagen como fondo del botón para a la hora de darle clic marque En el primer botón se le agregara un llamador que se encuentra en social el cual se le pondrá el número de la persona que le marquemos Después en el mismo menú menú de social agregaremos un “PhoneNumberPicker” a nuestro proyecto y le pondremos de nombre “Agenda” ya que este nos
permitirá ir a donde se encuentran todos nuestros contactos y poder elegir otro número, editaremos su color de fondo y el tamaño de la letra 4 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Iremos a blocks e daremos clic en el botón entonces pondremos que cuando demos clic a Botón este va a marcar
PRACTICA 3 Mp3 Objetivo:
En este programa realizaremos una APP para reproducir la música que contiene al darle clic a cada botón tendrá su función, ya sea para poner la canción anterior, para pausar, para ponerle stop y para pasar a la siguiente, en el botón de pausar a la primera vez de darle clic, se ocultara el botón y ya no se podrá pausar, solo con el botón stop.
5 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Descripción de cada uno de los elementos
Se creó un nuevo proyecto Se colocó una imagen imagen de fondo en este caso se le puso uno respecto al tema Agregamos 5 botones, el cual de fondo de botón se le coloco respecto a la función que realizaría excepto al de pausa Los botones se colocaron en un “Horizontal Arrangement” que se encuentra en la barra de
herramientas dentro del layout, que se le coloco para que los botones se pusieran en forma de línea Se le agrego un reproductor para poder reproducir las canciones Después de tener el diseño hay que irnos a blocks Se agregó una variable global que le colocamos number y también se le agrego un Math para especificar que iniciara siempre en 1 Nos colocaremos en Screen y entonces se pondrá que cuando la pantalla intialize le daremos otras especificaciones
Daremos clic en reproductor 1 y donde dice “set reproductor 1 source to” lo arrastraremos donde se
encuentra lo anterior Realizaremos el mismo procedimiento anterior 2 veces mas Colocaremos un text 3 veces, pero cada uno se le colocara el nombre de la canción que reproducirá Se le pondrá un when play click y le colocaremos un call playList este servirá para al darle clic a play reproduzca Se le hará lo mismo solo que esta vez será un STOP y colocaremos un set top visible y le pondremos que cierto para que aparezca visible
6 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Lo mismo será con el PAUSE pero a este le pondremos que sea false para así cuando le demos clic dejara de funcionar, le colocaremos un BackgroundColor para poner el fondo en negro También un set pause para que la letra sea en blanco
7 Anayeli Morales Mendez Lizbeth Ximello Hernandez
PRACTICA 4 Calculadora básica OBJETIVO
En esta práctica se inicia con procesos matemáticos de los más simples como suma, resta, hasta cálculos más avanzados Para esta práctica se realizara las 4 operaciones básicas utilizando textbox, etiquetas y botones de comando PASOS
1. Entrar a App inventor (http://ai2.appinventor.mit.edu (http://ai2.appinventor.mit.edu)) 2. Ingresar correo electrónico 3. Iniciar un nuevo proyecto 4. Poner el nombre deseado al proyecto en nuestro coso le pondremos(OPERACIONES) 5. Se agrega un label ( donde colocaremos el nombre de operaciones ) en text 6. Se agregaron dos textbox (servirán para colocar los números deseados para realizar las operaciones básicas ) 8 Anayeli Morales Mendez Lizbeth Ximello Hernandez
7. En los dos botones se configuro el tamaño de 50x50 se le puso un fondo de color blanco y agrego el tamaño de la letra en 20 se centró la letra y el color de letra es negro y por último se le puso un (NumbersOnly) 8. Se agregó un (HorizontalArrangement1) (HorizontalArrangemen t1) para agregar los botones dentro de el 9. Se agregaron cuatro botones dentro del (horizontalarrangement1) 10. Agregamos texto en cada botón poniendo los signos de las operaciones en este caso le pusimos (+, -, x, /) se configuro el tamaño (20) el color de fondo (cyan) el color de letra (negro) y el tamaño de cuadro que es de 60x60 11. Agregamos un label que le se llamara llamara (resultado) le pusimos de tamaño 50 fue centrado y de color blanco (ahí se mostrara el resultado de la operación) 12. Dimos clic en blocks para que funciones la aplicación 13. Arrastramos el botón (when button1 clic) 14. Arrastramos un nuevo botón (set resultado text to) 15. Nos fuimos a math y arrastramos el botón de (+) 16. Dentro de los cuadros le agregamos un textbox1 y textbox2 17. Se le puso de fondo una imagen (al gusto)
9 Anayeli Morales Mendez Lizbeth Ximello Hernandez
PRACTICA 5 Tablas de multiplicar OBJETIVO:
Diseñar una aplicación en App Inventor que pregunte la tabla de multiplicar que deseas saber y dándole clic en Vamos la muestre PASOS
1. Se agregó un label para poner el título en este caso será “tablas de multiplicar
2. Se colocó un HorizontalArrangementt 3. Dentro del colocamos 2 botones, uno dirá vamos y el otro borrar en en los dos se le pondrá un fondo de color pink y la letra de color custom de un tamaño de 20 4. Pondremos un textbox con un tamaño de 20, fondo pink y con la opción de NumbersOnly y de nombre será “caja”
5. Se colocara 10 label, ahí aparecerán las operaciones 10 Anayeli Morales Mendez Lizbeth Ximello Hernandez
6. Un fondo de pantalla al gusto 7. Ir a blocks 8. Colocaremos 9 globales como variables de la A la I
9. Pondremos que q ue cuando c uando demos click en vamos se realizaran acciones 10. Entonces cuando caja va hacer igual a caja text 11. Después se colocaran las 9 globales y se pondrá la operación de multiplicar y dos text del 2 al 10 12. Se coloca del 1 al 0 los tex 13. Dentro de esos text se agregan join y la caja de texto 14. Como en el ejemplo
11 Anayeli Morales Mendez Lizbeth Ximello Hernandez
15. Después que cuando demos clic en Borrar se realizara otra acción 16. “set caja text to” agregar textos
12 Anayeli Morales Mendez Lizbeth Ximello Hernandez
PRACTICA 6 Calculadora científica OBJETIVO:
Realizar una aplicación en App Inventor que será una calculadora más avanzada con raíz cuadrada, exponente, seno, coseno y tangente Pasos:
1. Se agregó un HorizontalArrangement 2. Dentro de el se agregaron 2 botones b otones uno de encendido y uno de apagado 3. Un textbox 13 Anayeli Morales Mendez Lizbeth Ximello Hernandez
4. Se agregaron 22 botones para diferentes funciones, de tamaño de letra 30 con fondo pink Ya que está diseñado todo como va se coloca los blocks Se van poniendo los botones tal como valla la aplicación
14 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Ya que terminemos la aplicación quedo así...
15 Anayeli Morales Mendez Lizbeth Ximello Hernandez
PRACTICA 7 CONTRASEÑA DE USUARIO OBJETIVO:
HACER UN PROGRAMA QUE TENGA CONTRASEÑA Y UN NOMBRE DE USUARIO DESEADO QUE CUANDO ENTREMOS AL PROGRAMA SE APARESCA LA CONTRASEÑA Y DARLE CLICK YDESPUES QUE SE BALLA A LA OTRA PAGINA QUE QU E PODREMOS COMO POR EJEMPLO UNA IMAGEN, UN VEDEO PUEDE SER OBSIONAL PROCESO:
*ENTRAR ALA PAGINA APP INVENTOR *ABRIR UN NUEVO PROYECTO *PONER NOMBRE AL PROYECTO *ATRASTRAR UN ETIQUETA *UN CAMPO DE TEXTO * UN LABEL *UN PASSWORD TEXTBOX1 *UN BUTON1 *UNA ETIQUETA * UN NOTIFICADOR
16 Anayeli Morales Mendez Lizbeth Ximello Hernandez
*IR ALA SIGUIENTE PAGINA *IR A BLOOCKS
17 Anayeli Morales Mendez Lizbeth Ximello Hernandez
18 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Practica 8: Mapa Objetivo:
Realizar un práctica de geo localización en 3 diferente lugares turísticos, sin necesidad de wifi 19 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Pasos:
1. Primero entramos a la http://appinventor.mit.edu/explore/,, en donde daremos un http://appinventor.mit.edu/explore/ clic en “créate App!”.
2. Después de eso nos pedirá un correo electrónico y aceptaremos todos los términos que nos den. 3. Para crear una aplicación daremos clic en “start new Project” y daremos un nombre de cómo se quiere llamar
nuestra aplicación, una vez hecho esto nos mandara a esta parte. Al lado izquierdo encontraremos los comandos que utilizaremos para crear nuestra aplicación, a la derecha encontraremos las características de cada uno de los comandos. Colocaremos estos componentes en el los cuales encontraremos en la parte derecha. Para empezar a crear la aplicación Mapa colocaremos un con el nombre “Mapa”
4. Empezaremos utilizando label para el título en este caso será “lugares turísticos”
5. Después agregaremos un horizontal Arrgament ya que dentro de ahí se colocara una imagen 6. Despues agregaremos otro label para ponerle un subtítulo que será “Pulse el lugar deseado”
7. Empezaremos con los botones dentro de cada uno se colocara una Tabla Arrgement 8. Agregaremos otro tableArrgement para poner dentro de ahí otros 3 botones que tendrán el nombre del lugar al que se desea visitar 8. Seleccionaremos un TexToSpeech1, Y 3 ActivityStarter 20 Anayeli Morales Mendez Lizbeth Ximello Hernandez
9. Diseñaremos su imagen de fondo las letras y tamaño de cada botón, la imagen también le cambiaremos el tamaño y le colocaremos una imagen de fondo de acuerdo al tema 10. Pondremos que cuando botón de mapa 1, botón de mapa 2 y botón de mapa 3 se activaran los activityStarter 11. En cada uno de los ActivityStarter en sus propiedades se pondrá en action “android.intent.action.VIEW” y en
DataUri las coordenadas de cada lugar delante de un geo como por ejemplo “geo: 16.748491, -93.072963” 12. Después pondremos que cuando demos clic en el botón de Chiapas pondremos que set lugar text to “Chiapas” y que la imagen será el nombre de la imagen que será “Chiapas.jpg” y la tableArragement uno será
verdadero y el otro falso 13. Por último se pondrá un bloque de TextToSpeech para que del mensaje del lugar 14. Se repetirán los pasos 12 y 13 para los siguientes lugares
21 Anayeli Morales Mendez Lizbeth Ximello Hernandez
22 Anayeli Morales Mendez Lizbeth Ximello Hernandez
23 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Practica 9 Cohete Objetivo:
Realizaremos una aplicación que nos ayude a realizar operaciones de física más rápido y accesible sin necesidad de realizar tantos procedimientos Paso: 1. Primero entramos a la http://appinventor.mit.edu/explore/,, en donde daremos un http://appinventor.mit.edu/explore/ clic en “créate App!”.
2. Después de eso nos pedirá un correo electrónico y aceptaremos todos los términos que nos den. 3. Para crear una aplicación daremos clic en “start new Project” y daremos un nombre de cómo se quiere llamar
nuestra aplicación, una vez hecho esto nos mandara a esta parte. Al lado izquierdo encontraremos los comandos que utilizaremos para crear nuestra aplicación, a la derecha encontraremos las características de cada uno de los comandos. Colocaremos estos componentes en el los cuales encontraremos en la parte derecha. a) Para
empezar
a
crear
la
aplicación
cohete
colocaremos un con el nombre “cohete” b) Pondremos 5 screen uno será el “menú” otra se llamara “tiempo”, otro llamara “alcance máximo”, otro de ellos se llamara “altura máxima” y el ultimo tendrá el nombre de “velocidad”. 24 Anayeli Morales Mendez Lizbeth Ximello Hernandez
c) Lo siguiente siguie nte será poner en el menú o la primera screen 1 label que escrito tendrá “cohetes de agua” y
4 botones los cuales que tendrán escritos: Calcular altura máxima, Calcular el tiempo en el aire, Calcular la velocidad y Calcular el alcance máximo.
25 Anayeli Morales Mendez Lizbeth Ximello Hernandez
d) En la screen tiempo utilizaras una tabla con label escrito tiempo en el aire. Luego otra tabla que contenga 2 botones y un label, un botón tendrá escrito “regresar al menú”. Fuera de las tablas
pondrás 6
label escrito valor de la velocidad inicial, valor del Angulo, valor de la gravedad, 9.81, resultado. 1 botón escrito “calcular” 2 texbox
26 Anayeli Morales Mendez Lizbeth Ximello Hernandez
La screen alcance máximo utilizaras una tabla con label escrito “alcance máximo”. Luego otra tabla que
contenga 2 botones y un label, un botón tendrá escrito “regresar al menú”. Fuera de las tablas
pondrás 6
label escrito valor de alcance máximo, valor del Angulo, valor de la gravedad, 9.81, resultado. 1 botón escrito “calcular” 2 texbox
27 Anayeli Morales Mendez Lizbeth Ximello Hernandez
28 Anayeli Morales Mendez Lizbeth Ximello Hernandez
En la Screen altura máxima utilizaras una tabla con label escrito altura máxima. Luego otra tabla que contenga 2 botones y un label, un botón tendrá escrito “regresar al menú”. Fuera de las tablas
pondrás 6
label escrito valor de la velocidad inicial, valor del Angulo, valor de la gravedad, 9.81, resultado. 1 botón escrito
“calcular”
2
texbox
En la Screen velocidad utilizaras una tabla con label escrito velocidad inicial. Luego otra tabla que contenga 2 botones y un label, un botón tendrá escrito “regresar al menú”. Fuera de las tablas
pondrás 6
label escrito valor de alcance máximo, valor
del 29
Anayeli Morales Mendez Lizbeth Ximello Hernandez
Angulo, valor de la gravedad, 9.81, resultado. 1 botón escrito “calcular” 2 texbox
30 Anayeli Morales Mendez Lizbeth Ximello Hernandez
31 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Practica 10 Juego de Memorama de Monster University Objetivo: Realizar un juego para entretenimiento referido a una película de animación en este caso realizaremos un juego sobre un memorama Pasos:
1. Primero entramos a la http://appinventor.mit.edu/explore/,, en donde daremos un http://appinventor.mit.edu/explore/ clic en “créate App!”.
2. Después de eso nos pedirá un correo electrónico y aceptaremos todos los términos que nos den. 3. Para crear una aplicación daremos clic en “start new Project” y daremos un nombre de cómo se quiere llamar
nuestra aplicación, una vez hecho esto nos mandara a esta parte. Al lado izquierdo encontraremos los comandos que utilizaremos para crear nuestra aplicación, a la derecha encontraremos las características de cada uno de los comandos. Colocaremos estos componentes en el los cuales encontraremos en la parte derecha. a) Para empezar a crear la aplicación
del juego
colocaremos un con el nombre “Memorama” b) Pondremos 1 label con el nombre del título “Monster University”
32 Anayeli Morales Mendez Lizbeth Ximello Hernandez
c) Después pondremos un VerticalArrangament configurándolo su alineación al centro d) Dentro del HorizontalArrangement pondremos el TableArrangament con columnas de 4X4 e) Dentro de la TableArrangement pondremos 14 botones en orden f) Los botones se configura el color de fondo y el texto g) Debajo del de l TableArrangement TableArrang ement se colocara un botón con el nombre de resert en la parte de en medio, configurando el tamaño de letra, el color del texto
33 Anayeli Morales Mendez Lizbeth Ximello Hernandez
H) Después nos fuimos a blocks y seleccionamos la variable de INTALZE GLOBAL BOTNES TO después nos fuimos a listas y seleccionamos CREATE EMPTY LIST le dimos duplicar y solo le cambiamos los nombres que eran IMÁGENES DE BOTONES, BOTON SELLECIONADO1, BOTON SELECCIONADO2
Después nos fuimos a PRODUCERES e insertamos unas variables que fueron TO PRODUCE que será para insertar las imágenes y así funcionen correctamente, así igual las imágenes aparecerán en el memorara, también nos fuimos a listas y pusimos una variable
34 Anayeli Morales Mendez Lizbeth Ximello Hernandez
También le pusimos los botones para las imágenes y para que funcione mejor la aplicación al cual como la imagen que apérese, de igual manera se repiten los mismos pasos
Pusimos también para la comprobación para que el juego funcione y no se detenga
Para terminar el juego nos fuimos a diseño y lo diseñamos y así quedo
35 Anayeli Morales Mendez Lizbeth Ximello Hernandez
Para terminar esta práctica lo descargamos y quedo así
36 Anayeli Morales Mendez Lizbeth Ximello Hernandez