Vamos a crear una aplicación sencilla en App Inventor que pueda leer códigos QR. Sigue estos pasos cuidadosamente.
Paso 1: Iniciar un Nuevo Proyecto
Primero, abre App Inventor. Ve a "Comenzar nuevo proyecto" y dale un nombre a tu proyecto, por ejemplo, "LectorQR".
Paso 2: Añadir los Componentes Necesarios
Ahora, vamos a añadir los componentes que necesitamos a la pantalla de tu aplicación.
Must Read
Arrastra un componente Button desde la paleta "Interfaz de usuario" a la pantalla. Este botón servirá para iniciar el escaneo del código QR. Cambia el texto del botón a "Escanear QR" en las propiedades del botón.
Luego, arrastra un componente BarcodeScanner desde la paleta "Sensores" a la pantalla. Este componente estará invisible, pero es el que realizará el escaneo.
Finalmente, añade un componente Label desde la paleta "Interfaz de usuario" a la pantalla. Este componente mostrará el resultado del escaneo. Borra el texto predeterminado del Label, dejándolo vacío.
Paso 3: Programar el Comportamiento de la Aplicación
Ahora, vamos a programar la aplicación para que cuando se presione el botón, se inicie el escáner de código QR y el resultado se muestre en el Label.
Ve a la pestaña "Bloques".
Busca el bloque "when Button1.Click". Arrástralo al área de trabajo. Este bloque ejecutará un conjunto de instrucciones cuando se haga clic en el botón "Escanear QR".
Dentro del bloque "when Button1.Click", busca el bloque "call BarcodeScanner1.DoScan". Arrástralo y conéctalo dentro del bloque "when Button1.Click". Esto indica que cuando se presione el botón, se llamará a la función para escanear el código QR.
Ahora, necesitamos manejar el resultado del escaneo. Busca el bloque "when BarcodeScanner1.AfterScan". Arrástralo al área de trabajo. Este bloque se ejecutará después de que el escáner haya terminado de escanear un código QR.
Dentro del bloque "when BarcodeScanner1.AfterScan", busca el bloque "set Label1.Text to". Arrástralo y conéctalo dentro del bloque "when BarcodeScanner1.AfterScan". Este bloque establecerá el texto del Label.
Conecta el bloque "get result" al bloque "set Label1.Text to". El bloque "get result" contiene el texto del código QR escaneado.
Paso 4: Probar la Aplicación
Conecta tu dispositivo móvil a App Inventor usando el AI Companion.
Haz clic en el botón "Conectar" en App Inventor y sigue las instrucciones para conectar tu dispositivo con el AI Companion.
Una vez que la aplicación se muestre en tu dispositivo, haz clic en el botón "Escanear QR". Apunta la cámara de tu dispositivo a un código QR. El resultado del código QR debería aparecer en el Label.
Paso 5: Mejoras Adicionales (Opcional)
Puedes agregar más funcionalidades a tu aplicación. Por ejemplo, puedes usar el texto del código QR para abrir una página web si el código contiene una URL.
Para hacer esto, puedes usar el componente ActivityStarter. Añade este componente a tu proyecto.
Después de obtener el resultado del escaneo, puedes verificar si el resultado es una URL. Si lo es, configura el ActivityStarter para abrir esa URL.
Por ejemplo, dentro del bloque "when BarcodeScanner1.AfterScan", después de establecer el texto del Label, puedes añadir un bloque "if then else". Dentro del "if", puedes verificar si el "get result" contiene "http://" o "https://". Si es así, configura las propiedades del ActivityStarter y llama a la función "StartActivity".
¡Felicidades! Has creado una aplicación para leer códigos QR con App Inventor.
