Carrera: Técnico en programación: Módulo V.

Docente: Ing. José Armando Gracida Niño

1. A través del enlace compartido en el blog, se debe instalar MIT AI2
Companion en un dispositivo Android.

1. A través del enlace compartido en el blog, se debe instalar

AndExplorer en un dispositivo Android.
1. En el navegador de preferencia entramos en la dirección
“https://appinventor.mit.edu” o bien buscamos en google Mit App
Inventor. Posteriormente entramos a la sección de “create apps”.

2. En dicha sección se elige la cuenta google con la que podemos

acceder.
3. A continuación, se mostrará si aceptamos los términos y
condiciones, lo cuál se debe corroborar.

4. Al ingresar se mostrarán ventanas de tutoría las cuáles hay que

cerrar (en la primera se elige “do not show again” y contínue, en la
segunda se elige close).
5. A continuación, en el menú Project se elige “Import Project (aia from
my computer)”.
6. Nos aparece examinar de donde elegimos el archivo
“TiendaApp.aia” que se descarga desde el blog.

7. En el menú principal aparece el doma por defecto “English”, el cual

debemos cambiar a español.
1. En el navegador de preferencia entramos en la dirección
“https://firebase.google.com/?hl=es” o bien buscamos en google el
componente firebase. Posteriormente entramos a la sección de ir a
consola.

2. En caso de no tener iniciada una sesión de google, en la parte

superior derecha nos aparece la opción para hacerlo.
Posteriormente seleccionamos agregar proyecto.
3. El primer paso para agregar el proyecto será ingresar un nombre
(ingresa el nombre de tu tienda).

4. En el segundo paso deshabilitamos google analitycs.

5. Una vez configurada nos aparecerá nuestra bd después de un
momento.

6. En el menú lateral izquierdo aparece la opción Realtime Database

donde accedemos, para ver en tiempo real los cambios en el
almacenamiento de la bd.
7. Para terminar con el proceso se debe crear la base de datos.

8. La ubicación que corresponde es US central.

9. En cuanto a las reglas de seguridad se debe elegir modo prueba.

10. Con este paso finaliza la creación de la bd, esta ventana se quedará
abierta para las pruebas.
1. En el entorno de diseñador de App inventor se selecciona el
componente firebase.

2. En firebase en Realtime Database, se selecciona y copia la URL de

nuestra BD que debe comenzar con “https”.
3. En el entorno de diseño de App inventor, en propiedades del
componente firebase encontramos el campo firebase URL donde
pegamos el contenido copiado.

1. En el entorno de bloques de App inventor en el menú lateral derecho

accedemos a screen1/btn guardar y mediante el componente “clic”
se crea el siguiente módulo.
1. En el entorno de bloques de App inventor en el menú lateral derecho
accedemos a screen1/btn actualizar y mediante el componente “clic”
se crea el siguiente módulo.
1. En el entorno de bloques de App inventor en el menú lateral derecho
accedemos a screen1/btn borrar y mediante el componente “clic” se
crea el siguiente módulo.
1. Por defecto el componente KYO_Base 64 trae una dirección donde
se leerán las imágenes. Debido a ello se debe crear la carpeta de
nombre AppInventor y dentro una subcarpeta llamada assets, es
dentro de esta última donde pegaremos las imágenes de 10
productos a vender (con un peso no mayor a 200 kb.)

2. La carpeta AppInventor se copiará y pegará en el almacenamiento

interno del celular.
1. Por defecto el componente KYO_Base 64 trae una dirección donde
se copiarán las imágenes. Debido a ello se debe corroborar si dentro
del almacenamiento interno/Android/data existe la carpeta
“edu.mit.appinventor.aicompanion3”.

2. Dentro de esta carpeta debe haber otra llamada files que es donde
se copiarán estos archivos.
3. En el menú principal accedemos a conectar/AI Companion, al
presionar nos genera un código.

4. Desde la aplicación de MIT instalada en el celular se elige la opción

scan QR code.
5. Desde la aplicación de MIT instalada en el celular se escanea el
código.

6. Se elige la imagen del producto y se rellenan los campos de texto.

7. Se presiona “guardar” y debe aparecer el mensaje “producto
almacenado”.

8. En la sección Realtime Database de firebase, se deben reflejar los

datos recientes.
1. Para seguir ingresando datos agregamos el bloque “poner
ProjectBucket como” un capo de texto vacío. Este bloque debe
dentro de “cuando screen inicializar”, antes de llamar a
FirebaseDB1.

2. Agregado el bloque se presiona “refresh Companion screen”.

3. En consecuencia, se activará el visor de lista y se podrán agregar
más productos.