# data[].attributes.attachment_link.readable_text
Accediu als mapes en qualsevol moment

Trobeu tots els vostres mapes al menú Els meus llocs de Google Maps.

El vostre món, els vostres mapes

Creeu mapes dels vostres llocs preferits o exploreu ciutats noves.

Descobriu noves destinacions

Deseu els mapes que trobeu al web i consulteu-los sigueu on sigueu.

# data[].attributes.attachment_link.description
Accediu als mapes en qualsevol moment Trobeu tots els vostres mapes al menú Els meus llocs de Google Maps. El vostre món, els vostres mapes Creeu mapes dels vostres llocs preferits o exploreu ciutats noves. Descobriu noves destinacions Deseu els mapes que trobeu al web i consulteu-los sigueu on sigueu.

# data[].attributes.headline
Bases de dades utilitzant full de càlcul 

# data[].attributes.subject
Bases de dades utilitzant full de càlcul 

# data[].attributes.attachment_link.readable_text
Accedir a les dades

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:

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:

Disseny de la pantalla

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.

És important que posem un nom suficientment clar a cadascun dels elements que farem servir des de l'entorn de programació. En aquest cas tots els TextBox tenen un nom que comença per "TB" i tots els Button tenen un nom que comença per "B".

Consulta a la taula

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

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.

Tot i que el nom dels paràmetres és similar al de consultes tipus SQL, les funcionalitats que ofereix el script són molt més limitades. Consulteu el llistat de consultes possibles on s'inclouen exemples d'ús.

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

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.

Un ListPicker és una llista desplegable on es pot triar un element. El ListPicker es pot omplir dinàmicament a partir d'un origen de dades, o també es pot omplir amb valors escrits directament al codi amb la propietat Elements.

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:

Visualització de la informació

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:

# data[].attributes.attachment_link.description
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: Per accedir al full de càlcul ho farem via el script que hem vist a l' apartat anterior.

# data[].attributes.attachment_link.description
App Inventor snippets, tutorials, links and App Inventor extensions directory.

# data[].attributes.attachment_link.readable_text
App inventor 2 en español

Cómo programar los teléfonos móviles con Android
mediante App inventor 2 - Juan Antonio Villalpando
____________________________ ________________________________________________________
- Índice del tutorial:

Colabora en el mantenimiento de esta web. - Si te gusta este sitio web y quieres colaborar en su mantenimiento, puedes donar unos 7€ o 7$ mediante este enlace de Paypal: - Ayuda con códigos básicos. Si necesitas ayuda para realizar un código básico que te has propuesto construir, puedo colaborar en esa ayuda por un pequeño aporte, escríbeme a mi correo: juana1991@yahoo.com

Propuestas.
Servidor Web en tu ordenador

- En esta página he puesto una serie de propuestas de códigos, no he puesto la solución, para que lo hagas por tí mismo.

101.- Propuestas de códigos
102.- Servidor Web en tu ordenador. Servidor de FTP. Tu servidor en Internet.

La aplicación del mes.

- App Inventor de la MIT publica en su web la "Aplicación del Mes", es un concurso cuyo premio es simplemente la publicación de tu aplicación en su web. Hay tres categorías: menores de 13 años, de 13 a 20 y mayores de 20.

.

2V5.- notAIreadyHandled.

2 Z.- Refrescar la pantalla.

7E2.- JUEGO : Lienzo.

5 .- JUEGO: Caer Bola.

. Las Constelaciones. Lienzo.

3

8N2 D (II)

FireBaseDB y CloudDB con App Inventor

- Los dos componentes son similares, FirebaseDB pertenece a su propia empresa y CloudDB es mantenida por el equipo de App Inventor en la MIT.

8K.- FirebaseDB y CloudDB. Estado de la aplicación. OnResume. OnStop. OnPause.

8L.- FirebaseDB. Base de datos.

8 M

8 N .- FirebaseDB. Realtime. Formulario con Google Sheets.

---------------------------------------------------------------------------------------------------------- Los tutoriales del 1 al 5 solo son para ver algunas de las posibilidades de Firebase. Se recomienda ver, copiar, pegar,... pero no es necesario estudiarlos ya que son complicados para alguien que comienza. En el siguiente tutorial se explica con más detalles.

1.- Chat.
2.-Drawing. Dibujo compartido en una página web.
3.-Presence. Ver quién está conectado.
4.-LeaderBoard. Tabla de puntuaciones.
5.-Tetris. Juego del Tetris online.

----------------------------------------------------------------------------------------------------------
8H.-FirebaseDB. Mensajes entre 4 amigos. App inventor y web. (1ª parte)

8I.- FirebaseDB. Mensajes entre 4 amigos. App inventor y web. (2ª parte)
8J.-FirebaseDB. Cambiar color de botones.

También con CloudDB

6.- Cosas importantes.
7.- Base de datos con Firebase en la web
.8.- Base de datos con borrado de elementos desde la web.
9.- Baja y copia toda tu base de Firebase a tu ordenador, modifícal a y vuelve a subirl a . JSON.
10.- Probar nuestra aplicación de App Inventor, .apk en distintos móviles.
Mini tutorial del tutorial. 100.- Guardar información básica en la base de datos. Set y Push. Sobreescribir. Crear nuevo registro.
102.- Leer información de la base de datos.
103.- Otra manera de leer los datos.
104.- Obtener los datos ordenados.
105.- Leer información de la base de datosactualizados automáticamente.
106.- Crear cuenta. Pasar datos desde el formulario htm al script. Autentificarse.
108.- Permisos de lectura y escritura.
110.- LeaderBoard simplificado. Base sin clave key.
120.- Otro chat.
140.- Se envían datos y se muestran en una gráfica web en tiempo real.
150.- Firebasestorage. JavaScript.

Colabora en el mantenimiento de esta web. - Si te gusta este sitio web y quieres colaborar en su mantenimiento, puedes donar unos 7€ o 7$ mediante este enlace de Paypal: - Ayuda con códigos básicos. Si necesitas ayuda para realizar un código básico que te has propuesto construir, puedo colaborar en esa ayuda por un pequeño aporte, escríbeme a mi correo: juana1991@yahoo.com

Android y Arduino por Bluetooth

1.- Bluetooth y Arduino.
Proyecto cochecito - 3
3.- Bluetooth y Arduino.Proyecto cochecito - 1

2.- Bluetooth y Arduino. Proyecto cochecito - 2

9A0- Resumen Bluetooth
9A1.- Conexión automática.Ejemplo Foro Community.

9A1.- App Inventor envía información al Arduino. Distintas formas de recibirlo. readStringUntil.

9A1A.- App Inventor pide temperatura al Arduino. Sin reloj. readStringUntil.

9A.- Bluetooth, Arduino y App Inventor. App Inventor envía información al Arduino. Básico.

9AA.- Bluetooth, Arduino y App Inventor. App Inventor envía información al Arduino y este le devuelve información.

9A 2 Envía y recibe información automáticamente.

9A Envía y recibe información automáticamente. Temporizado. 3

un botón en App Inventor, se envía continuamente un caracter a Arduino.

9B.- Bluetooth y Arduino. Potenciómetro. Ultrasonido. Humedad-Temperatura. JoyStick. Teclado. Arduino a App.

9BB.- Bluetooth y Arduin SIN Reloj. Básico. o. Potenciómetro, gráfico din á mico.

9B C o. Simulación de un Electro Car diograma.

9B0.- App Inventor envía un número y Arduino le devuelve el doble. SIN Reloj. Básico.

9B1.- Bluetooth y Arduino. Solicita Temperatura o Humedad. SIN Reloj. Básico.

Sin reloj. readStringUntil

9B3.- App Inventor envía Bytes en binarios, Arduino los recibe y envía respuesta de recibido. Básico.

9B4.- Arduino envía valores muy rápidamente a App Inventor. Bluetooth. Básico.

9A0.- Monitor Serie en RX/TX. Bluetooth en otros terminales. (I) Importante.

9A.- Dónde conectar el módulo Bluetooth. RX/TX. Serial. (II) Importante.

9I2.- App inventor, Bluetooth, Arduino. Encender/apagar varios LED. Casilla de verificación.

9J1.- App inventor, Bluetooth, Arduino. Enviar varias palabras. CasillaDeVerificación. Deslizador.

9L2.- Enviar un archivo por Bluetooth a Arduino. Tarjeta SdCard.

9L 3 .- Enviar un archivo por Bluetooth a ESP32. Tarjeta SdCard.

9U.- Multitouch con 4 teclas, Arduino, Bluetooth y App Inventor.9V.- Amplificador Bluetooth. Enviar y recibir sonidos.

9Z.- El Robot Otto. Impresora 3D. 4 Servos. Diseño. Bluetooth. INTERESANTE PROYECTO ESCOLAR.

9A1.- Bluetooth. ReconocedorDeVoz. Lector de QR.

9A2.- Bluetooth, App Inventor envía información automáticamente.

-------------------------------------------------------------------------------------

Comunicación en Serie con un cable OTG en el conector USB. Arduino.

12C.- Youtube a pantalla completa.

19 D Añadir un contacto .

20 E

20 I.- Croma Key.

.30D.- Elementos sin repetir. Lista.
40F5.- Cualquier componente VIII. Matriz de botones 6 x 6.
40H.-

45.-

46.- JUEGO:

47B.- JUEGO 2 m óviles

73.- Cargar archivo CSV

7 5 .- Cargar archivo JSON (I)

--------------------------------------------------------------------------------------

- Tips & Tricks.

125.- Extensiones 2.

126.- App inventor y LINUX. ADB. Conectarse de Windows a App inventor.-------> ¡¡¡ Pronto !!!
-------------------------------------------------------------------------------------------------

- Se trata de vincular App inventor con bases de datos MySQL mediante PHP. Mediante PHP y MySQL puedes guardar, obtener, cambiar,... información en una base de datos.

Crear extensiones. Códigos fuentes.
Create extensions. Source code.

- En estos tutoriales vamos a ver de una manera sencilla la forma de crear extensiones.

125C.- Processus simple pour créer une extension. Théorème de Pythagore. Unir Textes.

146.- Archivos dentro de la extensión. Rush.

225.- Teorema de Pitágoras. Unir Textos. Índice de masa muscular.
228.- Pasar de ASCII a carácter y viceversa. Obtener números aleatorios sin repetición.
230.-Encender linterna.
231 232.- Consultar si los datos vienen por WiFi o por red de datos.
235.-Ver la IP local. Frecuencia del Wifi. Nivel de señal. Información de la batería. .- Obtener información del teléfono. TelephonyManager.
235C.-Obtener un listado de paquetes instalados. Dirección de ejecución.
235B.- Obtener las IP, Mac y fabricantes de una red local.
235F.-User agent.
235D.-Obtener la versión de Android y su API.
238.-Obtención de luminosidad con el sensor de luz del móvil.
239.-Generador de sonido con tiempo y frecuencia. Sonidos pre establecidos en Android.
239C.-Obtener el nivel de sonido del micrófono. VUmeter.
239D.-Obtener la frecuencia de sonido del micrófono. Pitch.
241.-Notificador ubicable. Toast.
242.-Bluetooth. Activar. Desactivar. MacAddress Bluetooth.
244.-Instalar una aplicación. Cada vez que arranque una aplicación avisa si hay una nueva versión.
247.-Obtener código fuente de una página web. Obtener colores rojo, verde y azul de una imagen.
2 251.- Geofence. JavaScript. Extensión.
254.-Elegir el directorio donde se guardará las fotos de la Cámara.
255.-Obtener y copiar la TinyDB en un texto. Aplicación funcionando en el Companion o instalada.
256.- Obtener toda la TinyBD y guardarla en un archivo de texto.
257.- TinyBD extendida. Diferencia entre varias TinyBD.
258.- Convertir un número a texto en inglés, francés, español e italiano.
260.-Servidor Web. Servidor Web con NanoHTTPD.
274.-Cliente FTP. Subir y bajar archivos. Crear y borrar directorios.
257B.- TinyBD extendida guardada en CloudDB. 275B. Descomprimir archivos .zip con subdirectorios. Obtener la hora de un servidor NTP. Zona horaria.
2
278.-Ejecutar comandos del Shell. Terminal LINUX.
278B.-Dónde está la TinyDB. Estudio. Caché. Shared_prefs.
278C.- Dónde están los archivos internos de la aplicación. Estudio.
280.- Explorador de archivos y directorios.
282.- Explorador de archivos y directorios. Con operaciones de copiar, mover, borrar,... (No está)
284B.-Convertir archivo pdf a imagen.
284C.- Crear archivo pdf. Leer archivo pdf.
285.- Obtener los SMS, para borrarlo es necesario que esté por defecto.
285B.-Comprobar si está activado el GPS.
285C.- Sensor de localización. Geo localización. Campo magnético.
77.-
291.-Temporizador. Bucle For Next con Pausa. Por cada elemento de una Lista. Segundo plano.
291B.-Notificador en la barra superior. Pausa. Iniciar otra aplicación. Segundo plano.
291C.- Notificacion en la barra superior. Enviar mensaje de actualización.
291D.-Notificacion en la barra superior. CloudDB. Segundo plano.
292.-Obtener la posición del cursor en un CampoDeTexto. Poner cursor. Longitud del texto.
293.-Hacer click en una imagen y etiqueta.
293A.-Poner GIF animado y poder hacer click sobre él. (Recomendado).
293B.-Poner GIF animado y poder hacer click sobre él.
293C.-Crear GIF animado.
293D.- Cortar vídeo.
294C.-Crear VisorWeb por código. Bajar archivo.
294D.-Abrir WhatsApp con un mensaje preparado para enviar. Añadir usuario la lista de teléfonos.
294E.-Crear CampoDeTexto por código. Mejorado.
294F.- Crear Etiqueta por código. Mejorado.
294G.- Crear CasillaDeVerificación por código. Mejorado.
294H.-Crear Botón por código. Mejorado. 294J.- 294K.-
294.-Crear botón, etiqueta o cajadetexto por código. Se puede hacer click sobre ellos.
Crear Teclado mediante código. Create Keyboard extension App Inventor.Crear Deslizador mediante código. Doble rango. Deslizador Vertical. SliderVertical.
294L.- Mover Layout. Mover imagen. Rotar Disposición.

295.-Multitouch 3, 4 y 9 botones.
296.-Multitouch estudio de coordenadas. Piano.
298.-Multitouch en Lienzo.
299.-Zoom imagen en Lienzo.
299B.-Zoom imagen sin Lienzo. Pasar imagen a String y viceversa. 299G.-
299F.-Extensión. QR Green Pass. Decodificación.
Extensión. Decodifica Json. JsonPath. Convertir XML a JSON y JSON a XML.
299H.-Extensión. Dibujar un gráfico dinámico. Desplazamiento a la izquierda.
299 I 299L.- Extensión. Apagar sonido. Mute/UnMute. .- Extensión. FFT. Nivel de sonido. Forma de onda.
299 J .- Extensión UDP. Chat por Voz. Audio UDP. WiFi.
299 K .- Extensión UDP. Chat por Texto. UDP. WiFi.
Base 64. Subir imagen a Internet. Guardar en TinyBD. Sitio web local. CloudDB.
276.- 50.- Extensiones. Geofence. Cuadrilátero. Polígono. UTM.
Borrar una serie de caracteres en un texto. Localización mediante la antena de conexión al teléfono. CellID. Nivel de señal.

235E.-Obtener la frecuencia del Wifi.
259.-Cambiar unos caracteres por otros.
259B.-Formatear números en miles y decimales.
259C.-Yail. YailList. Ejemplos.
275.Descomprimir archivos .zip y .gz. 285D.- NMEA. $GPRMC, $GPGGA, $GNRMC y $GNGGA
287.-Gradiente de colores en un Disposición.
287B.-Subir archivo gpx a strava.
287C.-Rellenar imagen. Flood Fill
290.-SelectorDeImágenes con más de 10 imágenes. ImagePicker.
299C.-Borrar caché de la aplicación.
299D.- Disminuir el tamaño de un archivo de imagen.
299E.- FaceMesh. Facial recognition. Reconocimiento facial. Detect what makes your face.

- Los Servicios son tareas ocultas pero en funcionamiento, estas tareas están pendientes de algún cambio, cuando éste se produce se envía una señal al sitio que corresponda.- Por ejemplo Whatsapp trabaja como servicio, está funcinando de forma oculta, cuando alguien nos envía un mensaje obtenemos una Notificación.- App Inventor no trabaja con Servicios, pero podemos trabajar con aplicaciones en segundo plano, es decir la aplicación está abierta y aunque apagemos el móvil (me refiero a dormirlo, hibernarlo) la aplicación estará activa.

150.- Prueba con Keep Alive Extension.

------------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- -------------------------------------------------------------------------------------------------

__________________________________

# data[].attributes.attachment_link.title
App inventor español. Offline. Tutorial. Ejemplos. Instalación. Códigos. Juegos. Curso gratis de App inventor.

# data[].attributes.attachment_link.description
App inventor 2 en español Cómo programar los teléfonos móviles con Android mediante App inventor 2 - Juan Antonio Villalpando ____________________________ ________________________________________________________ - Índice del tutorial: Colabora en el mantenimiento de esta web. - Si te gusta este sitio web y quieres colaborar en su mantenimiento, puedes donar unos 7€ o 7$ mediante este enlace de Paypal: - Ayuda con códigos básicos.

# data[].attributes.attachment_link.readable_text
Ens aquest apartat explicarem com podem publicar les nostres aplicacions a Google Play per fer-ne difusió.

Respondrem a les següents preguntes:

Obtenim els fitxers per poder-ne fer difusió

Un cop disposem de la versió definitiva de la nostra app en podem obtenir un parell de fitxers mitjançant els quals en podrem fer difusió.

Per una banda podem descarregar-ne el codi font, acabat en l'extensió .aia mitjançant l'opció Projects → Export selected project (.aia) to my computer.

Si distribuïm la nostra aplicació en aquest format donem l'opció que altres usuaris puguin veure com està creada i si els interessa, que la puguin editar.

Una altra opció per descarregar la nostra aplicació és usant l'opció Build del menú superior. En aquest menú hi ha dues opcions.

La primera opció del requadre, App (provide QR code to apk), ens permet descarregar l'apk en el nostre dispositiu i arrencar la instal·lació d'una forma força àgil.

No utilitzeu aquest codi QR de descàrrega com a mètode per fer-ne difusió ja que tan sols és valid per un període molt reduït de temps.

La segona opció, App (save apk to my computer), ens permetrà obtenir un arxiu mitjançant el qual podrem instal·lar l'app en qualsevol dispositiu.

Aquest arxiu el podreu difondre pel mitjà que vulgueu: webs amb repositoris, botigues virtuals d'aplicacions, correu,....

En cas que en feu difusió fora d'una botiga virtual d'aplicacions reconeguda pel vostre dispositiu, cal que habiliteu l'opció que us permet instal·lar aplicacions adquirides fora d'aquestes botigues.

Publiquem a Google Play

Per publicar la nostra app en una botiga com Google play caldrà seguir les següents passes:

L'usuari associat al compte d' xtec no permet publicar a Google Play. Per publicar hem d'usar un usuari gmail genèric o d'un domini que tingui aquesta opció habilitada.

Com es veu en la part inferior de la imatge anterior, la publicació a Google Play ni és gratuïta, té un cost que hem d'abonar en crear el compte, ni està exempta d'altres condicionants. Cal revisar les condicions abans de continuar.

Per continuar amb l'explicació considerem que ja hem acceptat totes les condicions i hem abonat les despeses que demanen.

Un cop estem correctament validats, arribem a una finestra en la qual podem decidir publicar una aplicació,

El primer que ens demana és la llengua per defecte de l'app i el nom de l'app.

Un cop introduït el nom i acceptat anem a una finestra que ens permetrà gestionar diferents aspectes de l'app. Haurem de completar totes les opcions que tenen un signe d'admiració al costat. A mida que les anem completant correctament ens apareixerà un símbol de check.

En aquesta pàgina introduïm dades relatives a l'app.

1. Product details: Ampliem la descripció de la nostra app.

2. Graphic Assets: Informació gràfica sobre la nostra app. Cal facilitar almenys un parell d'impressions de pantalla de l'app i la icona.

3. Categorization: Classifiquem la nostra app en funció de dos conjunts de paràmetres. Com que cal haver pujat abans l'arxiu apk, aquest punt el podem deixar pendent per més endavant.

4. Contact details: Dades de contacte del publicador.

5. Privacy Policy: Determinar si definim una política de privacitat. Podem optar per no definir-ne cap i acceptar la que ens ofereix per defecte Google Play.

Pugem l'apk a Google Play mitjançant l'opció lateral Versions de l'aplicació. Per fer-ho, cal tenir activat el servei de signatures que podem activar en aquest moment.

Desem els canvis mitjançant el botó Desa i cliquem el botó Examina els fitxers per carregar la nostra app.

Un cop completat el pas anterior podem anar a l'opció Classificació del contingut per categoritzar la nostra app.

Un cop completat gravem el qüestionari i demanem que ens calculi la classificació de l'app. El resultat serà semblant al següent en funció de les respostes que haguem donat:

Apliquem la classificació i veurem el següent:

Definim l'opció Preus i Distribució. És la darrera opció obligatòria que hem de complimentar del menú de l'esquerra. En aquest apartat definim els següents aspectes:

1. Distribució de pagament o gratuïta: Si escollim gratuïta més endavant no la podrem canviar a pagament.

2. Països en els quals es distribuirà l'app

3. Categories de dispositius en els quals es pot utilitzar l'app

4. Programes de promoció: En funció dels usuaris potencials de l'app, la podem incloure o no en algun programa en concret.

Un cop completat i gravat l'apartat anterior ja podem passar a publicar l'app. Tornem a l'opció Versions de l'aplicació i escollim l'opció Llançament.

Veurem que estem a l'espera de la validació per part de Google Play

El procés de publicació pot trigar algunes hores abans que no es completi. Un cop completat, veurem que si ha estat acceptada en la pantalla on tenim el llistat de les apps que hem publicat,

i en aquest cas, podrem consultar la fitxa de Google Play.

# data[].attributes.attachment_link.description
Ens aquest apartat explicarem com podem publicar les nostres aplicacions a Google Play per fer-ne difusió. Respondrem a les següents preguntes: Obtenim els fitxers per poder-ne fer difusió Un cop disposem de la versió definitiva de la nostra app en podem obtenir un parell de fitxers mitjançant els quals en podrem fer difusió.

# data[].attributes.attachment_link.title
09 AppInventor. Pantalla inicio y temporizador

# data[].attributes.attachment_link.description
About App Inventor Our Team Master Trainers App of the Month Release Notes Terms of Service

# data[].attributes.attachment_link.title
COMO HACER UN SELECTOR DE HORA Y FECHA EN APP INVENTOR 2

# data[].attributes.attachment_link.title
App inventor   Botones que dirijan a redes sociales o paginas web que tu quieras HD

# data[].attributes.attachment_link.title
App Inventor 2 Multiple Choice Mathe App

# data[].attributes.attachment_link.description
Proyecto: Sistema interactivo para promover la cultura del reciclaje, realizado con App inventor. Si les interesa saber cómo se realizó ésta App y quieren que haga un "Tutorial" comenten

# data[].attributes.headline
Seleccionar informacion casillas de verificacion - preguntas /respuestas

# data[].attributes.subject
Seleccionar informacion casillas de verificacion - preguntas /respuestas

# data[].attributes.attachment_link.title
App inventor Casilla de verificación Selector de Lista Casilla de verificación Menú

# data[].attributes.attachment_link.description
App inventor 2 en español Cómo programar los teléfonos móviles con Android.
Ejemplos de App inventor 2 - Juan Antonio Villalpando

# data[].attributes.attachment_link.title
Crear App de notas simple con App Inventor 2

# data[].attributes.attachment_link.readable_text
Nuestro objetivo es generar la factura correspondiente a la recarga de combustible de un cliente, de modo que calcule su importe, el importe del IVA y el total. Adicionalmente, enviaremos dicho importe por e-mail.

Para ello usaremos varios componentes interesantes, tales como Listpicker (Listas de selección), Notifier (mensajes emergentes) y ActivityStarter (Arranque de actividades), con el que lanzaremos la aplicación de correo electrónico del teléfono.

En un primer momento dispondremos en el diseñador los siguientes componentes, por este orden:

1. Pondremos el título de Screen1 a Factura de combustible.

2. Dispondremos un . En su propiedad ListPicker con el texto Seleccione combustible ElementsFromString pondremos Súper 95, Súper 98, Gasóleo A. Esta es una cadena que contiene los elementos de la lista que aparecerán al pulsar sobre el botón del ListPicker, elementos que se delimitan separándolos por comas. Este componente permitirá al usuario seleccionar el tipo de combustible.

3. Dispondremos un TableArrangement estableciendo sus propiedades Columns (columnas) a 2 y Rows (filas) a 4, En él dispondremos los 4 próximos Textbox y Labels, de modo que queden bien ordenados.

4. En la celda izquierda de la primera fila del TableArrangement colocaremos un TextBox (que renombraremos a litrosTB y fijaremos su anchura a 80 píxeles) y en la celda derecha una Label (a la que pondremos como texto a mostrar Litros). Adicionalmente, al TextBox le quitamos la marca de verificación a su propiedad Enabled, y marcamos su propiedad NumbersOnly. Esta última mostrará, exclusivamente, el teclado numérico, cuando se intente escribir la cantidad (y sólo podremos introducir cantidades enteras). El TextBox lo activaremos luego, desde el editor de bloques.

5. En la celda izquierda de la segunda fila del TableArrangement colocaremos un unTextBox (que renombraremos a preciolitroTB y fijaremos su anchura a 80 píxeles ) y en la celda derecha unaLabel (a la que pondremos como texto a mostrar € por L). También alTextBox le quitamos la marca de verificación a su propiedad Enabled.

6. En la celda izquierda de la tercera fila del y fijaremos su anchura a 80 píxeles) y en la celda derecha una ). También al TableArrangement situamos otro TextBox (que renombraremos a Label (a la que pondremos como texto a mostrar subtotalTB TextBox le quitamos la marca de verificación a su propiedad Enabled. Subtotal

7. En la celda izquierda de la cuarta fila del y fijaremos su anchura a 80 píxeles) y en la celda derecha una ). Adicionalmente,al TableArrangement ponemos un TextBox más (que renombraremos a Label (a la que pondremos como texto a mostrar ivaTB TextBox le quitamos la marca de verificación a su propiedad Enabled. IVA 18%

8. Colocamos un un y fijaremos su anchura a 80 píxeles), una ) y un HorizontalArrangement1, conteniendo TextBox (que renombramos como totalTB Label (a la que ponemos como texto a mostrar TOTAL Button (que renombraremos como calcularBT además de ponerle como texto a mostrar Calcular). Quitamos la marca de verificación a la propiedad Enabled tanto al TextBox como al Button.

9. Colocamos un EmailPicker1. Éste actúa de un modo equivalente a un TextBox, pero nos ofrece autocompletar lo que vamos escribiendo con las direcciones de correo almacenadas en los contactos del dispositivo Android. No funciona en todos los dispositivos Android, pero si falla al ejecutarse la aplicación simplemente muestra un mensaje informando que el dispositivo no lo soporta al proceder a escribir algo en el campo, permitiendo la escritura como un TextBox corriente. De todos modos, si queréis evitar dicho mensaje, usar un TextBox aquí en lugar de un EmailPicker. Ahora le quitaremos la marca de verificación a su propiedad Visible, a fin de que sólo se muestre cuando nos interesa, en un momento posterior.

10. Colocamos un HorizontalArrangement2, conteniendo un Button (que renombramos como mailBT y cuyo texto a mostrar sea Enviar mail), que usaremos para que cuando el usuario desee enviar el importe por mail, se le presente el EmailPicker1 donde poder escribir la dirección. Inicialmente, le quitamos la marca de verificación a su propiedad Visible, para que no se muestre. Pondremos otro Button (que renombramos como enviarBT y cuyo texto a mostrar seaConfirmar), que usaremos para remitir definitivamente el importe por mail. A éste también le quitamos la marca de verificación a su propiedad Visible, y tampoco se verá. Ya lo activaremos posteriormente desde el editor de bloques.

11. Por último, ponemos dos componentes no visibles. Un ActivitySarter1, para lanzar la aplicación de correo electrónico del dispositivo, y un Notifier1, para mostrar un mensaje de confirmación en pantalla. Por el momento, no modificamos sus propiedades, cosa que haremos más adelante a través del editor de bloques.

El diseñador (panel de diseño) nos debe quedar como algo parecido a esto.

¡Cuidado! Ya quedamos que el EmailPicker1, mailBT y enviarBT deben tener su propiedad visible sin marcar. Por tanto, no deben verse en el panel central. En la imagen sí se observan, ya que, para que veáis donde se colocan momentáneamente, los he configurado a visible, pero recordar dejarlos a no visibles.

Por otra parte, en el panel de Components, no llegan a verse ni el ActivityStarter1 ni el Notifier1, simplemente porque la barra de desplazamiento está desplazada hacia arriba, pero realmente ahí están. En todo caso, se observan en el panel central Viewer.

Ahora abrimos el editor de bloques. Para empezar definimos las variables que se ven en la imagen siguiente. También establecemos lo que ocurre cuando se selecciona el tipo de combustible en el . Además, capacitamos el, para permitir escribir en el mismo y capacitamos el botón ListPicker. Básicamente determinamos el precio de la variable precioporlitro,que se ajusta al precio del combustible elegido y lo mostramos en el TextBox precioporlitroTB litroTB TextBox Calcular.

Tras la ejecución de los anteriores bloques, supuestamente el usuario de la aplicación escribirá los litros repostados en el TexBox litrosTB, y pulsará Calcular. Vamos a establecer ahora lo que ocurre al pulsar Calcular, cuyo componente es el botón calcularBT. Pondremos los siguientes bloques:

Comprobamos si ciertamente el usuario ha introducido algún valor en litrosTB, ya que en caso contrario no debemos hacer nada para evitar errores. Si introdujo algún valor, sólo entonces efectuamos los correspondientes cálculos de subtotal, iva y totalTB.

Tal vez os preguntéis porqué definimos las variables precio, subtotal e iva, en lugar de efectuar las operaciones directamente con los TextBox, lo cual, en principio es posible. La causa es que internamente App Inventor trabaja con el punto decimal anglosajón, no admitiendo la coma decimal en el bloque number y obtiene los resultados con dicho punto. Sin embargo, cuando dichos resultados, o simplemente números de punto decimal, se almacenan en un TextBox en una aplicación corriendo en un dispositivo configurado en idioma español (e imagino que también en uno configurado en francés, italiano y la mayor parte de lenguas que no sean el inglés), sustituye el punto decimal anglosajón por la coma decimal, recomendada por el Sistema Internacional de Unidades. Cuando ahora intentemos efectuar una operación aritmética con este TextBox conteniendo una cifra de coma decimal, nos saltará un error, ya que App Inventor no podrá efectuar operaciones con ella. Una solución posible (otra sería efectuar constantes cambios de formato) es operar siempre con variables y usar los TextBox para la presentación final de los resultados. En el caso de totalTB ya no tiene importancia, dado que posteriormente no efectuamos ninguna operación aritmética con su contenido con coma decimal.

En resumen, calculamos cada parámetro y lo pasamos a su correspondiente TextBox. Al final, hacemos visible el mailBT, grafiado como Enviar mail, que sugiere al usuario si desea enviar el importe de la factura por mail.

Seguidamente, programamos los bloques que determinan lo qué ocurrirá si se pulsa dicho botón mailBT, del siguiente modo:

Por una parte, actuará Notifier1, que mostrará un mensaje emergente preguntando si deseamos enviar el importe por e-mail.

El segundo conjunto determina lo que ocurre cuando hemos efectuado la selección ofrecida por Notifier1. Si hemos seleccionado Sí, entonces se hará visible EmailPicker1, para que el usuario pueda introducir el mail del destinatario. Anteriormente hemos descrito un posible problema que se puede presentar con este componente. Además, inactivamos mailBT y hacemos visible enviarBT, para que el usuario pueda Confirmar el envío de email.

El último conjunto de bloques es el que debe ejecutarse al pulsar enviarBT, e implica al componente ActivityStarter del siguiente modo:

Por si lo veis algo pequeño, aclaro:

Adjuntamos un bloque set ActivitySarter1.Action, con la cadena android.intent.action.VIEW.

Adjuntamos un bloque set , con una cadena en la que anexaremos con ActivitySarter1.DataUri join las subcadenas mailto:, el mail del destinatario, contenido en EmailPicker1,(o sea, EmailPicker1.Text), ?subject=Factura&body= (el asunto y la cabecera para el cuerpo del mensaje), importe de su factura (dicha frase) y totalTB.Text (el importe total de la factura).

Adjuntamos un bloque de llamada, call ActivitySarter1.StartActivity

Adicionalmente, cuando el usuario pulse sobre Confirmar ( enviarBT), el dispositivo abrirá la aplicación de correo (si hay más de una primero nos ofrecerá elegir entre las aplicaciones disponibles). Una vez abierta, se presentará la aplicación con los campos de destinatario, asunto y cuerpo del mensaje adecuados, faltando sólo enviar el mensaje, cosa que será posible si nos hallamos conectados a Internet.

# data[].attributes.attachment_link.description
Nuestro objetivo es generar la factura correspondiente a la recarga de combustible de un cliente, de modo que calcule su importe, el importe del IVA y el total. Adicionalmente, enviaremos dicho importe por e-mail. Para ello usaremos varios componentes interesantes, tales como Listpicker (Listas de selección), Notifier (mensajes emergentes) y ActivityStarter (Arranque de actividades), con el que lanzaremos la aplicación de correo electrónico del teléfono.

# data[].attributes.attachment_link.readable_text
Con este componente podemos almacenar datos en un formato de listas de datos, para presentarlos u operar con ellos posteriormente.

Vamos a hacer una sencillísima aplicación que almacene pares de datos: concretamente nombres y números de teléfono de conocidos.

Para ello en el diseñador vamos situar 4 etiquetas, 2 cajas de texto y 2 botones.

Usaremos las cajas de texto para introducir, en la primera de ellas, el nombre del conocido, y en la segunda, el teléfono que le corresponde. Las 2 últimas etiquetas las usaremos, en realidad, para presentar los datos almacenados, ya que modifocaremos su propiedad text con los métodos del editor de bloques.

Una vez introducidos ambos datos, cuando se pulse el botón grafiado con Ver Agenda, se almacenarán los datos en la lista, anexándolos a los datos que ya se encuentran en ella, y además se mostrarán listados ambos datos recién introducidos y todos aquéllos insertados con anterioridad.

Con el otro botón, grafiado como Ver en CSV, se mostrarán los mismos datos que con el botón anterior, pero en formato de Valores Separados por Comas (CSV).

El diseñador debe quedar de modo semejante a lo siguiente:

Los componentes se pueden renombrar tal como aparecen, dejarlos tal como los inserta App Inventor o renombrarlos como os guste más. Eso sí, para que el programa trabaje igual, la propiedad texto de dichos componentes debe contener lo que aparece en el panel central. En el cuadro de texto donde el usuario escribirá los teléfonos, que yo he llamado TelefonoTB, fijaros que he activado la propiedad NumbersOnly, con la finalidad que al proceder a escribir aparezca automáticamente el teclado numérico.

En el editor de bloques definiremos 2 variables, que llamo Agenda y Datos. Al aplicarles a ambas el método call make a list, convertimos sendas variables en listas de variables, que utilizaremos posteriormente.

Adicionalmente, programamos los procesos que ocurrirán cuando se dispare el evento de pulsar un botón.

En el bloque when VerAgendaBT.Click, es decir, cuando el usuario pulse el botón Ver Agenda, la variable de lista Datos almacenará el par de datos que se halla en las cajas de texto, es decir, el nombre y teléfono escritos. Adicionalmente, con la llamada a add items to list anexaremos a los datos previamente almacenados en Agenda el par de datos que acabamos de almacenar en la lista Datos. Presentaremos los datos en pantalla haciendo que el texto de la etiqueta Agenda tome como valor el contenido de la lista Agenda. Por último, se borrará el contenido de las cajas de texto para que queden prestas para introducir nuevos datos.

En el bloque when AgendaCSVBT.Click, es decir, cuando el usuario pulse el botón Ver en CSV, se presentará en pantalla, mediante la modificación de la propiedad texto de la etiqueta CSV, el contenido de la lista Agenda, pero ahora convertido al formato CSV gracias a una llamada al método call list to csv table.

En resumidas cuentas, el editor de bloques debe quedar así.

Puedes probar la aplicación conectando el móvil o con el emulador. Introduce nombres y teléfonos y ves pulsando los botones en pantalla para verificar su funcionamiento.

# data[].attributes.attachment_link.description
Con este componente podemos almacenar datos en un formato de listas de datos, para presentarlos u operar con ellos posteriormente. Vamos a hacer una sencillísima aplicación que almacene pares de datos: concretamente nombres y números de teléfono de conocidos. Para ello en el diseñador vamos situar 4 etiquetas, 2 cajas de texto y 2 botones.

# data[].attributes.attachment_link.title
App inventor. Pasar datos entre ventanas o pantalla. TinyDB

# data[].attributes.attachment_link.description
IMPORTANTE: App Inventor utiliza el mismo archivo en cada aplicación para la TinyDB, es decir si tenemos varias TinyDB en la misma aplicación, será el mismo archivo donde se guarden los datos, así que si en una TinyDB1 ponemos hola = 1234 y en la TinyDB2 ponemos hola = 9876, el hola cambiará al este último número, ya que es el mismo archivo de base de datos.

# data[].attributes.attachment_link.readable_text
Crear una aplicación que pida usuario y contraseña y que funcione online con una base de datos, un tema que básicamente hizo crecer mi canal de Youtube en sus inicios, así que empecemos.

Hoy veremos como hacer un login en app inventor usando TinyDBWeb, por supuesto que hay otras formas como por ejemplo usar CloudStorage o Firebase, pero eso es un tema más avanzado que lo puedes ver en mi CURSO GRATIS DE APP INVENTOR.

Hay muchas formas de crear una aplicación con login, más aun con las nuevas versiones de App Inventor que incluyen nuevas bases de datos, las cuales permiten iniciar remotamente desde multiples dispositivos móviles, pero como se mencionó antes, hoy usaremos TinyDBWeb.

Ahora veremos un corto tutorial y explicación para ponerle usuario y password a una aplicación con App Inventor.

Crear aplicación en App Inventor que pida usuario y contraseña

Veamos como crear una aplicación en App Inventor con login y sign-up, es decir una aplicación que nos pida usuario y contraseña para ingresar a ella, pero lo más novedoso es que nos va a dejar registrarnos online, tipo Facebook. Lo mejor de todo es que no vamos a pagar host, ni base de datos, pues vamos a utilizar recursos de App Inventor que son gratis.

Pantallas de inicio de sesión y registrarse

Lo primero que haremos es crear dos pantallas y recursos gráficos. Una pantalla de iniciar sesión y la segunda pantalla o screen, será donde los usuarios no registrados puedan registrarse.

Crearemos dos pantallas sencillas, ya el tema de la creatividad se los dejo a ustedes, yo solo agregare botones y elementos predefinidos de App Inventor.

Ahora vamos a ver las dos pantallas. Inicio de sesión y registrarse respectivamente.

Ahora vamos con la pantalla de registro. Este es un tutorial bastante básico, asi que solo puso un usuario y dos contraseñas para verificar la correctitud. En tutoriales más avanzados enseño como usar el correo electrónico.

Lógica y programación de cada pantalla

La lógica de esta aplicación es bastante facil de replicar. La primera pantalla es solamente redirigir a cualquiera de las dos opciones, ya sea a la pantalla de iniciar sesión o a la pantalla de registro.

Lo que esta dentro de los bloques rosados son los nombres de las pantallas o screens hacia donde queremos ir al momento de presionar dicho boton. Ahora bien, vamos para la parte de iniciar sesión. Primero agregamos este componente a nuestra pantalla o screen.

Ahora veamos la lógica que hay en el fondo de esta pantalla o screen.

La parte subrayada en rojo se se añade al usuario para evitar que exista alguien que sobre-escriba en nuestra base de datos. Al momento de hacer su aplicación, elijan otros números para evitar que alguien les sobre-escriba la base de datos. Ahora vamos con la pantalla de registro, para la cual tenemos que agregar el mismo componente anterior.

Si este método no te ha convencido, tengo más formas de hacerlo. Te invito a visitar mi sección de tutoriales para App Inventor o a ir a la pagina 2 de este post.

# data[].attributes.attachment_link.title
▷ App Inventor: App con LOGIN y SIGN-UP online | Aplicación con USUARIO y CONTRASEÑA - Yo Androide

# data[].attributes.attachment_link.description
Crear una aplicación que pida usuario y contraseña y que funcione online con una base de datos, un tema que básicamente hizo crecer mi canal de Youtube en sus inicios, así que empecemos.

# data[].attributes.headline
Onboarding i permisos ( pantalla inicial explicativa)

# data[].attributes.subject
Onboarding i permisos ( pantalla inicial explicativa)

# data[].attributes.attachment_link.description
Cómo pedir permisos en AppInventor, añadir salto de línea a una etiqueta y abrir una pantalla cerrando la anterior.

# data[].attributes.attachment_caption
3. AppInventor - Navegación y Listas. MOLT INTERESSANT

# data[].attributes.attachment_link.description
Cómo crear un listado de texto en App Inventor. Cómo decidir qué pantalla abrir primero cuando se abre la aplicación.

# data[].attributes.attachment_link.title
08 Tutorial de MIT Inventor 2. Multipantallas y mochila

# data[].attributes.attachment_link.title
09 Tutorial de MIT Inventor 2. Disposiciones como pantallas virtuales

# data[].attributes.attachment_link.readable_text
MakeQuiz and TakeQuiz are two apps that, in tandem, allow a teacher to create quizzes for a student. Parents can create fun trivia apps for their children during a long road trip, grade school teachers can build "Math Blaster" quizzes, and college students can build quizzes to help their study groups prepare for a final. This tutorial will walk you through creating both the MakeQuiz and the TakeQuiz app.

This tutorial is a followup of the QuizMe tutorial -- if you haven't completed that tutorial you should do so before continuing.

Connect to the App Inventor web site and start a new project. Name it "MakeQuiz", and also set the screen's Title to "MakeQuiz". Open the Blocks Editor and connect to the phone.

You'll design two apps, MakeQuiz for the "teacher" and TakeQuiz for the "student". With MakeQuiz:

The user enters questions and answers in an input form.

The previously entered question-answer pairs are displayed.

The quiz is stored persistently, in a database.

TakeQuiz will work similarly to the QuizMe app-- in fact you'll build it using QuizMe as a basis. TakeQuiz will differ in that the questions asked will be those that were entered into the database using MakeQuiz.

This tutorial introduces the following App Inventor concepts:

Input forms for allowing the user to enter information.

Displaying lists: serializing a list variable to display it on separate lines.

Persistent data: MakeQuiz will save the quiz questions and answers in a database and TakeQuiz will load them in from the database.

Data Sharing: the two apps together illustrate how two phones (and even two apps) can communicate through a shared, web database:

Use the Component Designer to create the interface for MakeQuiz. When you finish, it should look something like the snapshot below:

You'll use the following components to create MakeQuiz. Drag each component from the Palette into the Viewer and name it as specified below:

Component Type

Palette Group

What you'll name it

Purpose of Component

Set the properties of the components in the following way:

Set the Text of Label1 to "Question:" and the Text of Label2 to "Answer:".

Set the Hint of QuestionText to "Enter a Question" and the Hint of AnswerText to "Enter an Answer".

Set the Text of SubmitButton to "Submit"

Set the Text of QuestionsAnswersLabel to "Questions and Answers".

Put Label1 and QuestionText in HorizontalArrangement1, and Label2 and AnswerText in HorizontalArrangement2.

Open the Blocks Editor to add the behaviors for the app. As with the original QuizMe app, you'll first define some global variables for the QuestionList and AnswerList, but this time you won't provide fixed questions and answers. You'll need the following blocks:

The blocks should look like this:

Note that, unlike the original QuizMe app, the lists are empty to begin with. This is because with MakeQuiz and TakeQuiz, all data is created by the user of the app (it is user-generated).

The first behavior you'll build is for handling the user's input. Specifically, when the user enters a question and answer and clicks submit, you'll use add item to list blocks to update the QuestionList and AnswerList.

You'll need the following blocks:

The blocks should look like this:

The block add items to list appends each item to the end of a list. Here, the app takes the text the user has entered in the QuestionText and AnswerText text boxes and appends each to the corresponding list.

The behavior updates the hidden QuestionList and AnswerList variables, but the changes are not shown to the user. To display these lists, create a procedure "displayQAs" which makes a text object with both lists and places it into the QuestionsAnswersLabel. Then make sure to call the procedure at the bottom of SubmitButton.Click. You'll need the following blocks:

The blocks should look like this:

The displayQAs procedure is called after the lists are modified in SubmitButton.Click. The QuestionsAnswersLabel is modified to display the two lists separated by a colon. By default, App Inventor displays lists with surrounding parenthesis and spaces between items:

(item1 item2 item3)

Of course, this is not the ideal way to display the lists, but it will allow you to test your behavior for now. Later, you'll modify the displayQAs procedure to display a list on separate lines, and to display each question together with its corresponding answer.

Test this behavior. On the phone, enter a question and answer and click Submit. The app should display the single entry in the QuestionList, a colon, and then the single entry in the AnswerList. Add a second question and answer to make sure the lists are being created correctly.

When a user submits a question-answer pair, you should clear the QuestionText and AnswerText text boxes so they're ready for a new entry.

You'll need the following blocks:

Here's how the blocks for the updated event handler should look:

When the user submits a new question and answer, they are added to their respective lists. At that point, the text in the QuestionText and AnswerText is "blanked out" with empty text blocks (you create an empty text block by clicking on the the block's text and pressing the delete button).

Test the behavior. Add some questions and answers. When you submit them, the QuestionText and AnswerText should show only their hint (when a TextBox's Text property is empty it shows the hint until the user clicks it).

As is, the app records the questions and answers entered by the user, but only in the phone's temporary memory. All variables in App Inventor are transient data-- they are stored on the phone and the data only "lives" through one run of an app. When the user closes the app, the data is lost.

The MakeQuiz app needs to record the questions and answers in a database. This will allow the quiz creator (teacher) to always edit the latest update of the quiz. It will also allow the TakeQuiz app to load the quiz and administer it to the student.

You'll use the TinyWebDB component to store and retrieve the QuestionList and AnswerList to and from a database. TinyWebDB allows you to store data in AppInventor-compliant databases that live on the web instead of on the phone.

The general scheme for storing a list persistently is the following: each time a new item is added to the list, use TinyWebDB to update the database version of the list. Then each time the app is opened (Screen1.Initialize event), reload the database version of the list into the variable.

Start by storing the QuestionList and AnswerList in the database each time the user enters a new pair. You'll need the following blocks:

The blocks should look like this:

The last two rows of blocks store data in the database. The tag arguments label the data being stored so that you can retrieve it later. The QuestionList is stored with a tag of "Questions" while the AnswerList is stored with a tag of "Answers".

Although our example uses "Questions" as the tag, you should actually use your own tag, e.g., "DavesQuestions", because by default, the database entries of all App Inventor programs share the same namespace and so your list of questions may get confused with someone else's list of questions since you both used the same tag. For more information, see Creating a Custom TinyWebDB service.

Test this behavior. TinyWebDB stores information on the web, so you can open a browser page to test whether this behavior is working. By default, TinyWebDB stores information at http://appinvtinywebdb.appspot.com. Use the "/getvalue" function on that page to verify that the data you stored is matched with the tag as desired. Note, however, that there will be many entries, and your entry may overwrite someone else's tag, as the default service is for testing and is used by many programmers. Because the default service is shared amongst programmers and apps, it is only for testing. Fortunately, setting up your own database service is relatively straight forward. For more information, seeCreating a Custom TinyWebDB service.

Once the blocks for storing the lists are working, you can add the blocks for loading the lists back in each time the app begins.

Loading data from a TinyWebDB database is a two-step process. First, you request the data by calling TinyWebDB.GetValue and providing a tag.

call TinyWebDB.GetValue only requests the data from the web service. After the request is made, your app can do other things, such as responding to user actions, while it waits for the TinyWebDB web service to send the data. When the data arrives, a call TinyWebDB.GotValue event is triggered. When that event occurs, the data requested is in a variable named "valueFromWebDB". The tag you requested is in the variable "tagFromWebDB". You can access these variables in the when TinyWebDB.GotValue event handler.

In this case, the app needs to request two things from the TinyWebDB web service, the questions and the answers, so the when Screen1.Initialize will make two calls to getValue. When the data arrives and the GotValue event-handler is triggered, the app should check the tag to see which request has arrived, and then load the corresponding list. Once the lists are both loaded, displayQAs can be called to display them.

You'll need the following blocks:

The blocks should look like:

When the app begins, the Screen1.Initialize event is triggered. The app calls TinyWebDB1.GetValue twice, once to request the stored QuestionList and once to request the stored AnswerList. After requesting the data, the app can handle other events while it waits for the web database to answer the request.

When the data arrives from the web database, the TinyWebDB1.GotValue event is triggered. Since two requests were made, it will be triggered twice, once for each list.

In the GotValue event-handler, the value returned is in the variable valueFromWebDB . The corresponding tag is in tagFromWebDB . The blocks first check to see which request has returned (even though the request for "questions" is made first in Screen1.Initialize, there is no guarantee that the QuestionList will arrive first). If the tag is "questions", the valueFromWebDB is put into the variable QuestionList. Otherwise (else) it is placed in the AnswerList.

At the bottom of GotValue, the app checks to see if both lists have been loaded-- one way to check is to see if the lengths of the lists are the same. If they are, displayQAs is called to display them on the phone.

Test this behavior. Select Restart Phone in the Blocks Editor. When the app initializes, it should display the previously entered questions and answers. If you close the app and restart again, the previous quiz should still appear.

The version of MakeQuiz you've created so far works: the user can create a quiz and it will be stored persistently in the database. If you can accept the fact that the quiz is displayed in an inelegant way, you can proceed to creating the sister app, TakeQuiz, which lets a user step through the quiz and answer the questions.

If you'd like to learn how to display list data in a more elegant fashion, step through the steps directly below.

In the app you've built so far, the question and answer lists are displayed separately and with the default list display format, e.g.,

(question1 question2 question3): (answer1 answer2 answer3)

In this section, you'll modify the app so that the newly entered question-answer pairs are displayed in tandem, one on each line:

question1:answer1 question2:answer2 question3:answer3

Displaying the data in this way is non-trivial, so you'll start by first displaying a single list, the QuestionList, with each item on a separate line.

To display a list on separate lines, you must serialize it . This means to build a single text object with all the items of the list in it and a special character, '\n', between each item. A "\n" within a text object appears as a newline character when displayed.

For example, suppose the user has entered two questions, "What is the capital of California?" and "What is the capital of New York?" and these have succesfully been added to the QuestionList . Your displayQAs procedure should build a text object from QuestionList that looks like:

"\nWhat is the capital of California\nWhat is the capital of New York?"

When displayed on the phone, such text would appear as:

What is the capital of California?
What is the capital of New York?

All the changes will occur in the procedure displayQAs. You'll remove the blocks within that procedure, and use a foreach block to build the text by successively adding each question. The blocks within the foreach should add the current item (question) to the end of the text object (QuestionsAnswersLabel) you are building. You'll need the following blocks:

The blocks should look like this:

When the procedure is called, the QuestionsAnswersLabel.Text is first set to the empty text. This is in preparation for the foreach block that comes next, which will build the text in QuestionsAnswersLabel.Text incrementally.

The foreach block specifies that the blocks within it are to be executed once for every item in QuestionList. If there are three questions, then the inner blocks will be executed three times. Within the foreach, the current item being processed is named question.

On each iteration, QuestionsAnswersLabel.Text is modified. Each time it is set to its previous value, along with the newline character, "\n" and the current question being processed.

When the foreach completes, QuestionsAnswersLabel.Text will be text string with all the items separated by newline characters. As the app is processing each iteration of the foreach , the phone display doesn't change. But when it completes, the text in QuestionsAnswersLabel.Text is displayed on the phone and the items appear on separate lines.

Test the behavior. On the phone, add another question and answer and click Submit. Now, only the questions should be displayed and they should be displayed on separate lines.

The displayQAs procedure you've created ignores answers and only displays questions. In the next version of displayQAs , you'll display the data as question-answer pairs, e.g.,

What is the capital of California?: Sacramento What is the capital of New York?: Albany

Modify displayQAs. Use an index variable to access each answer as the foreach block walks through the questions. You'll need the following blocks:

The blocks should look like this:

The foreach only allows you to iterate through one list. In this case, there are two lists and you need to step through and select each answer as you proceed through the questions. The strategy is to use an index variable, as was done with the currentQuestionIndex in the QuizMe tutorial.

For this behavior, the index is a position in the AnswerList, so its named answerIndex. The index is set to 1 before the foreach begins. Within the foreach, it is used to select the current answer from the AnswerList, and then it is incremented.

Test this behavior. On the phone, add some more question/answer pairs. The display should now show each question with its corresponding answer, and each question:answer pair on separate lines.

Scan the following barcode onto your phone to install and run MakeQuiz.

Or download the source code

.

1. In the Component Designer, choose each image from the media palette and delete it. Also delete the Image1 component, which will remove all references to it from the Blocks Editor.

2. In the Blocks Editor, drag the PictureList to the trash.

Test the behavior. Click Restart Phone App. Does the first question from the quiz you created with MakeQuiz appear? Can you take the quiz just as you did with QuizMe (except for the pictures)?

Or download the source code.

Incorporate images into the apps. The images will need to be URLs from the web, and the test creator will need to specify these URLs as a third item in the MakeQuiz form.

Allow the user to delete items from the questions and answers. You can let the user choose using the ListPicker component, and you can remove an item with the remove list item

Allow multiple quizzes to be created. You'll need to conceptualize the list of quizzes as a list of lists.

You can store data persistently in a web database with the TinyWebDB component.

You retrieve data from a TinyWebDB database by requesting it with GetValue . When the web database returns the data, the TinyWebDB.GotValue event is triggered. At that point, you can put the data in a list or process it in some way.

TinyWebDB data can be shared amongst multiple phones and apps.

MIT and Google are grateful toProfessor David Wolber, CS Professor at The University of San Francisco, for developing this tutorial. Done with MakeQuiz and TakeQuiz? Return to the other tutorialshere.

# data[].attributes.attachment_link.title
MakeQuiz and TakeQuiz for App Inventor 2

# data[].attributes.attachment_link.description
MakeQuiz and TakeQuiz are two apps that, in tandem, allow a teacher to create quizzes for a student. Parents can create fun trivia apps for their children during a long road trip, grade school teachers can build "Math Blaster" quizzes, and college students can build quizzes to help their study groups prepare for a final.

# data[].attributes.body
Vincular WHASAPP i APP inventor

# data[].attributes.attachment_link.title
Curso de programación en App Inventor (usando whasapp en app inventor) en 3 minutos 🤓😎🤩🥳