En aquest apartat trobarem com accedir a les dades d'una taula en un full de càlcul de Google Sheets des d'App Inventor, així com mostrar les dades obtingudes.

Més concretament es pretén donar resposta a les preguntes següents:

• Com podem fer consultes a la taula des d'App Inventor?
• Quin bloc d'App Inventor ens permet accedir a les dades?
• Com podem utilitzar el component ListPicker per seleccionar informació?

Per accedir al full de càlcul ho farem via el script que hem vist a l'apartat anterior. Pel què fa a la URL del script, el més pràctic és definir una constant a App Inventor per fer-ne referència sempre que la necessitem:

Què farem ara? Farem una consulta a la taula, de manera que ens mostri un llistat de tots els registres que acompleixin la condició que haguem definit, en triarem un i ens l'ensenyarà en una fitxa. El disseny de la pantalla a App Inventor serà la següent:

Apart de les etiquetes i quadres de text que ens permetran visualitzar informació, també utilitzarem un objecte imatge mitjançant el qual mostrarem la imatge corresponent a l'alumne consultat i un parell d'objectes no visibles: un objecte de tipus Web i un altre de tipus ActivityStarter.

Un altre element que no es visualitza a la pantalla és un ListPicker, amb la propietat Visible a fals, que utilitzarem per recollir el resultat que ens retorni la consulta al full de càlcul.

Per fer una consulta a la taula del full de càlcul mitjançant el script lligat al document, podem usar aquests paràmetres:

• query: tipus de consulta (select, insert, update, delete, count o fields). Paràmetre necessari.
• from: nom del full de càlcul (pestanya inferior). Només cal incloure'l si es treballa amb més d'una taula.
• where: nom del camp sobre el qual es vol fer la consulta. No cal incloure'l si es volen seleccionar tots els registres.
• is: valor que ha de tenir el camp triat per seleccionar el registre.
• isnot: valor que no ha de tenir el camp triat per seleccionar el registre.
• and: nom d'un segon camp que ha de tenir un valor determinat per seleccionar el registre.
• or: nom d'un segon camp que condiciona la selecció del registre a que almenys un del camps tingui un valor determinat.
• equal: valor que ha de tenir el segon camp quan la consulta inclou els paràmetres and o or.
• order : en una consulta de tipus select, nom del camp que servirà com a criteri d'ordenació dels registres seleccionats.
• values: valors que s'han d'assignar als registres. Només cal incloure'l en les consultes insert i update.

El component Web cridarà al script mitjançant la seva URL, seguida dels paràmetres anteriors. Per exemple, la consulta

scriptURL?query=select&where=Nivell&is=Tercer

retornaria la informació de tots els alumnes que cursen tercer de primària.

En el nostre cas, veiem que a la part superior de la pantalla se'ns demana el nivell educatiu. Haurem de construir una URL en funció del contingut d'aquest TextBox i fer la consulta a la taula. Això ho farem de la següent forma:

L'execució d'aquesta consulta ens retornarà un llistat amb tots els alumnes que estan al nivell seleccionat. Aquest llistat està en format JSON.

En general, el nom dels camps i/o els valors corresponents contindran espais, accents o caracters que no estan permesos en una URL. Serà necessari, doncs, codificar-los en ASCII mitjançant el bloc

Com que volem poder seleccionar un registre, els afegirem tots a un ListPicker. Ara bé, en lloc d'afegir tots els camps, visualitzarem només el Nom i el Nivell. Això ho farem creant una llista buida en el ListPicker i, per a cadascun dels registres, hi afegirem el contingut dels camps seleccionats. Finalment obrirem el ListPicker per poder triar la persona que vulguem.

Val a dir que si mirem el disseny de la pantalla no trobarem cap ListPicker, però si ens fixem bé en el llistat de components allà si que n'hi ha un. Hem dissenyat l'app de manera que no hi ha cap necessitat d'accedir al ListPicker manualment, per la qual cosa l'hem definit com un component ocult. Això ho hem fet establint com a hidden la seva propietat Visible.

Quan es fa una consulta mitjançant el component Web, normalment es triga uns quants segons en obtenir la resposta. Per tal que l'usuari en sigui conscient, és molt recomanable incloure un component Notifier. Es mostraria abans de la consulta, i s'ocultaria quan s'obtingués la resposta:

Un cop hem triat la persona que volíem del llistat, el que hem de fer ara és mostrar tota la seva informació en els camps corresponents. Això ho fem agafant el SelectionIndex del ListPicker i utilitzant-lo en la llista on tenim tots els registres.

La visualització de l'aplicació en un dispositiu mòbil quedaria de la següent forma:

Finalment, i com que tenim l'adreça, hem afegit un botó en el disseny de la pantalla per situar en un mapa de Google aquesta adreça. Això ho fem de la següent manera: