6. AppInventor - Base de Datos Local - TinyDB

Vamos a ver cómo podemos guardar datos de la aplicación en nuestro teléfono móvil para que cuando el usuario cierre la app y la vuelva a abrir, pueda recuperar la información que ha guardado.
El componente que usaremos será TinyDB.

1) Estructura de la TinyDB

Para guardar datos en TinyDB se debe usar una combinación de Etiqueta --> Valor

Nosotros elegiremos el nombre de la Etiqueta, y le pondremos el Valor que nos interese guardar.

Luego cuando queramos recuperar ese valor, le preguntaremos a TinyDB qué Valor tiene la Etiqueta.

Por ejemplo:

Etiqueta: NombreDeUsuario

Valor: Alex

Aquí he decidido crear una Etiqueta llamada "NombreDeUsuario", y como mi nombre es Alex, al usarla, guardaré el valor de "Alex". Pero ese valor es Variable, es decir, otro usuario, que use la app, en la misma Etiqueta "NombreDeUsuario" podría guardar por ejemplo el valor "Maria".

Luego en la app, podríamos usar ese valor para saludar al usuario:

"Hola NombreDeUsuario" pasaría a ser:

"Hola Alex" o "Hola Maria" según el Valor guardado.

Vamos a ver en práctica cómo funciona esto.

2) Cómo usar TinyDB

# Diseñador

Primero de todo, en cada pantalla que queramos usar TinyDB deberemos arrastrar el componente a la pantalla. Nos aparecerá en "Componentes no visibles".

Lo podemos encontrar en Almacenamiento > TinyDB.

# Bloques

Usaremos únicamente 2 bloques para TinyDB:

1 - Guardar Valor: Para guardar un Valor a una Etiqueta.

2 - Obtener Valor: Para obtener el Valor de una Etiqueta.

Puede ser que la Etiqueta NO tenga ningún Valor, es decir, no hemos guardado nada (todavía) en esa etiqueta. Para ello este bloque tiene una pieza llamada valorSiEtiquetaNoExiste donde podemos elegir el Valor que queramos, por defecto, en caso que la Etiqueta no exista.

Podemos encontrar estos bloques haciendo click en el componente de TinyDB.

3) Guardar Datos en TinyDB

Vamos a hacer un ejemplo guardando el nombre de usuario en TinyDB. Esto nos servirá para:

- Poder saludarlo por su nombre en la app.

- Saber si está registrado.

Para ello iremos a la pantalla de Registro (y/o Iniciar Sesión) y cuando el usuario se registre guardaremos su nombre.

Esta es mi pantalla de Registro.

Aquí el usuario puede también añadir su Email y Contraseña, pero por ahora solo usaremos el CampoDeTexto del Nombre de Usuario.

Cuando se apriete el Botón de Registro, guardaré el nombre de usuario en la Etiqueta "usuario":

Ahora tenemos el Valor del nombre que el usuario haya elegido guardado en la Etiqueta "usuario".

4) Leer Datos en TinyDB

Vamos ahora a recuperar el nombre del usuario para saludarlo.

# Diseñador

En la Pantalla Principal voy a poner una Etiqueta que dirá "Hola xxx", cambiando "xxx" por el Valor del nombre del usuario.

No olvidarse de añadir también TinyDB en esta pantalla.

# Bloques

Cuando se abra la pantalla (.Inicializar), pondré en el texto el Valor de usuario de la base de datos de la siguiente manera.

El bloque .Inicializar se encuentra en el componente de Pantalla.

El bloque .Texto está en el componente de la Etiqueta.

El bloque .ObtenerValor está en el componente de TinyDB

En mi caso, si me he registrado con el nombre de usuario de Alex, este será el resultado al probar la aplicación:

Según el Valor del nombre de usuario saldrá un nombre u otro!

En este caso nos hemos dejado el "Hola " delante del nombre, así que lo añadimos con el bloque, de la sección Texto, unir.

Y ya tenemos el resultado final:

5) Está el usuario registrado?

Finalmente vamos a ver cómo comprobar si el usuario está registrado.

Una vez el usuario se ha registrado en nuestra aplicación y la cierra, cuando la vuelva a abrir no debemos mostrarle otra vez la pantalla de Registro.

Para ello, en la pantalla Screen1 que vimos anteriormente, comprobaremos si hay un usuario guardado en TinyDB:

- Si el Valor de la etiqueta está vacío, significa que no se ha registrado aún, entonces vamos a la pantalla de Registro.

- Sino, (si hay un Valor en esa etiqueta), significará que el usuario ya se ha registrado antes y hemos guardado su nombre, entonces vamos a la pantalla Principal.

Vamos pues a programarlo.

# Próximos Pasos

Hasta aquí hemos visto el uso de TinyDB para guardar un nombre de usuario pero podemos guardar todo lo que queramos, como por ejemplo el idioma, o sus puntos, sus favoritos, etc.

Todos estos datos quedan guardados en el móvil y son únicamente del usuario que está usando la aplicación y son eliminados en cuanto el usuario borra la aplicación.

En la próxima sesión veremos cómo guardar datos en la Nube (online) para tener datos de todos los usuarios, que no se van a borrar nunca.