Aplicación desarrollada para la empresa Manusa con el SDK Flutter de Google para obtener mayor compatibilidad con dispositivos móviles y en la Web. Esta aplicación permite mediante un formulario previo crear el etiquetaje con código QR para ser descargado en formato PDF y en A4.
Uso de la aplicación y vista previa
Pantalla principal
Esta es la pantalla principal de la web. Para poder continuar presione sobre la opción GENERAR ETIQUETAS.
Pantalla del formulario
En la siguiente pantalla deberá rellenar los campos. En la sección DEFINIR DATOS DE LA ETIQUETA introduciremos el número de teléfono e identificador de puerta. También pondremos la posición por la que queremos comenzar a imprimir. Tendremos un botón para poder subo la imagen del logo, es recomendable que el tamaño de la imagen no sea elevado.
En la siguiente sección estableceremos el numero inicial y final del rango con el número de copias por cada etiqueta. Si son diferentes rangos tendremos el botón de AÑADIR más rangos. Una vez terminado le daremos a DESCARGAR PDF que tardará más o menos dependiendo del tamaño de la imagen del logo.
Modificaciones
Tras la petición de Manusa esta sección sufre la modificación de centrar su contenido. También ha sido remplazado el campo de texto de la posición por un GridView con 27 botones, uno por etiqueta que cuenta la hoja de esta manera es más visual para el usuario al elegir desde donde empieza la impresión en la hoja. Para finalizar con las modificaciones han sido añadidos textos de ayuda para el usuario.
PDF generado
Como se puede ver en la imagen tenemos el PDF con la cantidad de etiquetas y en su rango como le habíamos establecido en la imagen anterior.
Recursos y software utilizado
Dependencias
<dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
cupertino_icons: ^0.1.2
fluttertoast: ^8.0.7
path_provider: ^2.0.2
path_provider_platform_interface: ^2.0.1
universal_html: ^2.0.8
barcode_scan: ^3.0.1
qr_flutter: ^4.0.0
pdf: ^3.4.2
open_file: ^3.2.1
file_picker: ^3.0.3
plugin_platform_interface: ^2.0.1
intl: ^0.17.0>
Software utilizado
- Android Studio
- Microsoft Edge (Versión Chromium)
- Android 10
Otros recursos
Fuentes
La fuente principal es Product Sans. Los ficheros .ttf están ubicados en la carpeta Fonts.
fonts:
- family: Product Sans
fonts:
- asset: fonts/Product-Sans-Regular.ttf
- asset: fonts/Product-Sans-Bold-Italic.ttf
- asset: fonts/Product-Sans-Italic.ttf
- asset: fonts/Product-Sans-Bold.ttf
Assets
Logos de Manusa y CE. Las imágenes están ubicados en la carpeta Assets.
flutter:
uses-material-design: true
assets:
- assets/logo_manusa.png
- assets/logo_manusa_little.png
- assets/ce.png
Idiomas
Lo idiomas son los siguientes:
- Inglés
- Castellano
- Francés
- Portugués
Los ficheros .json están ubicados en la carpeta i18n
<flutter:
uses-material-design: true
assets:
- i18n/en.json #Inglés
- i18n/es.json #Castellano
- i18n/fr.json #Francés
- i18n/pt.json> #Portugués