Come far vibrare il telefono (App Inventor 2 / Thunkable)

Se sei uno sviluppatore di app per android, una delle cose che prima o poi ti capiterà di dover fare è capire come far vibrare il telefono a seguito di un'azione dell'utente.
Può essere il caso in cui si sta creando un'app che manda delle notifiche, oppure un'applicazione per android che genera un allarme, o perchè no, la famosa app che simula le chiamate per il cellulare.

Quale che sia l'app in questione, grazie a Mit App Inventor 2 (o thunkable) è possibile far vibrare il telefono cellulare con un semplice componente nativo, senza bisogno di estensioni esterne.
Vediamo subito come fare.

Come far vibrare il telefono con App Inventor 2 e Thunkable

Partendo da un progetto vuoto al quale basta aggiungere un bottone per generare l'azione, per ottenere la vibrazione del telefono basta utilizzare il componente Player.
Trascinare dunque il componente player nel viewer e poi andare subito a lavorare nei blocchi (blocks).

Basterà infatti associare all'azione del click del bottone, l'azione del player (app inventor o thunkable) denominata call player vibrate (esegui player vibra), alla quale basterà poi associare il numero di millisecondi per i quali si vuol far vibrare il telefono.

Ed ecco che una volta lanciata la nostra app, al click del bottone il telefono vibrerà come per magia.
Tutto questo con un solo blocco di codice, facile no?

Un paio di note utili per la corretta riuscita di questa operazione:

• 1000 millisecondi sono un secondo, quindi per calcolare quanti secondi si vuole far vibrare il telefono basta fare x*1000
• Per poter far vibrare il telefono con la vostra app sviluppata con thunkable o app inventor, comunque bisogna avere abilitato la vibrazione delle notifiche.
  Sembra una banalità, ma se si lascia il telefono silenzioso senza vibrazione, questo componente non fa niente... io non lo sapevo e ci ho perso un secolo per capire come mai non funzionava la vibrazione su appinventor / thunkable, passando dal semplice componente player ad anche estensioni esterne, nulla funzionava fino a quando non ne ho scoperto il motivo :p

E' tutto sull'argomento vibrazione cellulare tramite appinventor / thunkable.
A questo link trovate il semplice progetto .aia da scaricare, nel caso vi servisse.

Tornare all'elenco delle lezioni

Cambiare lingua in Thunkable / App Inventor 2

Questo banale tutorial serve solo per i più novizi, soprattutto per quelle persone che non hanno molta dimestichezza con l'inglese.
A già, ho dimenticato di specificare il soggetto di questa guida, anzi i soggetti: thunkable e app inventor 2.

Non starò certo a spiegare a cosa servono queste due piattaforme online, anche perchè se sei capitato qui, di sicuro già lo saprai.
Se però l'inglese per te è un ostacolo insormontabile, ho una buona notizia, queste due piattaforme sono tradotte praticamente interamente in italiano.

Se dunque vuoi sapere come usare app inventor in italiano, o thunkable, continua a leggere (cit.)

Come cambiare lingua in Thunkable / App Inventor 2

La procedura per impostare la lingua in thunkable o MIT appinventor 2 è la stessa, quindi con un post faccio in pratica due guide.
E che post tra l'altro, dato che praticamente si tratta di fare un click :p

Comunque, per cambiare la lingua di thunkable o app inventor 2, basta cliccare in alto destra sul nome della lingua in uso.
Idealmente, se non hai mai cambiato la lingua, dovrai cliccare sulla voce English, e selezionare l'italiano.

Con un semplice click del mouse dunque, avrai impostato thunkable in italiano (o app inventor), ed ora tutti i blocchi ed i comandi, saranno nella tua lingua.
Al massimo dovrai rientrare nell'app che stavi usando prima del cambio lingua.

Ovviamente però, online ci sono molti più tutorial in inglese che in italiano, quindi il mio consiglio è quello di imparare ad utilizzare thunkable ed appinventor in inglese, dato che è la lingua ufficiale del mondo... se così si può dire :p

Torna all'elenco delle lezioni

Come mandare email da App Inventor 2

Questo breve tutorial riprende un argomento già trattato in Mit App Inventor 2, in quanto parlo di un componente molto utile per sviluppare app per android anche di una certa complessità.
Il componente in questione è l'ActivityStarter, e la funzionalità che voglio oggi spiegarvi è quella che consente di mandare email da app inventor 2.

In realtà, volendo fare i pignoli, il seguente tutorial non vi spiega come spedire email usando appinventor, almeno nel senso stretto della parola.
Ciò che invece riuscirete a fare, è aprire in automatico il vostro programma predefinito per la spedizione di e-mail, e da lì poi spedire.

Vediamo subito più nel dettaglio cosa intendo.

Come mandare email da MIT App Inventor 2

Come dicevo ad inizio post, il componente da trascinare nel designer di appinventor è l'activitystarter.
La sintassi invece da scrivere dentro la proprietà azione (action) è:
android.intent.action.VIEW

Nel campo UriDati (dataUri) invece, a differenza di quanto si fa per l'apertura del browser (come illustrato in questo post), va scritta la seguente sintassi:
mailto:indirizzo@email.it

Adesso non ci resterà altro da fare che mettere una bella azione al nostro tasto per spedire email da app inventor, usando la sintassi Esegui Activity Starter Avvia Attività (call activitystarter startactivity).

Tutto qui.
Lanciando la nostra app android infatti, e cliccando sul bottone a cui abbiamo associato l'azione, si aprirà il client di posta elettronica predefinito, con già compilato il destinatario del messaggio.

Se poi vogliamo compilare in automatico anche il titolo della mail, la sintassi da utilizzare è la seguente:
mailto:indirizzo@xx.it?subject=Prova

Per autocompilare titolo e corpo email invece, ecco cosa mettere nel datauri:
mailto:indirizzo@xx.it?subject=Prova&body=Messaggio+di+prova

Provate un po' questa sintassi per vedere cosa succede, e quale client email app inventor vi propone.
Come al solito inoltre, vi lascio anche il link al progetto .aia della lezione, che male non fa.

Imparare a spedire mail da appinventor 2 di certo può tornare utile per qualche applicazione o gioco, quindi tanto vale poterlo fare.

Torna all'elenco delle lezioni

Come aprire il browser con App Inventor 2

Questo tutorial lo scrivo più per comodità mia che per altro.
Infatti, aprire il browser con app inventor 2 è relativamente semplice a livello di programmazione/configurazione.
Quello che invece risulta un po' scomodo, è ricordarsi la sintassi da utilizzare per compiere l'operazione :)

Vediamo subito dunque come fare per aprire un sito internet con app inventor 2.

Come aprire il browser con MIT App Inventor 2

Per poter aprire un sito internet con app inventor, basta utilizzare il componente che si trova nella sezione Connectivity (connettività), il cui nome è Activity Starter.

Dopo aver trascinato questo componente dentro il designer, bisogna configurarlo.

Per aprire un sito internet dalla tua app infatti, ovvero per lanciare browser predefinito sul tuo cellulare android, devi andare a settare la sezione Action con il seguente valore: android.intent.action.VIEW

Adesso bisogna inserire nel DataUri l'indirizzo web da far aprire alla tua app.

Ora non devi far altro che creare l'azione scatenante.
Ad esempio puoi mettere il tutto dentro un bottone, cioè all'interno del blocco tasto click, aggiungere il blocco Call ActivityStarter StartActivity.

Anche per questo semplice esempio vi lascio il progetto .aia... per i più pigri diciamo :)

E' tutto.
Quando lancerai la tua app, se cliccherai sul bottone che hai creato, si aprirà il browser predefinito su android (o ti verrà chiesto quale usare) con subito aperta la pagina che hai settato nelle impostazioni dell'activity starter app inventor 2.

Torna all'elenco delle lezioni

Pubblicità Adsense Admob su MIT App Inventor 2

Dopo aver creato la tua prima applicazione per android, poi la seconda, poi la terza, ti verrà sicuramente voglia di iniziare a guardargnarci qualcosa.
Se però stai utilizzando MIT App inventor 2, avrai sicuramente capito da tempo che non è presente alcuna estensione per poter inserire i banner di admob nelle tue app.

Non avere paura però, dopo aver cercato e testato con mano la cosa, eccomi qui a fare un post su come mettere la pubblicità su appinventor.
Tecnicamente ripeto, almeno per il momento non è fattibile, ma con uno stratagemma, o per meglio dire con un altro strumento, è possibile salvare capra e cavoli (cit.).
Sto parlando di utilizzare thunkable, una piattaforma nata proprio da app inventor 2, che poi grazie a questa funzionalità aggiuntiva adsense ed alla gente che questa ha attirato, si è evoluta tanto da superare il maestro (oserei dire).

So che avrai già letto diversi post in merito, o visto dei video, ed il dubbio è sempre questo: "ma se ho già pubblicato un'app nel play store non mi fa caricare un'app sviluppata da un altra piattaforma, ma devo creare una nuova app e perdere quindi statistiche, stelle, commenti e posizionamento". Per fortuna però, è possibile aggiungere gli AD alle proprie App senza perdere lo storico nel play store, ed ora ti spiegherò subito come fare.

Come mettere la pubblicità Adsense Admob su MIT App Inventor 2

La prima cosa da fare per poter aggiungere adsense ad appinventor è lasciare app inventor :p
Dovrai infatti esportare il tuo progetto ed importarlo in thunkable.
Se non sai come importare/esportare un progetto .aia leggi questo post.

Quindi bisogna esporate il progetto da app inventor 2, poi importarlo in thunkable.
La procedura di import su questa seconda piattaforma è (quasi) la medesima che sulla prima, bisogna solo registrarsi al servizio, esattamente come fatto in appinventor, ovvero dando l'ok a connettersi con l'account google al seguente indirizzo:

http://app.thunkable.com

Ho scritto che la procedura di import è quasi la medesima perchè al posto di fare un importa progetto standard, dobbiamo usare la voce "upload legagy app project (.aia) from my computer".

Una volta importato il progetto in thunkable, entriamoci ed andiamo subito a vedere come inserire la pubblicità nella nostra app.

Il componente aggiuntivo da trascinare nel designer al momento si trova in experimental, e si chiama, niente poco di meno che admob banner.
Oppure, se vogliamo usare la pubblicità adsense di tipo popup a tutto schermo, bisogna trascinare nel design il componente admob interstitial.

Una cosa importante da fare però, per poter usare al meglio questi componenti, è impostare la nostra app in modo che sia responsive, cliccando su screen -> sizing -> responsive.

Adesso, per concludere la configurazione di questi componenti aggiuntivi pubblicitari, occorre indicare l'AD unit ID, mettendo il codice pubblicitario preso dalla piattaforma AdMob.
Se necessario, abilitare l'opzione "test mode" per poter verificare che il proprio banner si veda correttamente, senza rischiare di cliccarci sopra involontariamente (pratica vietata in adsense).

Ovviamente, affinchè tutto funzioni, bisogna essere registrati ad adsense con il proprio account google.
E bisogna aver aderito ad admob, aver creato un progetto per la propria App, ed una o più unità pubblicitarie, come spiegato in questo post.
E' proprio infatti da admob che si può reperire l'id da inserire in thunkable: andando in APP, cliccando sull'applicazione desiderata, e nella sezione "unità pubblicitarie", cliccando sull'icona copia affianco al banner di cui si vuole reperire l'id.

Bene, adesso che abbiamo configurato il nostro banner, possiamo farlo apparire nella nostra app thunkable andando nei blocchi (blocks) ed usando il comando call AdMob Banner Load Ad.

Ecco fatto, ora possiamo testare la nostra app, tenendo presente che i banner di admob potrebbero apparire dopo ore dalla loro creazione (quando si creano nuove unità pubblicitarie).

Prima di generare l'apk da inserire nel play store però, se vogliamo aggiornare un'app creata precedentemente in "MIT App Inventor 2" e modificata in Thunkable per aggiungerci la pubblicità, dobbiamo importare il keystore di app inventor 2 in thunkable, come spiegato in questo post.
Questa procedura è di vitale importanza per avere la possibilità di modificare app già esistenti nel play store, quindi il mio consiglio è quello di compiere questa operazione una volta sola, la prima volta che si usa thunkable.
Così facendo infatti, avremo allineato perfettamente le due piattaforme, che genereanno app firmate nello stesso modo, non creando problemi nello store.

Fatto questo abbiamo praticamente finito.
Ci basterà infatti generare l'apk da caricare nel play store, ed iniziare a guadagnare con la pubblicità presente nelle nostre app sviluppate con app inventor 2 o thunkable.

Ovviamente non è possibile reimportare un'app con il componente admob da thunkable ad app inventor 2, perchè questo lì non esiste (almeno per ora), quindi vuol dire che piano piano finirete per spostarvi a sviluppare direttamente su thunkable, abbandonando appinventor... proprio come sta succedendo nel mio caso.
Mi spiace per appinventor2, ma se non si decidono a consentire di mettere la pubblicità adsense sulle app degli sviluppatori, è ovvio che la gente non vorrà sempre lavorare gratis o fare programmi, anche complessi, solo per hobby ;)

Fine...
Ah già, dimenticavo, (ad oggi) thunkable prende il 5% dei vostri guadagni pubblicitari (non so tecnicamente come faccia)... ma come si dice, meglio guadagnare il 95% che lo 0%, no?
Io inizialmente ero scettico nell'uso di questa piattaforma, ma alla fine ho verificato e tutto funziona, i guadagni arrivano (immagine d'esempio generica):

Un'ultima cosa, un piccolo contro diciamo.
Alcune configurazioni di visualizzazione di blocchi tipo pulsanti potrebbero essere diverse tra appinventor e thunkable. Quindi potrebbe capitare di dover fare un minimo di porting tra le due piattaforme, sistemando colori o dimensioni varie... nulla di esageratamente grave ed oneroso comunque, praticamente tutto ciò che è sviluppato in app inventor gira su thunkable.

Torna all'elenco delle lezioni

Esportare / importare keystore App Inventor 2 / Thunkable

Avete mai sentito parlare del keystore?
Io sviluppo app con mit app inventor 2 e thunkable da un po', ed in effetti non mi ero mai filato questa voce del menù di queste piattaforme :p
Eppure, saper fare questa operazione, di recente è diventata per me una cosa vitale.

Il key store comunque, come suggerisce il nome, è una chiave di firma (certificato) per le nostre applicazioni per cellulare android, una chiave che viene letta dal play store quando carichiamo un apk.
Se infatti questa firma non viene riconosciuta da google, o se è diversa, non è possibile inserire nel market una nuova versione di un'app per android (insomma non la si può più aggiornare), e quindi bisognerebbe fare un nuovo progetto, perdendo di conseguenza tutte le statistiche.

Vediamo subito come fare import / export di questo file.

Come esportare il keystore da App Inventor 2 

Per poter eseguire l'export del keystore su app inventor 2, basta andare nel menù projects e cliccare banalmente la voce export keystore.

Ci verrà chiesto di salvare il file android.keystore sul nostro computer, facciamolo.
Questo file di cui ignoravo quasi l'esistenza, è infatti molto importante per poter firmare le proprie app, soprattutto se si vuole modificare un programma/gioco già esistente nel play store di android.
Se infatti cambiate piattaforma di sviluppo, dovrete premunirvi di portarvi dietro il keystore, quindi salvatevelo bene da qualche parte, magari anche in un'email online.

Ad esempio, l'esigenza più importante (che mi ha spinto a creare questo post), potrebbe essere quella di importare un gioco app inventor 2 su thunkable, per modificarlo (mettendoci la pubblicità) e poi ricaricarlo aggiornato nel play store.
Passiamo dunque a spiegare come fare l'import.

Come importare un keystore in Thunkable

Per poter importare keystore in Thunkable, basta seguire la stessa procedura che si farebbe in appinventor.
Andare infatti in projects (progetti) e cliccare su import keystore.

Thunkable (ed app inventor) mostrerà un messaggio d'avviso a video, avvertendo che il keystore sovrascritto verrà perso per sempre.
Questo vuol dire che le applicazioni sviluppate con quella firma, non saranno più modificabili.
Se dunque non siete sicuri di quello che fate, o anche se lo siete, effettuate sempre un backup del file android.keystore che andate a sovrascrivere.
Fatto questo quindi, non dovrete far altro che cercare il keystore sul vostro pc, e sovrascrivere online quello esistente.

E con la firma delle app per oggi è tutto (cit.).

Torna all'elenco delle lezioni

Leggere qrcode e barcode con App Inventor 2

Il tema del giorno sono i codici a barre, ovvero quei codici grafici che contengono al loro interno delle informazioni.
Di sicuro li hai già visti un sacco di volte, magari al supermercato.
Ogni prodotto ha infatti un suo prezzo, codificato solitamente dentro il codice a barre.

Il tema di questo ennesimo tutorial su Mit App Inventor 2 riguarda proprio i barcode o qrcode.
Se infatti il bar-code equivale al codice a barre, il qr-code è invece un simbolo quadrato bianco e nero, che come il suo fratello più vecchio barcode, contiene al suo interno alcune informazioni, tipicamente un indirizzo di una pagina web.
Vediamo subito come appinventor gestisce qr code e barcode.

Come leggere qrcode e barcode con MIT App Inventor 2

Per poter scannerizzare i qr-code con app inventor, ovviamente bisogna utilizzare uno dei tanti componenti che questa stupenda piattaforma ci mette a disposizione.
Nell'esempio che andrò ad illustrare, vedremo come creare un semplice scanner di qr-code (ma anche barcode), uno scanner che reindirizzerà l'utilizzatore presso una specifica pagina web.

Il componente che andremo ad utilizzare si trova nella sezione sensors (sensori) e si chiama, neanche a farlo apposta Barcode Scanner (lettore codice a barre).

Trascinato il suddetto componente nel nostro designer, quello che ci serve è un bottone per far partire il lettore di qrcode da app inventor, e qualcosa per raccogliere il codice in esso contenuto.
Per fare una prova potremmo avere sia una tipica textbox, che anche un componente di tipo web viewer.

Prima di passare ai blocchi, una piccola nota importante sul blocco barcode scanner.
Se quando lo attivate vi dimenticate di defleggare la voce Use External Scanner (usa scanner esterno), quando cliccherete per far compiere l'azione della scansione non accadrà niente, questo perchè la vostra app si aspetterà di dialogare con un lettore esterno collegato al vostro cellulare
Sembra una banalità, ma io non avevo visto quella spunta e ho perso non poco tempo per cercare di capire come mai la fotocamera che doveva fare da scanner barcode da appinventor, non partiva!

Aggiunti questi componenti, andiamo nei blocks (blocchi) ed andiamo ad aggiungere un'azione al click del bottone inserito, ovvero trasciniamo il blocco call barcode scanner do scan (esegui barcodescanner esegui scansione).
Con questo comando associato al click di un bottone, andremo ad invocare la fotocamera del cellulare, che la nostra app utilizzerà come lettore scanner sia di classici barcode, che di moderni qr-code.

Adesso però, dobbiamo trascinare il blocco when barcodescanner after scan (per sempre quando barcode scanner terminata scansione) dal quale prenderemo il valore della variabile result (risultato), e potremo farne ciò che vogliamo.
Ad esempio in questo caso, ho associato il valore della textbox al risultato ottenuto dalla scansione, in modo da poter leggere subito a video la stringa di testo nascosta nel qr code o nel barcode.

Se poi sappiamo già che il nostro qr-code app inventor 2 contiene il link ad un sito web, bè, allora basta associare il result al blocco call web viewer go to url (esegui webviewer vai a url), per far aprire dentro la nostra app per cellulare un sito internet specifico.

Il codice per creare un lettore di barcode con app inventor è davvero molto esiguo, anche perchè magari poi il più del lavoro lo farà la pagina web che leggerà il codice passato, magari con parametri via get.
Ovviamente comunque, nulla ci vieta di gestire le informazioni contenute dentro il codice a barre o qrcode, tutte tramite app, senza per forza aver bisogno di un sito web di appoggio, o della connessione ad internet.

Se hai creato il tuo primo scanner di qrcode con app inventor ma non sai come reperire un codice per fare le prove, niente paura, trovi tutte le info su come fare a questo indirizzo.
In alternativa qui sotto trovi un qrcode di prova da me generato :)

E con i barcode per app inventor direi che è tutto.
Ti lascio il solito link al progetto .aia per comodità, in modo da poter fare tutte le prove che vuoi con un lettore di qrcode già pronto per l'uso.
Ovviamente le potenzialità di questa funzionalità app inventor sono infinite, si va dalla lettura dei prezzi per il tuo locale, alla creazione di un check-in tramite barcode o qrcode per i tuoi eventi... buon lavoro!

Torna all'elenco delle lezioni

Leggere / scrivere su tabelle fusion con App Inventor 2

Dopo aver fatto una discreta parentesi introduttiva riguardante le fusion tables, è finalmente venuto il momento di vedere come è possibile leggere e scrivere dati sulle fusion tramite MIT App Inventor 2.
La particolarità di queste utilissime tabelle di google, è quella di poter essere lette e scritte da remoto.
Immaginate a dei dati online sempre disponibili per i vostri utenti, delle tabelle dove poter scrivere e leggere a piacimento dalle proprie app, ecco questo è uno dei migliori utilizzi delle google fusion tables.

Ma vediamo subito nel pratico come leggere dati presenti su una tabella fusion tramite app inventor2.
La guida presa singolarmente potrebbe risultare un po' articolata, per cui userò come appoggio i post già fatti a riguardo le fusion, e mi occuperò solo della parte di codice legata ad appinventor.

Come leggere e scrivere sulle Tabelle Fusion tramite MIT App Inventor 2

Il primo requisito da soddisfare per poter iniziare ad utilizzare le fusion tables con app inventor, è ovviamente quello di aver creato e popolato una tabella google.
Non essendo suddetto passaggio un argomento di questo articolo, vi rimando a questo post per capire meglio come fare.

Dopo aver creato la nostra tabella fusion, possiamo passare al nostro progetto app inventor.
Nel designer, cerchiamo la sezione storage (archiviazione) e trasciniamo il componente invisibile Fusion tables control (controllo tabelle fusion).

I campi immediatamente disponibili sono:

• Api key: la chiave api dove poter mettere il codice ottenuto dalla console sviluppatore di google (non ci serve per questa guida)
• Key file: il file chiave necessario per poter autenticare un account di servizio, necessario per poter accedere ad una tabella fusion privata, tramite app inventor
• Query: eventuale query subito preimpostata da interfaccia visiva (lasciare vuoto)
• Service account email: l'email dell'account di servizio, necessario per poter accedere

Dopo un po' di prove, ho valutato che l'approccio migliore per la maggior parte delle app, è quella di accedere tramite un account di servizio alle fusion tables.
In questo modo, sarà possibile utilizzare le tabelle fusion senza dover far autenticare l'utente utilizzatore.
Siccome anche la creazione di un account di servizio l'ho già trattata, vi rimando a questo post.

Ricapitolando quello che bisogna fare:

1. Creare una tabella fusion in stato privato
2. Creare un account di servizio
3. Creare un file chiave segreta p12 per l'account di servizio

Arrivati a questo punto dunque, del designer di app inventor andiamo a scrivere l'indirizzo dell'account di servizio creato, a caricare il key file, e a spuntare la voce Use service authentication (usa account di servizio).

Adesso torniamo alla nostra fusion table e clicchiamo su share ed impostiamo la tabella come privata.
Qui, aggiungiamo l'email di servizio appena creata, spuntando la voce che dice che non si vuol dare il permesso di poter aggiungere altri utenti.
E' in questa fase che si può stabilire se l'email utilizzata sarà in sola lettura o in scrittura.
Inoltre, ricordarsi di abilitare il download della tabella (file->rename), altrimenti non sarà accessibile tramite chiamate api.

Finalmente possiamo passare ad app inventor 2.
Adesso andiamo in blocks (blocchi) e trasciniamo l'oggetto call fusion tables control get rows (esegui controllo tabelle fusion ottieni righe) per ottenere i dati della tabella in consultazione, oppure insert row (inserisci riga) per accedere in scrittura.

A questi comandi dovremo passare il table id, l'id della tabella, recuperabile andando nell'interfaccia di gestione della google fusion e cliccando su File -> About this table -> ID.

Poi occorre specificare le columns (colonne) da leggere / modificare, separate da virgola.
E nel caso di un insert, indicare anche il values (valori) da assegnare.
Ed anche le conditions (condizioni), nel caso si sia scelto di utilizzare il blocco della select sulle fusion tables tramite where (per dirla alla sql).

Già con queste poche righe di codice, se avremo fatto tutto giusto, potremo leggere e/o scrivere sulle fusion tables tramite app inventor 2.
Se poi vogliamo scrivere query più specifiche e complesse, possiamo utilizzare i blocchi set fusiontables control query (imposta fusion tables controllo query) e call fusion tables do query (esegui fusion query).

Infine, quale che sia la sintassi usata, per intercettare il risultato della chiamata alle fusion tramite appinventor, occorre usare il blocco when fusion tables control got result (per sempre quando fusion risultato query ricevuto).

Se avrete fatto tutto nel modo giusto, sarete riusciti a leggere e scrivere sulle tabelle google fusion tramite mit app inventor 2, altrimenti riceverete qualche errore a video, magari di permessi.

Vi lascio con il consueto link al progetto .aia, dove per motivi di sicurezza non ho abilitato l'utente di servizio alla scrittura (e magari potrebbe anche non esistere più quando scaricherete questo progetto).

Ah già, dimenticavo, se è la prima volta che usate le api delle fusion tables, forse dovrete prima ricordarvi di abilitarle, altrimenti potreste incappare nel terribile errore "403 forbidden prokect number is not found and cannot be used for api calls".
Collegatevi al seguente indirizzo, entrate nel progetto creato per l'utente di servizio, e cercate le api per le fusion tables:
https://console.developers.google.com/apis/library
Poi cliccate su Abilita.

Bene, adesso dovreste essere in grado di usare le fusion tables da app inventor, in modo da poter sviluppare delle applicazioni che sono in grado di salvare dei dati online.
Ad esempio se sviluppate un videogioco con appinventor, può essere utile sapere come salvare i punteggi dei giocatori online... e questo è uno dei metodi più semplici :)

Torna all'elenco delle lezioni

Come popolare una fusion table da excel

Dopo aver imparato come creare una tabella fusion da zero, è arrivato il momento di vedere come fare in tutti quei casi si voglia popolare una fusion table da excel.
Questa operazione è molto banale, ma può risultare davvero non da poco sapere come poter importare un excel dentro una tabella google fusion.

Ovviamente, la fusiontable popolata, potrà poi essere utilizzata in mit app inventor 2, o per qualsiasi altro utilizzo, come ad esempio venir inclusa in un sito internet.
Vediamo subito come fare questa cosa.

Come popolare una google fusion table da excel

Per poter importare un excel dentro una fusion table, o anche un file csv, basta seguire i seguenti passaggi:

1. Accedere al proprio account google
2. Collegarsi al seguente indirizzo: https://support.google.com/fusiontables/
3. Cliccare su Fusion tables
4. Cliccare su Create a Fusion Table
5. Cliccare su From this computer
6. Cliccare su Sfoglia e caricare un file dal proprio computer, saranno accettati i seguenti formati: .csv, .tsv, or .txt
7. Cliccare su Next
8. Controllare se l'anteprima è ok, poi cliccare su Next
9. Dare il nome alla tabella ed inserire eventuali altri dati utili, infine cliccare su Finish

La tabella fusion ora conterrà tutti i dati presenti nel foglio excel (o csv, o txt, o il formato caricato), e sarà possibile da ora in avanti gestire questi dati online.

Tutto molto semplice no?
In questo modo è possibile importare dati in una tabella fusion google, con pochi semplici click, e risparmiare così ore di data entry.

Ecco un video tutorial su quanto appena spiegato:
https://youtu.be/yD93s-yXRiw



Fine tutorial sulle fusion tables per app inventor 2 (e non).

Torna all'elenco lezioni mit app inventor

Creare account di servizio Google Fusion Tables

La scorsa volta vi avevo spiegato come creare tabelle fusion da interfaccia web, e come popolarle.
Oggi invece volevo trattare la creazione di un utente di servizio per le google fusion tables.
Un "service account" è infatti un utente temporaneo, se così si può chiamare, un utente che può essere utilizzato per far fare accesso alle vostre tabelle google fusion, da mit app inventor 2, o da qualsiasi altra applicazione.

Le fusion tables infatti, possono essere condivise con tutti, ed esser lette dalle app tramite le api key, oppure venir condivise solo con chi ne possiede il link.
Se però si vuole una maggior riservatezza dei dati, occorre mettere le tabelle fusion in stato privato, e condividere l'accesso solo a specifici utenti gmail.

Vediamo quindi come aggiungere un utente di servizio per far fare accesso alle google fusion tables dalle nostre applicazioni.

Come creare account di servizio per tabelle fusion google

Per poter aggiungere account di servizio per le tabelle fusion per poter far accedere in lettura e scrittura le proprie applicazioni, tra cui per mit app inventor 2, collegarsi al seguente indirizzo:

https://console.developers.google.com/projectselector/iam-admin/serviceaccounts

Ovviamente bisogna essere loggati con il proprio account google, e dare l'ok ad eventuali messaggi dislaimer.
Ora, nella schermata, cliccare nella sezione Crea account di servizio.

Ci verrà chiesto di creare un nuovo progetto, scriviamo il nome e clicchiamo su crea per proseguire.
Adesso ci verrà chiesto nuovamente di cliccare su "crea account di servizio", e compilare i seguenti campi obbligatori:

• Nome: il nome dell'account, che farà parte dell'indirizzo gmail che andremo a creare
• Ruolo: scegliere un ruolo per questo utente di servizio fusion tables, ad esempio project->editor.
• ID account: se si vuole si può cambiare la parte iniziale dell'email che si sta andando a generare
• Chiave primaria: potete scegliere se json o p12, e vi verrà generato un file di testo da salvare sul vostro computer ed utilizzare per l'autentificazione delle vostre applicazioni.
  Per appinventor server il p12.

Finito di indicare queste configurazioni, cliccare sul pulsante Crea.

Adesso potete tornare sulla vostra tabella fusion google ed andare su File -> Rename, e spuntare la voce Allow downloads per far in modo che le api d'accesso alle tabelle siano abilitate.

Infine, per poter utilizzare l'utente di servizio appena creato in app inventor 2, e non ricevere il terribile messaggio "forbidden forbidden", andare in Share, impostare la tabella come privata, e condividerla con l'utente di servizio appena creato.
Ovviamente poi nel progetto appinventor occorrerà anche caricare la chiave p12 generata prima... ma questo è un altro post (cit.)

Tutto quanto appena scritto è un po' meglio spiegato in questo video youtube:
https://youtu.be/81-3CCjkUEk



Bene, è ora possibile utilizzare gli account di servizio per scrivere sulle tabelle fusion da mit app inventor 2.

Torna all'elenco delle lezioni

Come creare fusion tables, tabelle google per app inventor 2

Le fusion tables sono delle tabelle di google che possono essere create e gestite direttamente online.
Proprio come dei veri database relazionali, tipo mysql, le tabelle fusion di google possono essere sfogliate tramite query, sia da comoda interfaccia web, sia tramite delle api.
Oppure volendo è anche possibile includere una tabella google su un proprio sito internet.

Queste tabelle google fusion tra l'altro, possono essere usate anche in mit app inventor 2, per poter leggere e salvare online i dati delle proprie app.

Ma andiamo per ordine, vediamo subito come creare tabelle fusion, come popolarle, e come modificarle.

Come creare fusion tables, le tabelle google online per app inventor 2

Per poter usare le tabelle fusion di google occorre ovviamente possedere un account google, quindi, dopo aver fatto accesso con il vostro account, collegatevi a questo indirizzo:

https://fusiontables.google.com/

Adesso basterà cliccare sul bottone "create a fusion table" e poi scegliere l'opzione create empty table.

In realtà, si finirà in una pagina con una tabella già popolata, con una struttura prestabilita ed una riga vuota.
Poco male comunque, per modificare una tabella google fusion, la sua struttura intendo, cliccate su Edit -> Change columns.

Adesso, cliccando sui singoli campi a sinistra, si potranno cambiare le proprietà (a destra nella pagina), cambiandone il nome (colum name), il tipo (type, che va dal classico testo text ai numeri number, alle date), il formato (format), ed altri parametri tipici delle tabelle sql.

Sarà poi possibile eliminare una colonna cliccando sulla croce, o anche spostare ed ordinare i vari campi con il mouse (drag & drop).

Per aggiungere un nuovo campo in una tabella fusion, basta cliccare su New->Column, oppure su new formula column, in caso si vogliano aggiungere campi calcolati.
Infine, per completare questa fase di creazione della tabella, cliccare su Save.

Una volta creata la struttura della nostra tabella, con tutti i suoi campi e controlli, sarà possibile rinominare la tabella cliccando sul nome in alto nella pagina, e personalizzare nella finestra che si aprirà, anche altri attributi.

Infine, per popolare una tabella fusion, cliccare su Edit->Add row, oppure, per modificare un valore già inserito, cliccare sulla riga da modificare e poi sulla matita.

Una volta preparato il tutto, sarà possibile condividere la tabella google fusion con i propri amici/collaboratori, cliccando sul bottone Share in alto a destra nella pagina, decidendo se si vuole rendere il proprio database completamente pubblico, o solo per chi ha il link, oppure privato per pochi eletti invitabili via mail.

Questa era solo una rapida carrellata su come creare tabelle fusion.
In questo video tutorial trovate il tutto spiegato in maniera un po' più chiara e pratica:
https://youtu.be/Vydv5eGePfg



E con le tabelle fusion è tutto, in questo post invece è spiegato come usarle per le nostre app mit app inventor 2.

Torna all'elenco delle lezioni

Creare un lettore RSS (Mit App Inventor 2)

Ti piacerebbe creare un'applicazione per android che legge e mostra le news in formato rss?
Se la risposta è si, devo darti una buona notizia, puoi fare questo ed altro tramite mit app inventor 2.

Nel breve tutorial che ti andrò ad illustrare, ti spiegherò come far leggere ad app inventor una pagina web in formato xml, che in questo caso specifico contiene gli articoli del mio sito in formato rss.

Vediamo dunque come creare un feed reader con app inventor 2.

Come creare un lettore RSS con Mit App Inventor 2

Il procedimento che ti sto per spiegare, ricalca in parte quanto già descritto nel tutorial che spiega come connettersi a risorse remote tramite App Inventor 2 (leggi l'articolo).

Il componente necessario per compiere questa operazione è il Visualizzatore Web (Web Viewer), da trascinare come di consueto nel visualizzatore.

Avendo già spiegato tutto nel precedente post, qui non spiegherò i passaggi da seguire per settare un indirizzo di una pagina web da far aprire (in questo caso quella contenente il feed rss).
L'unica cosa che ci tengo a precisare è che, almeno a quanto ho visto, non esiste una funzione predefinita di app inventor 2 per trattare l'xml.
Quando infatti catturerai il codice sorgente della pagina, che alla fine è in pratica l'html, il lavoro che dovrai fare sarà quello di individuare dei tag delimitatori, d'apertura e di chiusura, e creare una procedura per estrarre i campi dall'rss.

Nel progetto .aia che puoi trovare a questo link, mi sono limitato a pescare dal feed rss del mio sito internet, i titoli dei miei articoli, che ho individuato all'interno di appositi tag (<title> in questo caso).
Ho dovuto quindi usare la funzione blocco dividi (split) e poi lavorare con le liste (lists).

Il risultato di queste poche righe di codice è la creazione di un'applicazione per android che legge i titoli rss dal mio sito web, nulla di esageratamente difficile, ma è sicuramente un buon inizio per lo sviluppo di applicazioni che oltre a mostrare il contenuto di uno specifico sito internet, poi possono svolgere anche altre funzioni.

Come avrai sicuramente intuito leggendo fino a qui, a seconda del sito che contiene i feed rss, dovrai individuare i delimitatori da utilizzare per estrapolare tutti i campi che ti serve mostrare sulla tua app.
In buona sostanza non esiste uno script universale a cui dai in pasto un xml e lui ti restituisce già i campi che ti interessano belli e puliti... almeno che io sappia.

Per questo breve tutorial su app inventor 2 è tutto, spero ti sia stato utile.

Torna all'elenco delle lezioni

Dialogare con una pagina PHP (Mit App Inventor 2)

Grazie a Mit App Inventor 2 puoi far svolgere molte funzioni utili al tuo cellulare, in modo da creare applicazioni e giochi che siano in grado di fare un po' di tutto.
Ci sono ovviamente però dei limiti in questa piattaforma web di sviluppo, limiti che per fortuna il php ti può aiutare a superare.

Potresti infatti avere l'esigenza di processare una variabile passata ad un pagina php, e di intercettare il risultato finale che questo script online ti restituisce.
Può essere il caso di controlli matematici avanzati, verifiche tramite funzioni che appinventor non possiede, o anche solo per potersi collegare velocemente ad un database online, uno a caso... mysql :)

Come dialogare con una pagina PHP tramite Mit App Inventor 2

Per poter passare delle variabili ad una pagina php tramite app inventor 2, ed intercettarne poi il risultato, hai bisogno semplicemente di due cose:

1. Una pagina php ospitata su di uno spazio web gratuito (ecco qui una lista)
2. Il componente Visualizzatore Web (Web Viewer) di app inventor2

Sul come creare una pagina php non metto becco, dovresti esserne tranquillamente in grado se stai leggendo questo post.
Tuttavia, ecco il codice d'esempio che ho utilizzato io nella mia pagina test.php, se può esserti utile:

<?
    $key=trim($_POST['key']);
    $testo=trim($_POST['testo']);
    if($testo<>""&&$key<>"")
    {
        if($key=="keytest") echo "$testo";
    }
?>

Sostanzialmente ho creato una pagina php che da app inventor si aspetta due variabili, una variabile chiamata $key che rappresenta il codice d'accesso di sicurezza alla pagina php, in modo che in teoria solo la mia app possa dialogare con questo script, ed una variabile chiamata $testo, che contiene la risposta da stampare a video come risultato.

Bene, adesso passiamo ad app inventor ed andiamo a trascinare nel visualizzatore il blocco VisualizzatoreWeb (WebViewer).

Ora andiamo direttamente nei blocchi (blocks) e valorizziamo al caricamento dello schermo, il blocco Imposta web indirizzo (set web url), passandogli come variabile testuale l'url della pagina php da chiamare.

Adesso aggiungiamo al click di un pulsante, il blocco Esegui web invia testo (call web post text), ovvero il blocco che serve per comunicare con pagina web.
In questo blocco, per poter passare i parametri allo script php online, creiamo una lista che contiene due liste, una a cui passiamo il key di sicurezza, ed una a cui passiamo la variabile testo.
La pagina web, aspettandosi due variabili, avrà infatti bisogno di una coppia di valori, una che gli dice come si chiama la variabile, ed una che ne indica il suo contenuto.

Infine, andiamo ad intercettare la risposta della pagina con questo blocco: Per sempre quando web lettura file completata (when web got text), al quale aggiungeremo un controllo sul codice restituito dalla pagina (se la pagina restituisce 200 è ok) tramite la variabile CodiceRisposta (ResponseCode), ed ovviamente la risposta, contenuta nella variabile ContenutoRisposta (ResponseContent).

Se avrai fatto tutto correttamente, a video la tua app ti riporterà il messaggio inserito nella pagina php, che in questo caso è: "Test php riuscito"!

Trovi ovviamente questo esempio nel progetto .aia che ti allego qui.

Questo come al solito era solo un semplice esempio di funzionamento per spiegare il dialogo tra una pagina php e app inventor 2.
Ora potrai quindi creare degli script php molto potenti, per aumentare ciò che la tua app può fare, e superare così alcuni limiti di appinventor2.

Torna all'elenco delle lezioni

Problema accentate / caratteri speciali (Mit App Inventor 2)

Stavo creando un'applicazione Mit App Inventor 2 che pesca dei dati dal classico file csv, ecco che incappo nello spinoso problema delle lettere accentate.

Se sei uno sviluppatore di vecchia data, che magari salta spesso da ambienti windows e linux, su vari linguaggi di programmazione, di sicuro sai di cosa sto parlando.
I caratteri speciali sono spesso una rogna a causa dei vari problemi di codifica, di cui spesso non si sa mai che formato usare e come mai al posto delle lettere accentate appaiono strani simboli (es. il punto di domanda).

Come risolvere il problema accentate / caratteri speciali su Mit App Inventor 2

Per superare il problema legato agli special characters in App inventor 2, ascii e compagnia bella, in modo da poter importare nella tua applicazione stringe / lettere / frasi / dati da ogni fonte (csv, mysql, tinydb, ecc...), devi risolvere il problema alla radice.

Se si tratta di dati presi da una pagina web ad esempio, bisogna specificare il charset usato già nella pagina stessa.

Se invece stiamo andando ad importare in una lista un file .csv, dopo magari averlo generato da excel, possiamo aprire il csv con il blocco note, poi, fare salva con nome, e selezionare la codifica UTF-8 (di solito va bene questa, ma nel caso fai altri tentativi, es con unicode).

Adesso non resterà altro che importare il file csv codificato dentro il nostro appinventor 2, e rilanciare il gioco/programma.
Come per magia ora le accentate si vedranno correttamente.

Spero che questa guida ti sia stata utile.
I problemi con le accentate e/o i caratteri speciali in generale, sono sempre un fastidioso ed antipatico grattacapo.
Dietro c'è tutto un perchè sul fatto che all'alba del 2017 non esistano ancora programmi e piattaforme in grado di gestirle d'ufficio, quindi quando ci si incappa, bisogna solo rimboccarsi le maniche e cercare di risolvere.

Torna all'elenco delle lezioni

Conferma chiusura applicazione (Mit App Inventor 2)

Dopo aver sviluppato un'applicazione con i controfiocchi, sarebbe un peccato se questa fosse chiusa con il semplice tasto back (indietro) del cellulare, no?
Ebbe, su Mit App Inventor 2 esiste la possibilità di far apparire un messaggio di conferma alla pressione del tasto back, in modo da chiedere all'utente se è veramente sicuro di voler uscire dall'app oppure no :)

Creare messaggio di conferma chiusura applicazione con Mit App Inventor 2

Quello che ci serve per poter generare un messaggio di conferma alla pressione del tasto back del telefono android, è un solo componente aggiuntivo, quello delle Notifiche (Notifier blocks) di App Inventor 2.

Andiamo dunque a trascinare le notifiche nel visualizzatore, poi andiamo subito nei blocchi (blocks).

Adesso, clicchiamo sulla sezione dei blocchi Screen, ed andiamo ad aggiungere il blocco Per sempre quando screen1 pulsante indietro premuto (when screen back pressed).
Grazie a questo blocco infatti, andremo a catturare l'evento della pressione del tasto back del cellulare.

Ora, aggiungiamo dentro il blocco Esegui notifiche mostra finestra scelta (call notifier show choose dialog), ed andiamo ad inserire il messaggio che più ci piace (es. "Sei davvero sicuro di voler chiudere l'applicazione?").
Tra le scelte possiamo mettere un semplice SI o NO.

Aggiungiamo ora un blocco Per sempre quando notifiche dopo scelta (when notifier after choosing) ed andiamo a mettere la condizione che se si dice di SI, l'app va chiusa con il comando Chiudi applicazione (close application).
Attenzione perchè, se ci dimentichiamo di mettere questo blocco, di fatto sarà impossibile poi per l'utente chiudere il nostro programma, e magari non ne sarà molto contento.
Ricordo inoltre che il blocco chiudi applicazione, funziona solo dopo aver installato l'app, e non in fase di sviluppo.

Lanciando dunque questo script, intercetteremo il tasto indietro del cellulare, e chiederemo una conferma di chiusura app all'utente, in modo da evitare chiusure involontarie del programma.

Trovate il solito progetto .aia d'esempio a questo link.

A mio avviso, mettere questo genere di controlli di conferma uscita dall'applicazione non è una cosa malvagia, soprattutto se sviluppiamo applicazioni che potenzialmente sarebbe bello che potessero girare in background, cosa ancora non possibile con mit app inventor 2.

Tornare all'elenco delle lezioni

Conta passi (Mit App Inventor 2)

Vuoi sapere quanti passi fai durante il giorno? Nessun problema, ci pensa Mit App Inventor 2.
Ebbene si, tra i vari sensori presenti in appinventor, c'è anche il famoso conta passi.

Contare i passi che fai al giorno può servirti per tenerti in forma, per crearti un programma specifico, per vedere quanta strada percorri, o semplicemente per capire quanto ti durano le scarpe :p
Perchè dunque scaricare ed installare un programma per android fatto da qualcun altro, quando puoi creartene tu uno da zero, in pochi secondi, con appinventor 2?

Creare un programma conta passi con Mit App Inventor 2

Per poter utilizzare la funzionalità del telefono che consente di contare i passi, aprire la sezione dei componenti app inventor 2 chiamata Sensori (sensors), e trascinare quello chiamato Pedometer (step counter).

Questo componente invisibile di appinventor viene gestito come al solito dalla sezione blocchi (blocks).

Tra i blocchi che sicuramente potranno tornare utili per adoperare al meglio questo sensore, c'è Per sempre quando pedometer passo (when pedometer walk step), che rileva il passo in avanti e può essere usato per stampare a video il numero di passi effettuati.
C'è poi un Per sempre quando pedometer passo semplice (when pedometer simple step), che a differenza del precedente, registra ogni tipo di passo, in qualsiasi direzione.

Per poter far partire questo genere di eventi ovviamente, bisogna prima lanciare il blocco Esegui pedometer Avvia (call pedometer start), che poi può essere bloccato con i rispettivi comandi di pausa, stop e reset.

Altri due comandi degni di nota presenti in questo componente sono i blocchi Tempo trascorso (elapsed time) e Distanza (distance), che possono servire per tener traccia del tempo passato dall'inizio dell'attività, e la distanza compiuta dopo un tot di passi.
Entrambi questi parametri sono azzerabili con il comando di reset.

Trovi l'esempio di questa lezione sul contapassi (stepcounter) a questo link, con il solito progetto .aia scaricabile, nel quale muovere i primi "passi" nel fantastico mondo del pedo meter di android.

Torna all'elenco delle lezioni

Creare nuovo componente (Mit App Inventor 2)

Oggi vediamo una cosa molto carina di Mit App Inventor 2, come creare nuovi componenti.
Sto parlando ovviamente della versione locale di app inventor, ovvero quella che avete installato sul vostro computer, dato che quella online non è ovviamente modificabile, salvo per l'aggiunta di qualche estensione.

Questo breve tutorial spiegherà come duplicare un componente app inventor 2 già esistente, non quindi come crearlo da zero, per il quale comunque lascerò un link con tutte le istruzioni dettagliate su come fare, a fine post.

Vediamo subito come iniziare a muovere i passi verso la creazione di componenti aggiuntivi per app inventor, che sono la base per poter creare le estensioni (quelle che poi potete distribuire).

Come creare un nuovo componente in Mit App Inventor 2

Per poter creare un componente aggiuntivo, occorre prima di tutto sapere dove risiedono i componenti di app inventor 2.
Il percorso tipico (poi dipende da dove lo avete installato) per trovare la cartella dove sono fisicamente i componenti appinventor 2, è il seguente:
C:\appinventor\appinventor\components\src\com\google\appinventor\components\runtime

Adesso, per fare un esempio pratico su come duplicare un componente app inventor, scegliamone uno a caso e facciamo copia ed incolla del file, ad esempio quello chiamato Label.java (il famoso componente etichetta).

Andiamo poi a rinominare la copia di Label.java in LabelOggi.java.

Ora, entriamo nel nuovo file appena creato con un editor di testo, ed andiamo a modificare alcuni parametri.

Cerchiamo il blocco che contiene la scritta "@DesignerComponent"e modifichiamo/aggiungiamo (se non presenti) i parametri:

• description: dove andremo a scrivere la descrizione del nostro componente, es: "Componente di prova duplicato dalla label".
• nonVisible = true: da aggiungere se non presente, altrimenti si riceverà il terribile messaggio "java.lang.UnsupportedOperationException: unknown component" (questo perchè al momento c'è il limite di poter aggiungere solo componenti nuovi non visibili)
• iconName = "images/extension.png": mettere l'url di un'icona, per farla apparire accanto al componente quando lo si vuole trascinare nel visualizzatore (campo facoltativo, ma è meglio metterlo)

Adesso cerchiamo le 2 righe
@SimpleObject
public final class Label extends AndroidViewComponent {
e sostituiamole con
@SimpleObject(external = true)
public final class LabelOggi extends AndroidViewComponent {

Infine sostituiamo
public Label(ComponentContainer container) {
con
public LabelOggi(ComponentContainer container) {

Salvare e chiudere il file.

Come avrete capito, per duplicare un componente app inventor, basta rinominare le classi univoce con un nuovo nome a nostra scelta.

Adesso, affinchè questo nuovo componente sia visibile in appinventor, occorre rifare il build dell'intero ambiente, ed anche rifare il build del companion, altrimenti non sarà possibile testarlo sul cellulare.
Se non sapete come compiere queste operazioni con Ant, trovate le istruzioni in questo post.

Ovviamente, affinchè tutto sia visibile nella nuova piattaforma appinventor, bisogna poi terminare eventuali processi attivi e riavviare il tutto.
Nel caso il processo di app inventor 2 non ne volesse sapere di terminare, vi basterà terminare il processo java, dal taskmanager di windows.

Se tutto sarà andato a buon fine, riavviando app inventor 2 (ed il browser), dovreste vedere a video il vostro nuovo componente LabelOggi, posizionato nella stessa sezione delle Etichette, ovvero in Interfaccia utente (user interface).

Con tanto di blocchi (blocks).

Questo è ovviamente solo un rapido esempio su come copiare / replicare un componente aggiuntivo.
Per creare un componente app inventor da zero, seguire questo tutorial, dove vengono spiegate tutte le classi e la struttura che compone questo tipo di oggetti appinventor.
Ovviamente, anche conoscendo bene la teoria, partire sempre da un componente già esistente, facilita molto il lavoro.

Imparare a creare/modificare componenti app inventor 2 è la base per poter aggiungere nuove funzionalità alla piattaforma, senza dover aspettare che qualcun altro le sviluppi per voi (es. admob per app inventor 2 :p).
Ovviamente, per fare tutto ciò, dovrete conoscere almeno un po' java.

Tornare all'elenco delle lezioni

Testare applicazioni tramite cavo USB (Mit App Inventor 2)

Per poter testare le proprie applicazioni Mit App Inventor 2, oltre a poter utilizzare il companion con il wifi e l'emulatore, è possibile utilizzare anche il cavo usb.

Questa modalità è sicuramente più stabile della versione wifi, che ogni tanto perde la connessione, però necessità di un pochino più di preparazione per poter essere usata.

Vediamo dunque come connettere il cellulare al computer tramite cavo usb, e come fare per farlo parlare con appinventor.

Come testare applicazioni tramite cavo USB in Mit App Inventor 2

Per poter utilizzare questa modalità di debug di applicazioni android sviluppate con app inventor 2, bisogna innanzitutto scaricare ed installare aiStarter, un software che deve girare sul proprio computer, che consente la comunicazione tra appinventor 2 ed il cellulare, tramite cavo usb.

Scaricare ed installare aiStarter per windows (o cercare quello per mac o linux) da questa pagina, cliccando su Download:
http://appinventor.mit.edu/explore/ai2/windows.html

Durante l'installazione, per comodità fleggare anche l'opzione per creare l'icona di collegamento di app inventor tools (aistarter) sul desktop del pc.

Adesso riavviare il pc, poi lanciare aistarter cliccando sull'apposita icona.

Se vi dimenticherete di lanciare aiStarter ogni volta che volete collegarvi tramite usb (se per caso riavviate il pc), riceverete a video il seguente messaggio: "The aiStarter helper does not appear to be running".

Adesso dobbiamo andare ad agire sul nostro telefono cellulare.
Innanzitutto bisogna aver abilitato la modalità sviluppatore (se non sapete come fare leggete questo post).

Entrare quindi in Impostazioni -> Opzioni sviluppatore, e spuntare la voce Debug USB.

Finalmente possiamo andare sul nostro mit app inventor 2, e cliccare su Connect -> USB.

Attendere il caricamento, e dare (almeno la prima volta) il consenso dal cellulare a questa connessione.

Se tutto sarà andato a buon fine, vedrete la vostra applicazione girare sul cellulare in versione di test, ed ogni modifica effettuata tramite appinventor 2, verrà replicata in tempo reale sul telefono.

Tornare all'elenco lezioni