Soluciones de Programación Móvil

24 de Mayo de 2023, Ciudad de México, México

ToolsQuick: Una herramienta de generador de rutas y

acceso a cámara

Israel Emiliano Gutiérrez Rabelo
Universidad del Valle de México
Campus Coyoacán
Ciudad de México, México
340382108
Sofía Pacheco Rodriguez
Universidad del Valle de México
Campus Coyoacán
Ciudad de México, México
340393067
Víctor Manuel Ruiz Escareño
Universidad del Valle de México
Campus Coyoacán
Ciudad de México, México
040136530
Héctor Jair Velázquez Jiménez
Universidad del Valle de México
Campus Coyoacán
Ciudad de México, México
340389707

Brenda Hinojosa Torres
Universidad del Valle de México
Campus Coyoacán
Ciudad de México, México
340384331
Nadia Samantha Peña Urbina
Universidad del Valle de México
Campus Coyoacán
Ciudad de México, México
340382583
Salvador de Jesús Pérez Morales
Universidad del Valle de México
Campus Coyoacán
Ciudad de México, México
340379947

Abstract— ToolsQuick es una aplicación móvil que ofrece al
usuario funciones principales para trazar rutas en mapas y
acceder a la cámara de fotos. Para la implementación del uso de
mapas y rutas es necesario el acceso de APIs generadas por Google
Cloud y OpenRoute Service, además de permisos otorgados para
acceder a la ubicación actual y el acceso al hardware de cámaras
y almacenamiento interno. La aplicación utiliza una base de datos
basada en documentos con el servidor de Firebase de Google para
el acceso a usuarios; permite a los usuarios registrarse e iniciar
sesión utilizando un correo electrónico válido. Presenta una
interfaz atractiva, sencilla y dinámica con elementos como
pantalla de inicio, barra de herramientas y menú principal.
Además, implementa funcionalidades para botones, textos y
elementos interactivos, brindando una experiencia intuitiva al
usuario.
Realizando el desarrollo de la app ToolsQuick, como
algunos de los trabajos a realizar, se determinaron la creación y
conexión de una base de datos, la codificación de cada elemento
como botones y textos, los cuales se presentan en este
documento, así como se describen algunos de los elementos que
se implementaron para el desarrollo de dicha app, obteniendo las
siguientes secciones: acceso a mapas y APIs, acceso a cámara,
firebase storage y funcionalidades de elementos gráficos de
layouts. Asimismo, el documento integra las secciones de
resultados, conclusiones, trabajo a realizar y bibliografía
II. DESARROLLO DE APLICACIÓN MÓVIL

Keywords—app, Firebase, interfaz gráfica, localización, mapas, A. Acceso a mapas y APIs

cámara
I. INTRODUCCIÓN
El desarrollo de aplicaciones móviles se ha
venido incrementando en la actualidad, dado el gran número
de dispositivos que existen [1]. Como ya se sabe, las apps
móviles son aplicaciones informáticas cuya finalidad es la de
poder ser ejecutadas en teléfonos inteligentes, tabletas, relojes
inteligentes u otros dispositivos móviles, con el objetivo de
permitir a sus usuarios efectuar tareas concretas de tipo
profesional, de ocio, educativas, de acceso a servicios, etc.,
facilitando de este modo las gestiones o actividades a desarrollar
[2].
El acceso a mapas en una aplicación de Android se refiere a
la capacidad de mostrar mapas interactivos dentro de la
aplicación. Esto permite a los usuarios ver y explorar
ubicaciones en un mapa, realizar búsquedas de lugares, obtener
direcciones y realizar diversas interacciones relacionadas con el
mapa.
En Android Studio, se utiliza la API de Google Maps,
otorgada por Google Cloud, para implementar esta
funcionalidad. La API de Google Maps proporciona un conjunto
de herramientas y servicios que permiten la integración de
mapas en una aplicación Android.[3]
Para implementar el acceso a mapas en Android Studio, se
siguen varios pasos:
 • Configuración del proyecto: Se debe configurar el
proyecto de Android Studio para que pueda utilizar
la API de Google Maps. Esto implica generar una
clave de API de Google Maps y configurarla en el
archivo de configuración del proyecto.
• Diseño de la interfaz de usuario: Se deben diseñar
las pantallas de la aplicación donde se mostrará el
mapa. Esto puede implicar agregar un fragmento de
mapa en una actividad o utilizar una vista de mapa
personalizada.
• Inicialización de la API: En el código de la
aplicación, se debe inicializar la API de Google
Maps con la clave de API generada previamente.
Esto permite establecer la conexión entre la
aplicación y los servicios de mapas de Google.
• Configuración de interacciones: Se pueden agregar
interacciones personalizadas al mapa, como
permitir que los usuarios marquen ubicaciones,
realicen zoom, obtengan información de ubicación
y realicen búsquedas de lugares.
• Obtención de datos de mapas: La API de Google
Maps proporciona métodos y servicios para obtener
datos relacionados con los mapas, como la
ubicación actual del dispositivo, la información de
los lugares cercanos, las direcciones de ruta y
mucho más.
B. Acceso a la Cámara
El acceso a la cámara en una aplicación se refiere a la
capacidad de la aplicación para utilizar la cámara del
dispositivo, ya sea para capturar imágenes estáticas o grabar
videos. Al permitir el acceso a la cámara, la aplicación puede
abrir la interfaz de la cámara del dispositivo para que el usuario
pueda tomar fotos o videos directamente desde la aplicación.
Esto brinda la oportunidad de capturar momentos en tiempo
real y utilizar esas imágenes o videos dentro de la aplicación
para diversas funcionalidades, como almacenar, compartir o
editar.[4]
C. Firebase Storage
Firebase Storage es un servicio en la plataforma de
desarrollo Firebase de Google que proporciona
almacenamiento en la nube para aplicaciones web y móviles.
Permite a los desarrolladores almacenar y recuperar archivos,
como imágenes, videos o documentos, de manera segura y
escalable. Firebase Storage ofrece una solución sencilla para el
almacenamiento de archivos, proporcionando una API fácil de
usar que se puede integrar en aplicaciones para cargar y
descargar archivos en la nube.
Los archivos almacenados en Firebase Storage están protegidos
y se pueden acceder y compartir fácilmente utilizando las
herramientas y bibliotecas proporcionadas por Firebase.
Además, Firebase Storage ofrece características como control
de acceso, seguridad y escalabilidad automática, lo que facilita
el manejo eficiente de archivos en una aplicación y permite un
acceso rápido y confiable a ellos desde cualquier dispositivo
conectado a Internet [5]. Para la app mencionada anteriormente
no se implementó el almacenamiento de fotos por Storage
debido a la falta apropiada de vinculación y de tiempo debido a
otros trabajos en el tercer parcial.
D. Funcionalidades de elementos gráficos
A continuación, se dará la explicación de las funcionalidades
que tiene los elementos de los layouts que contiene la app
SchoolDroid (cabe destacar pertinentemente que hay
funcionalidades que en estos momentos aún no están
codificadas, se indica a lo largo de esa sección cuáles son):
a) Main
Para este layout se implementaron los siguientes
elementos: EditText, Button y TextView. Dentro de su
archivo de Kotlin, se crean variables constantes con el
tipo de dato del elemento del layout y por medio del
método “findViewById()” se identifican a los elementos
de manera específica. Para darles una funcionalidad a los
botones se utiliza el método “setOnClickListener()”, y en
ellos se ingresa lo que harán estos.
Dado que la ventana es para el inicio de sesión se tiene
las siguientes funcionalidades:
• Al darle clic al botón “Crear cuenta nueva”, se
ingresará al layout “Registro” para la creación
de un nuevo usuario
• Al darle clic al texto “Iniciar sesión” (con la
propiedad de clickable), se ingresa al layout
“Ventana_principal” para el ingreso de la
aplicación y todas sus demás funcionalidades.
• Si los campos de correo y contraseña están
vacíos, se le notifica al usuario
• Si el usuario no está registrado en la app, se
podrá registrar en la base de datos
• Si existe un usuario registrado en la base de
datos de la aplicación, se mostrará el contenido
de la app.
b) Registro
Para este layout solo se implementaron EditText y
Button, Dentro de su archivo de Kotlin, se crean variables
constantes con el tipo de dato del elemento del layout y
por medio del método “findViewById()” se identifican a
los elementos de manera específica. Para darles una
funcionalidad a los botones se utiliza el método
“setOnClickListener()”, y en ellos se ingresa lo que harán
estos. Esta ventana tiene las siguientes funcionalidades:
• Si la contraseña se colocó de manera correcta y
sin variaciones, con un objeto de la clase
FirebaseAuth, se invoca el método
createUserWithEmailAndPassword con
parámetros de correo y contraseña ingresadas,
después se crea una instancia de la clase
FirebaseFirestore con el método getInstance();
esto con el objetivo de generar los documentos
 para la base de datos en Firebase, por medio de • Solicita y verifica que todos los permisos necesarios
un arreglo del tipo HashMap. sean aceptados con el método de
• Una vez ingresados el correo, se tiene que “allPermissionsGranted()” ,
verificar con el propósito de asegurar que el • Captura imágenes con el método de
correo es verídico, de lo contrario, no se tendrá “imageCapture”.
acceso al contenido. • Guarda los archivos resultantes en un directorio
especifico utilizando el método de
c) Ventana_principal “outputDirectory”.
Para este layout solo se implementaron TextView,
Button. Dentro de un archivo Kotlin se crean variables
constantes con el tipo de dato del elemento layout y por
III. RESULTADOS
medio del método “findViewById” se identifican a los
elementos de manera específica. Para darles una A continuación, se presentan las capturas de pantalla de cada
funcionalidad a los botones se utiliza el método ventana usada en la aplicación móvil:
“setOnClickLsitener()” y en ellos se ingresa lo que harán
estos. Esta ventana tiene las siguientes funcionalidades:
• Al darle clic al botón “Cámara” se ingresará al layout
“ventana fotos” en donde se podrá tomar fotos. Este
explicara a continuación.
• Al darle clic al botón “Mapas” se ingresará a un
nuevo layout “Ventana_mapas” para poder ingresar
tus ubicaciones.
• Al darle clic al botón “Salir” este mandara un
mensaje emergente donde le pregunta al usuario si
está seguro de salir de la aplicación.

d) Ventana_mapas
Para este layout solo se implementaron Button,
FragmentContrainerView, EditText. Dentro de un
archivo Kotlin se crean variables constantes con el tipo
de dato del elemento layout y por medio del método
“findViewById” se identifican a los elementos de manera
específica. Para darles una funcionalidad a los botones se
utiliza el método “setOnClickLsitener()” y “PolyLine”, Figura 1. Layout Main
en ellos se ingresa lo que harán estos. Esta ventana tiene
las siguientes funcionalidades:
• Al darle clic al botón de “Generar Marcador”
generas marcadores con la función de
“createMarker”.
• Al darle clic al botón de “Generar Ruta” este
• Tomará las coordenadas con su longitud y latitud
estableciendo un punto de origen y un punto final
con la función de “setOnMapClickListener”.

e) Ventana_fotos
Administra la captura de imágenes utilizando la cámara
del dispositivo Android. Configura la vista previa de la
cámara, permite cambiar entre las cámaras frontal y
trasera, solicita permisos necesarios, captura imágenes y
guarda los archivos resultantes en un directorio
específico.
• Permite cambiar entre las cámaras frontal y trasera
utilizando los métodos de “hasBackCamera()” y
“hasFrontCamera()” dependiendo de lo que el
usuario elija. Figura 2. Layout Registro
Figura 3. Layout Ventana_principal Figura 5. Ventana_fotos

IV. CONCLUSIONES
La aplicación "ToolsQuicks" desarrollada por nuestro
equipo, que combina funciones de localización y una cámara
para tomar fotos, es que fue un desafío emocionante y exitoso.
Durante el proceso de desarrollo e implementación, enfrentamos
numerosos obstáculos técnicos y trabajamos arduamente para
superarlos. La integración de la localización y la función de la
cámara nos permitió crear una aplicación poderosa y versátil.
Como equipo, enfrentamos estos desafíos con determinación
y trabajo en equipo. Cada miembro contribuyó con sus
habilidades y conocimientos para superar los obstáculos
técnicos y lograr una implementación exitosa de las funciones
de localización y cámara en la aplicación "ToolsQuicks".
Al final, el resultado fue una aplicación completa y funcional
que cumple con las expectativas de los usuarios. Estamos
orgullosos del trabajo que hemos realizado y de cómo hemos
logrado combinar tecnologías complejas en una interfaz de
usuario intuitiva y fácil de usar. "Tools Quicks" se ha convertido
en una herramienta útil para aquellos que desean capturar
momentos preciosos mientras obtienen información geográfica
importante.
En general, el desarrollo y la implementación de esta
aplicación nos han enseñado valiosas lecciones sobre trabajo en
equipo, resolución de problemas y optimización de rendimiento.
Figura 4. Layout Mapas
Estamos entusiasmados por el resultado final y confiamos en
que "ToolsQuicks" será bien recibida y apreciada por los
usuarios que buscan una experiencia única de captura de fotos
geolocalizadas.
 V. TRABAJO A REALIZAR [5] Back4App, «¿Qué es Firebase Storage y cómo funciona?,»
Para mejorar la aplicación "ToolsQuicks", tenemos la Blog de Back4App, 2023. [En línea]. Disponible en:
intención de implementar una función en la que la cámara pueda https://blog.back4app.com/es/que-es-firebase-storage-y-como-
tomar una foto en cualquier lugar y la función de localización funciona/. [Accedido: 23-May-2023].
identifique automáticamente el lugar y muestre al usuario la [6] Google, «Polygon Tutorial,» [En línea]. Disponible en:
ubicación exacta en la que se encuentra. Además, nos https://developers.google.com/maps/documentation/android-
enfocaremos en reforzar la seguridad de los usuarios. sdk/polygon-tutorial?hl=es-419
En cuanto a la seguridad, planeamos implementar en
proteger la privacidad de los usuarios al capturar y compartir sus
fotos geolocalizadas. Implementaremos medidas de privacidad
que permitan a los usuarios controlar la visibilidad de sus fotos
VII. ANEXO
y ubicaciones, brindándoles opciones para compartir de manera
selectiva o mantener sus momentos privados.
En estas funciones de seguridad y privacidad formarán parte QR con los ficheros codificados:
integral de nuestra estrategia de mejora de "Tools Quicks". Nos
comprometemos a garantizar que los usuarios puedan disfrutar
de todas las funciones de la aplicación de manera segura y
confiable, sin preocupaciones sobre la privacidad de sus datos o
la seguridad de su información personal.Para mejorar la
seguridad de los usuarios en situaciones potencialmente
peligrosas, planeamos implementar una función de seguridad
adicional en la aplicación "Tools Quicks". Esta función podría
incluir un botón de emergencia o una opción de alerta que los
usuarios puedan activar en caso de emergencia, como un
secuestro o una situación de riesgo.
Al activar esta función, la aplicación podría enviar una
notificación de emergencia a los contactos predefinidos del
usuario, proporcionando información sobre la ubicación actual
y posiblemente transmitiendo imágenes o videos en tiempo real
para ayudar a identificar la situación. También podríamos
integrar una función de llamada de emergencia directa a los
servicios de emergencia locales.
QR del video demostrativo:

VI. REFERENCIAS

[1] I. M. Argote Puetaman, et. al, «Desarrollo de Apps: un

estudio comparativo entre frameworks libres y privativos,»
Boletín Informativo CEI, vol. 3, nº 2, p. 44, 2016
[2] E. Amengual, et. al., «Hacia un Marco de Desarrollo para
Apps Móviles,» 2011. [En línea]. Disponible en:
https://biblioteca.sistedes.es/submissions/uploaded-
files/JISBD_2017_paper_34.pdf. [Último acceso: 11 abril
2023].
[3] Google. (2021). «Google Maps Android SDK,» [Online].
Disponible en:
https://developers.google.com/maps/documentation/android-
sdk/start?hl=es-419 [Último acceso: 23 de mayo de 2023].
[4] Android Developers, «CameraX overview,»
Documentación de Android, 2023. [En línea]. Disponible en:
https://developer.android.com/training/camera/cameradirect?hl
=es-419. [Accedido: 23-May-2023].