Aplicacions amb Flutter, Dart i Flame

Tutorial Flutter Flame Projectes   Recursos CITCEA
Exemples Dart Dades pràctiques     Inici

Provar en el dispositiu Android

Per generar l'aplicació cal anar al terminal de Visual Studio Code (recordem que està en una de les pestanyes de la finestra inferior) i escriure:

flutter build apk --split-per-abi

Això iniciarà el procés de creació de l'aplicació, que finalitzarà (si tot va bé) creant tres fitxers.

Pantalla del terminal

Nosaltres teníem el projecte creat a la carpeta resistled_app dins de la carpeta development general. Els fitxers creats els tenim a:

X:\development\resistled_app\build\app\outputs\flutter-apk\
Arbre de carpetes

En aquest cas, ha creat tres fitxers:

app-arm64-v8a-release.apk
app-armeabi-v7a-release.apk
app-x86_64-release.apk

Podem provar, per exemple, el primer i si dona problemes es pot provar amb un dels altres dos. Els noms dels fitxers creats poden no coincidir.

Aquest fitxer l'hem d'enviar al nostre dispositiu. La manera més ràpida és per cable, però no sempre és factible. Es pot penjar l'aplicació al núvol (per exemple a Google Drive) i descarregar-la d'allà. Teòricament es pot enviar per correu electrònic (si la mida no és molt gran) però hi pot haver servidors de correu que bloquegin els fitxers instal·lables. Un cop descarregada, s'ha d'instal·lar. Pot passar que el dispositiu tingui bloquejades les aplicacions que no s'hagin descarregat de Play Store. Si és així, cal anar Ajustaments, entrar a Aplicacions i dir-li que permeti instal·lar aplicacions des d'orígens desconeguts.

Si tot ha anat bé, la nostra aplicació hauria de funcionar com a l'emulador.

Canviar la icona i el nom de l'aplicació

En el nostre dispositiu, l'aplicació es mostrarà amb una icona predefinida que porta la icona de Flutter i un nom que es correspon al que vam donar al projecte.

Icona per defecte

Per canviar el nom (sense canviar el del projecte) hem d'anar al fitxer AndroidManifest.xml, que trobarem a la ruta:

X:\development\resistled_app\android\app\src\main\

En aquest fitxer, dins del bloc application hi podem trobar l'etiqueta android:label amb un text entre cometes, que substituirem pel nom que desitgem que surti a la pantalla del nostre dispositiu; per exemple, Resist_led.

Abans de canviar la icona, necessitem tenir-ne una. La icona es pot fer amb qualsevol programa gràfic o bé cercar-ne una a internet. La imatge ha de ser quadrada i tenir format PNG. En el nostre cas, farem servir aquesta:

Icona proposada

Per canviar la icona hem d'anar a la ruta:

X:\development\resistled_app\android\app\src\main\res\

On trobarem diverses carpetes que tenen el nom començat per mipmap. En cada una d'elles trobarem la iocona per defecte. Hem de substituir-la per la nostra, però mantenint el mateix nom.

Un cop fer això, podem tornar a generar l'aplicació; que ja tindrà un aspecte més professional.

La icona ens quedarà:

Icona final

I una vista de la pantalla real:

Icona proposada

 

 

 

 

 

 

 

 

 

 

Llicència de Creative Commons
Aquesta obra d'Oriol Boix està llicenciada sota una llicència no importada Reconeixement-NoComercial-SenseObraDerivada 3.0.