APLICACIN 1: Saludo

Entramos al navegador y buscamos Mit-App-inventor 2 la cual fue

la primera opcin que sali al dar clic y entrar pidi ligar mi cuenta
de Google a la plataforma despus de eso sali la siguiente
ventana

Aqu solamente dimos en aceptar trminos

Este mensaje aparecer porque es la prima vez que ingresamos

Le damos en el tercer botn donde dice (never take survey que

en espaol es nunca tomar encueta) al dar clic saldr la siguiente
ventana

En esta ventana solo le damos en

continuar

Nos aparare ser de la siguiente

forma
 A si aprese pero para crear un
proyecto solo le daremos en el
botn crear nuevo proyecto.
Esta plataforma esta total mente
en ingls pero si notaron la
captura esta en espaol esto se
debe porque he puesto la extincin de google del traductor y
transforma la pgina web y la traduce al espaol.
Ya que hallamos pulsado iniciar un nuevo proyecto saldr la
siguiente ventana.
En esta venta pedir el nombre
del proyecto y le pondremos
SALUDO ya puesto el nombre le
daremos clic en DE ACUERDO
Nos saldr la siguiente ventana.
 Vamos a cambiar el color de fondo a gris, para ello vamos a
Propiedades y cambiamos el color de fondo a gris.

Como vemos hemos cambiado el color de fondo al color grey que

es el color gris
 En segundo lugar, vamos a aadir el icono que veremos en
nuestra aplicacin, para ello vamos Icono aadir, y
seleccionamos el archivo (En este caso saludo.jpg)

Le damos en la herramienta icono y le damos clic donde dice None

Le daremos en subir archivo y nos ladra la
siguiente ventana

Y le volvemos a poner seleccionar archivo

saldr esta ventana de
explorador a tu ordenador y
ah buscas el icono a poner
Una buscado le das clic y
luego le das en el botn
abrir.
Te saldr la siguiente
ventana
En esta ventana le dars en de acuerdo y estar listo ahora vamos
con el siguiente paso
Para poner el botn de Saluda!:

Ahora vamos a irnos a donde dice paleta elegimos la opcin botn

y lo arrastramos hacia el espectador
Cambiamos el nombre de Button1 por defecto, por otra ms fcil de
recordar (Ej. BotonSaludar), desde Componentes hasta abajo dice
rebautizar ah le damos clic y nos saldr la siguiente ventana

Donde dice nuevo nombre le ponemos lo siguiente Ej. BotonSaludar

Y le daremos en el botn que dice de acuerdo
Ahora vamos a cambiar el tamao del botn y su texto para ello
nos remos a las propiedades
Y buscamos la siguiente herramienta

Borramos el nombre que trae por defecto y le ponemos el siguiente

Pulsa para saludar!.

Ahora vamos a ver si efectiva mente se cambio!!

Como ven efectiva mente se cambio. Ahora aremos el siguiente

paso
En propiedades del botn iremos a la anchura como lo vern en la
siguiente imagen
Damos clic ah y nos saldr la siguiente venta

Y le damos clic en llenar los padres ya hecho esto le damos en

DEA CUERDO.

Imagen 1 Imagen 2

Aqu les pongo como se ve cuando no habamos puesto la opcin

llenar los padres de la configuracin anchura la imagen 1 es cuando
no la tiene aplicada y la imagen 2 cuando se aplico
Ahora nos dirigiremos al mismo panel de propiedades solo que esta
vez buscamos la altura como se muestra en la siguiente imagen
Le damos doble clic y saldr la siguiente ventana

Ah elegimos la 3 opcin donde dice pixeles y le escribimos 50 y

una vez echo le damos en desacuerdo

Imagen 1 Imagen 2

En la imagen 1 no le hemos aplicado la altura en la imagen 2 ya se

le aplico los 50 pixeles de altura
 Ahora insertaremos la imagen de saludo en el lugar donde se
mostrar, para ello:
Marcamos la opcin de "Mostrar componentes ocultos en el visor"
Que se encuentra en la parte de arriba de la screen1 como se
muestra en la siguiente imagen

Le damos clic en la casilla para marcarla.

Arrastramos desde Paleta Basic, el componente Imagen, y lo
colocamos debajo del Botn Saludar. Como se muestra en la
siguiente imagen
Cambiamos el nombre de Image1 por defecto, por otra ms fcil de
recordar (Ej. ImagenHola).
Hacemos lo siguiente le damos clic en el botn rebautizar

Y cuando le hayamos dado clic nos saldr la siguiente ventana

Y le damos clic en de acuerdo

Le quitamos la visibilidad, para que en el inicio no se muestre,
desmarcando la opcin Visible de Propiedades. Como se
muestra en la siguiente imagen

De desmarcamos la casilla que dice visible la cual estoy sealando

con rojo y amarillo
 Por ltimo en Propiedades seleccionamos imagen

Subir archivo que queremos subir (En este caso Hola.png).

Una vez que ya hallamos subido el archivo le damos en de
acuerdo
Ya saben que saldr una venta donde igual se pone subir archivo
lo buscamos en el ordenador y le das en abrir y luego dos veces de
acuerdo
 Si no notado la imagen no entra
bien en la screen1 para remediarlo
haremos lo siguiente
Tenemos que dirigirnos a la
propiedades de la imagen

Y de ah buscamos lo siguiente

Como ya hemos hecho esto

anterior mente de damos doble clic
y saldr lo siguiente

Por defecto siempre aparare cera

automtico y le daremos en la segunda
que es llenar los padres y le daremos en
de acuerdo
Como ven ahora si ya se puede visualizar mejor la imagen sale
completamente perfecta
Para poner los botones de reiniciar y salir haremos lo siguiente:
Iremos a los componentes donde dice
paleta damos clic donde dice diseo como
se muestra en la siguiente imagen.
Arrastramos a la primera opcin que sale
que es la de HorizontalArrangement y se
arrastra a la screem1
Dentro del cuadro que nos sale colocamos 2 botones, como en el
paso 3 pero en este caso con estas caractersticas:
Como estamos en diseo ahora le daremos clic en interfaz del
usuario y elegimos la prima opcin que dice botn
Arrastramos dos botones en el cuadro que apareci como se
muestra en la siguiente imagen

Cambiamos el nombre del primer botn en componentes, a

BotonReiniciar y su texto a Reiniciar
Nos dirigiremos a los componentes como se muestra en la
siguiente imagen
Trabajaremos el botn 1 y le damos en el botn rebautizar y nos
saldr la siguiente venta

Escribiremos botn reiniciar en donde dice Nuevo nombre ya

hecho esto le damos clic en DE ACUERDO. Ahora buscaremos
donde dice propiedades del botn reiniciar que est justo alado
como se muestra en la siguiente imagen:

Dentro de las propiedades buscamos donde dice texto como se

muestra en la siguiente imagen:
En el texto le ponemos reiniciar.

Como ven se ha cambiado el nombre y le hemos cambiado el

nombre de la variable. A si aremos con el siguiente botn pero el
segundo botn le pondremos como nombre del componente a
BotonSalir y su texto a Salir
Como ven ya he puesto el nombre de componentes y el nombre de
los dos textos.
Para poder hacer vibrar el telfono cuando pulsamos saludar
debemos de insertarle un sonido, para ello.
Buscamos desde paleta donde dice media y
le damos clic ahora arrastramos el sonido a la
screen1
En la siguiente imagen se le mostrara donde
y como se nota el sonido
ahora guardamos el proyecto
Ahora modificaremos el comportamiento de los distintos
componentes con el Editor de bloques, para ello lo abrimos
pulsando Open the Blocks Editor.

Damos clic donde dice bloques

Aqu ser donde se codificara esta app como se mostrara la
siguiente imagen
Les mostrare todas las funciones del blocks. Empezando por la
primera herramienta la cual es BUIT-IN
Arrastramos My Blocks BotonSaludar la opcin when
BotonSaludar.Click do que es primero que aparece

Ahora damos clic en imagen y buscamos lo siguiente

(Set imagen_hola visible to) que es la siguiente

Hasta ahorita llevamos solo 2 puestas que esto se ve de la

siguiente manera

Ahora hacemos lo siguiente desde Built in Logic la opcin

true y la encajamos detrs del to de ImagenHola.Visible

Que es la primera que aparece

colocndolo atrs de del to de

Quedara de la siguiente manera

Para que el telfono vibre cuando pulsamos BotonSaludar

haremos lo siguiente:
Aadimos debajo de ImagenHola.Visible My Blocks
Sound1 la opcin Sound1.Vibrate.

Que es la sexta opcin que sale al darle clic en sund1

Como esta opcin debe ir debajo de imagen_hola que dara de la

siguiente manera.

Ahora vamos a poner la opcin number y la encajamos detrs de

Sound1.Vibrate, y cambiando el valor del nmero a 100 para ello
nos iremos a la opcin Math
Que es la primera opcin que sale

Le damos clic dentro donde est el 0 y le ponemos 100 ya echo

esto tendremos que ponerlo detrs de sound1 que quedara de la
siguiente manera
Reiniciar la aplicacin cuando se pulse BotonReiniciar:

Que es la primera opcin que nos sale

Damos clic en imagen_hola y buscamos lo siguiente (Set
imagen_hola visible to)

Que es la opcin

Y lo colocaremos dentro del botn reiniciar y nos quedara de la

siguiente manera

Ahora iremos a logic que se encuentra en BUIT-IN y arrastramos

el false.
que es la segunda opcin que sale como se ver a continuacin

y la encajamos detrs del to de (Set imagen_hola visible to)

y nos quedara de la siguiente manera

Ahora hacemos lo siguiente con el botn salir

Y elegimos la primera opcin que sale la cual es la siguiente:

Ahora iremos al Built-in y damos clic en control

Y buscamos la opcin que dice close application que es la

siguiente:

Que ira dentro del boton salir y queda de la siguiente manera

El aspecto final se vera de esta manera como continuacin vern

Para descargar la aplicacin
Iremos al men que est en la parte de arriba

Damos clic en Build y saldrn dos opciones

La cual elegirn la 2 que la va a descargar a su ordenador en la

carpeta de descarga y se descargara automtica mente.
 CBTis250
LUIS ADAN AGUIRRE SANDOVAL