Elaboró: Mtro.

Mario Pérez Bautista Práctica 9: Registro Login en la nube

Manual de Prácticas de Desarrollo Rápido de Aplicaciones Móviles Fecha: 29-04-22
Práctica: Registro Login en la nube

Objetivo: Almacenar la información de un usuario de una base de datos en la nube por medio de
una ventana de registro para autenticar a cada uno con usuario y contraseña.

Materiales:

Componentes y medios Descripción (que se debe de agregar)

Paso1.-Agregar al Screen1, en el siguiente
orden:
• 1 disposición vertical
• 1 disposición horizontal
• 1 imagen
• 1 campo de texto
• 1 campo de texto contraseña
• 2 botones
• 1 FirebaseDB
• 1 Notificador

Nota: Agregar una nueva ventana

llamada Registro
• Importar un archivo jpg

Paso2.-Agregar al Registro, en el siguiente

orden:
• 1 disposición vertical
• 3 disposición horizontal
• 4 campos de texto
• 1 campo de texto contraseña
• 2 botones
• 1 FirebaseBD
• 1 Notificador
Elaboró: Mtro. Mario Pérez Bautista Práctica 9: Registro Login en la nube
Manual de Prácticas de Desarrollo Rápido de Aplicaciones Móviles Fecha: 29-04-22
Procedimiento:

Visor Descripción
Paso1.- Configurar sobre el Screen:
• Título= “Login Nube”+Nombre.
• OrientaciónDeLaPantalla=”Vertical”
Paso2.- Configurar I
magen llamado imgUsuario:
• Foto=”usuario.jpg”
Paso3.- Configurar botón llamado btnIngresar:
• texto=”Ingresar”
Paso4.- Configurar botón llamado btnRegistro:
• texto=”Registrarse”
Paso5.- Configurar botón llamado txtUsuario:
• texto=””
Elaboró: Mtro. Mario Pérez Bautista Práctica 9: Registro Login en la nube
Manual de Prácticas de Desarrollo Rápido de Aplicaciones Móviles Fecha: 29-04-22

Paso5.- Configurar sobre el Screen Registro:

• Título= “Registro”
• OrientaciónDeLaPantalla=”Vertical”
Paso6.- Configurar el Campo de texto llamado
txtMatricula:
• Pista=” Matricula”
Paso7.- Configurar el Campo de texto llamado
txtApPat:
• Pista=” Apellido Paterno”
Paso8.- Configurar el Campo de texto llamado
txtApMat:
• Pista=” Apellido Materno”
Paso9.- Configurar el Campo de texto llamado
txtNombre:
• Pista=”Nombre”
Paso10.- Configurar el Campo de contraseña
llamado txtPass:
• Pista=”Contraseña”
Paso11.- Configurar el botón llamado
btnGuardar
• Texto= “Guardar”
Paso12.- Configurar el botón llamado
btnCancelar
• Texto= “Cancelar”

Bloques

Paso1.- Declarar una variable

Pas guarda el valor de la contraseña leida de la base de datos para ser comparada después con la
contraseña que ingrese el usuario en la caja de texto.

Paso2.- Al oprimirse el botón se espera que se abra la otra ventana llamada registro.
Elaboró: Mtro. Mario Pérez Bautista Práctica 9: Registro Login en la nube
Manual de Prácticas de Desarrollo Rápido de Aplicaciones Móviles Fecha: 29-04-22

Paso3.-. El evento clic del btnIngresar inicializa el projectBucket de firebase en la ruta “usuarios/”
mas la matricula que el usuario escriba sobre txtUsuario pero usted puede organizar la ruta en la
base de datos que guste, después de inicializar la ruta el algoritmo lee el contenido de la etiqueta
“mat” y “pass”, una vez leído compara el contenido de la variable

Paso4.-El evento obtener valor se ejecuta cuando se lean datos de la base de datos y guarda en la
variable pass el valor leído si la etiqueta es pass.

Paso5.- En la sección de código de la ventana registr colocar el vento clic del boton cancelar, y en
caso de que el usuario cancele el proceso de registro solo debe cerrarse la ventana de registro.
Elaboró: Mtro. Mario Pérez Bautista Práctica 9: Registro Login en la nube
Manual de Prácticas de Desarrollo Rápido de Aplicaciones Móviles Fecha: 29-04-22

Paso 6.- En el botón guardar del evento clic, primero inicialice el projecy bucket a la ruta en la que
se encuentran los datos, luego invoque el guardar valor de firebase, coloque una etiqueta y el
valor, despue slimpie cada caja de texto.

Paso7: En caso de que existiera un error al guardar lo mandaremos al notificador como alerta al
usuario.
Elaboró: Mtro. Mario Pérez Bautista Práctica 9: Registro Login en la nube
Manual de Prácticas de Desarrollo Rápido de Aplicaciones Móviles Fecha: 29-04-22
Resultados:

Capturas de pantalla de ejecución

Paso1 Paso2 Paso3

Paso1.- El usuario ingresa a la primera pantalla en la que podrá oprimir el botón de registrar para
poder tener acceso.
Paso2.- El usuario ingresa a la pantalla de Registro, asigna su matrícula, nombre y contraseña en los
campos correspondientes, al oprimir el botón de guardar se le notificará que “Registro guardado
satisfactoriamente” si se ha almacenado los datos en la base de datos y regresará a la pantalla de
Login, si oprime el botón de cancelar regresa a la pantalla de Login sin guardarse los valores.
Paso3.- Si se ha realizado el registro correctamente, se podrá ahora consultar el nuevo usuario al
oprimir el botón desplegable y seleccionarlo.

Paso4 Paso5 Paso6

Paso4: Si el usuario escribe correctamente la contraseña que corresponde a ese usuario se notificará
el nombre y matrícula, opcionalmente esto puede abrir una nueva ventana a la que accederá solo si
el usuario de la app conoce la contarseña correcta.
Paso5: Si el usuario de la app no escribe correctamente la contraseña se le notificará que “El usuario
o contraseñ no son correctos”, autenticando así solo usuario que conocen sus contraseñas.
Elaboró: Mtro. Mario Pérez Bautista Práctica 9: Registro Login en la nube
Manual de Prácticas de Desarrollo Rápido de Aplicaciones Móviles Fecha: 29-04-22

Paso6.- Verificar en firebase que el regsitro del nuevo usuario se haya registrado.

Retos a complementar:

1.- Construya una nueva ventana que se abra al oprimir el botón en ella se debe mostrar los datos
del usuario autenticado.

2.-Construya una nueva ventana que permita modificar el nombre y contraseña del usuario.

Evaluación:

La aplicación móvil Puntos

Registra en una base de datos la matrícula, nombre y contraseña que el usuario ingresa. 30
Consulta las matrículas almacenadas en la base de datos y las carga en el botón 20
desplegable.
Autentica el ingreso comparando la contraseña escrita en Login con la que se registró en 20
la base de datos.
Tiene personalizado los colores, tipos de letra, animaciones para un contexto en 10
particular.
Incluye los retos para mejorar la aplicación. 10
Se entregó en la fecha y formato indicado. 10