Tutorial 3: Cash Register

  1. Portada
  2. Tutorial 3: Cash Register

Objetivo:

El objetivo de este ejemplo es mostrar cómo se importar un proyecto desde el ordenador, cómo se leen código QR o código de barra.

Pasos a Seguir

1. Acceso al Entorno
  • Abrir el entorno de desarrollo App Inventor.
    1. Accede a la siguiente dirección: https://appinventor.mit.edu/
    2. Pulsa el botón create app!
    3. Selecciona una cuenta de Google
    4. Acepta los términos y condiciones (solo la primera vez que se accede a la plataforma)

↧

2. Importación de la interfaz de usuario ya implementada
  • Pulsa el menú Projects -> Import project (.aia) from my computer... (Descargar el proyecto que se proporciona en el botón)
Pestaña designer

↧

3. Implementación de la lógica de la aplicación
  • Cambia a la pestaña Blocks (Arriba a la derecha)
botón del monitor serial
Pestaña para cambiar a modo desarrollador de lógica.

↧

4. Creación una lista para todos los productos escaneados
  • Lo primero de todo se creará una lista vacia que irá almacenando los precios que se lean
variable con lista vacia
Creación de una lista vacia

↧

5. Definir Acción cuando el botón es pulsado
  • Tras ello se indicará que tras pulsar el botón se encenderá el modo leer código de barras o código QR
variable con lista vacia
Inicio de lectura de Código QR o Código de Barras tras pulsar el botón

↧

6. Implementar la lógica cuando un Código de Barras es leído
  • A continuación, se describe la lógica que se debe ejecutar tras leer un código de barras (más abajo se muestra una imagen con la lógica ya implementada):
    1. Se debe introducir un bloque que permita incluir instrucciones tras leer el código de barras o QR. Este tipo de bloque se obtener al pulsar sobre "ScanComponent" que es un componete visual ya incluido con la importación del proyecto.
    2. Como primera acción se debería de revisar si el código leído es un número. Para ello, haga uso del bloque de control "Si"/"If".
    3. Para determinar la lógica del último bloque, haga uso del bloque de matemáticas número?/number? con el valor leído tras escanear un código (variable result).
    4. Para el caso de ser un número, reproduzca el sonido del componente Sound1 haciendo uso de sus bloques.
    5. A continuación, cree una variable local llamada "randomPrice" que almacene un número aleatorio entre el 3 y el 20 (esto simulará un precio de producto).
    6. Escriba el valor aleatorio de la variable "randomPrice" como texto en el componente "ProductPrice" para que aparezca en la interfaz visual.
    7. Además, agregue el valor generado en la lista de productos leídos. Haga uso de la familia de componetes integrados Lista/List para agregar un elemento a una lista.
    8. Actualice el componete visual "ProductList" con el valor de la lista para que se refresque la interfaz visual.
    9. Por último, calcule el precio total haciendo una suma del precio total más el valor aleatorio.
    10. Para indicar la lógica en el caso de que el valor leído no sea un número, se deberá de pulsar el engranaje el componente de bifucación Si/If e incluir el bloque sino/else.
    11. Dentro de esta sección, se puede implementar la lógica para mostrar un mensaje de alerta.
variable con lista vacia
Lógica tras leer el código de barras o código QR

↧

7. Compilación de la aplicación e instalación en el dispositivo
  • Pulse el botón de Construir "Build" y seleccione proporcionar código QR para la aplicación QR
  • Lea el código QR con su dispositivo Android y descargue la aplicación
  • Si es la primera vez que instala una aplicación desde App Inventor es necesario permitir al dispositivo móvil instalar aplicaciones de origen desconocido (es decir, aplicaciones fuera del Google Play Store). Para ello:
    • Si durante el primer intento de instalación le proporcione un acceso directo a Ajustes-> Seguridad seleccione instalar aplicaciones de origen desconocido
    • Si tan solo le deniega la posibilida de instalar. Siga los siguientes pasos:
      1. Vaya a Ajustes de su dispositivo Android (Settings)
      2. Acceda a la opción de Seguridad
      3. Marque el checkbox de permitir instalaciones de origen desconocido
  • Tras tener acceso a instalaciones de origen desconocido, intente instalar la aplicación de nuevo.