Visualizzazione post con etichetta app-inventor-2. Mostra tutti i post
Visualizzazione post con etichetta app-inventor-2. Mostra tutti i post

venerdì 7 aprile 2017

Colori (Mit App Inventor 2)

Oggi ne vedremo di tutti i colori su Mit App Inventor 2... ok, ho fatto la battuta :)
L'argomento di oggi è infatti la gestione del colore in app inventor.

Ogni applicazione android che si rispetti, deve avere un suo set equilibrato di colori, che fanno parte della grafica del gioco (o dell'app).
Sapere come equilibrare bene i colori e come combinarli è una cosa da grafici, che esula da questa guida, nella quale invece vi spiegherò brevemente come colorare oggetti in app inventor.


I colori i Mit App Inventor 2


Per poter dare uno specifico colore ad un oggetto, che sia un bottone, uno schermo, una label/etichetta, una tabella, o altro, si può agire in sostanzialmente in due modi.

Colorare un bottone tramite l'interfaccia di progettazione

Si tratta di agire dalla schermata progettazione (designer) e di cambiare a mano i campi delle proprietà (properties) dell'oggetto (ad esempio un bottone), inserendo il colore sfondo (background color) ed il colore testo (text color), scegliendo uno dei valori preimpostati disponibili.

Colori (Mit App Inventor 2)


Colorare un oggetto app inventor 2 da codice


Vediamo invece come colorare un oggetto dalla sezione blocchi (blocks).
Andiamo ad aggiungere ad esempio un pulsante (button) che al click cambia il colore di sfondo e di testo di un'etichetta (label).

Le proprietà da settare saranno la Imposta etichetta colore sfondo (set label background color) e la  Imposta etichetta colore testo (set label text color).

Cliccare poi sulla sezione dei blocchi app inventor chiamata colori (colors), e trascinare il colore desiderato.

Trascina il colore desiderato

Con questo metodo stiamo usando i colori predefiniti di app inventor, altri colori aggiuntivi li possiamo trovare cliccando sul colore dopo averlo trascinato nei blocchi.

Altri colori

Ma se volessimo utilizzare dei colori specifici che troviamo online, che magari non sono presenti in app inventor?
Semplice, basta conoscere il codice RGB del colore che si vuole utilizzare, ed andarlo ad aggiungere al nostro programma tramite il blocco crea colore (make color). Nel quale andare ad aggiungere i 3 numeri da 0 a 255 rappresentanti i valori dei colori rosso, verde, blu.

RGB

Se volete ricavare l'rgb di un colore da mettere poi in app inventor, questo mio post può darvi una mano.

L'ultima funzione presente in app inventor 2 per la gestione dei colori si chiama componenti colori (split color), che ritorna una lista (list) contenente 4 elementi che rappresentano i componenti rosso, blu, verde ed alfa (valori da 0 a 255).
Al momento però non mi viene proprio in mente a cosa possa poter tornar utile lo scomporre un colore in più parti... ma non si sa mai nella vita :)

Trovate il progetto .aia di questa lezione a questo indirizzo.

E con i colori di app inventor 2 è tutto, spero che questo breve tutorial vi abbia schiarito un po' le idee (altra battuta) sull'argomento :p
I bottoni colorati app inventor, o qualsiai altro elemento voi vogliate rendere più vivace, ora sarà un gioco da ragazzi per voi poterli realizzare.

Tornare all'elenco delle lezioni

Duplicare progetto (Mit App Inventor 2)

Hai trovato online un progetto mit app inventor 2 che vorresti fare tuo, ma ha un nome che proprio non ti piace?
O semplicemente, ad esempio, vuoi creare una copia del progetto app inventor per poi editarlo senza paura di far danni?

In entrambi i casi, nessun problema, dato che è possibile duplicare un progetto app inventor quante volte si vuole ed in maniera molto semplice... talmente semplice che a momenti non servirebbe neanche questa guida... ma non si sa mai nella vita :)


Come duplicare un progetto Mit App Inventor 2


Per poter clonare un progetto app inventor, una volta, due volte o quante volte ci pare, basta seguire questi semplici passaggi:
  1. Collegarsi ad app inventor 2
  2. Se necessario, se il progetto non è tuo, importarlo nella piattaforma (se non sai come fare leggi questo post)
  3. Entrare nel progetto da duplicare
  4. Cliccare su Progetti (Projects)
  5. Cliccare su Salva progetto come (Save project as)
  6. Scegliere un nuovo nome per il progetto e poi salvare dando l'Ok.

Duplicare progetto (Mit App Inventor 2)

Ebbene si, per duplicare un progetto app inventor, basta fare un semplice salva con nome :)

Sembra una banalità ed in effetti lo è, ma visto che ad esempio per duplicare altri oggetti di appinventor bisogna un po' scerverlarsi, magari non ti era venuta subito in mente la soluzione più banale, quella che si ha proprio davanti agli occhi :)

Tra l'altro questa procedura può tranquillamente venir usata per rinominare un progetto app inventor... basta fare salva con nome e poi cancellare il vecchio progetto.

PS Una volta duplicato il procetto mit però, bada bene, devi attendere un attimo che questo venga ricaricato nella piattaforma... nel caso tu volessi subito iniziare a lavorarci.

Well, duplicate project app inventor 2, done!

Torna all'elenco lezioni

sabato 1 aprile 2017

Non far spegnere display (Mit App Inventor 2)

Parlando sempre dei limiti di Mit App Inventor 2, c'è il discorso del dislay del cellulare che non rimane acceso.
Se stai quindi giocando ad un applicazione sviluppata in app inventor, lo schermo del tuo telefonino dopo un po' si spegnerà.

Se ad esempio hai sviluppato un puzzle game, un rompicapo dove la gente deve guardare lo schermo del telefono per diversi minuti senza mai distrarsi, sapere come non far spegnere il display è una cosa fondamentale per il tuo gioco per android.
Vediamo dunque un accrocchio fatto apposta per poter superare questo limite di app inventor 2.


Non far spegnere il display in Mit App Inventor 2


Per poter mantenere acceso lo schermo del cellulare in un'applicazione sviluppata con app inventor, occorre aggiare il problema tramite un particolare barbatrucco.

Normalmente bisognerebbe agire, tra le altre cose, nel manifesto dell'app (androidmanifest.xml), aggiungendo questa riga:
<uses-permission android:name="android.permission.WAKE_LOCK" />
Cosa però non possibile in app inventor2.

Quindi, la soluzione è la seguente:
  1. Aggiungere alla tua app una notifica (notifier), dal pannello Interfaccia utente (user interface)
  2. Impostare la notifica con colore di sfondo e colore testo trasparente, e settare la lunghezza della notifica come corta (short)

    Non far spegnere display (Mit App Inventor 2)
  3. Aggiungere un componente di tipo orologio (clock) dal pannello sensori, lasciando come intervallo 1000
  4. Andare in Blocchi (blocks)
  5. Aggiungere il blocco Per sempre quando orologio timerconcluso esegui (when clock timer do) ed inserire l'azione Esegui notifica mostra avviso (call notifier show alert notice) impostando un'etichetta di testo vuota (label).

imposta notifica nel clock

Così facendo, ogni secondo apparirà una notifica invisibile sul display del cellulare, impedendo allo standby di partire.
L'aver impostato la notifica in modo che sia invisibile inoltre, non influirà in alcun modo sull'aspetto grafico del gioco.

L'unico limite di questo metodo è che la notifica, anche se non visibile, ha comunque un piccolo ingombro, e che si posizionerà al centro dello schermo.
Questo vuol dire che se avrai qualche tasto proprio in quel punto, se uno ci clicca sopra, potrebbe avere un minimo di intoppo durante la pressione.

Ho fatto diverse prove con questo metodo, e considerando che in teoria il tempo minimo in cui una persona può impostare lo standby dello schermo del cellulare, è di 15 secondi, in teoria si poteva settare la notifica ogni 10 secondi. Tuttavia ho comunque notato che lo schermo inizia a spegnersi prima, e che quindi se la notifica deve ripassare dopo tot secondi, allora per un po' di tempo si potrebbe avere lo schermo in penombra. Quindi l'unica soluzione per non far spegnere mai il display del cellulare in app inventor, è quella di settare la notifica proprio con un intervallo di un secondo.

Ci sarebbe poi un'altra soluzione, che vi linko qui.
Tramite l'installazione di un componente aggiuntivo /estensione (extension).
L'ho provata e funziona, c'è il keep monitor on (KeepScreenOn) ed keep display off.
Quindi se non è un problema per te installare estensioni su appinventor (se non sai come fare leggi qui), questo secondo metodo è sicuramente più rapido di quello che ti ho appena illustrato.

Torna all'elenco delle lezioni

giovedì 30 marzo 2017

Aggiungere estensioni (MIT App Inventor 2)

Dopo aver imparato a fare un po' di tutto su MIT App Inventor 2, forse è venuto il momento di superare i suoi limiti.
Si perchè, questa bellissima piattaforma, nonostante consenta di creare app per cellulare più o meno complesse, ha diversi limiti, soprattutto nella gestione dell'hardware del telefono.

Per poter dunque inserire nuove funzionalità ai tuoi programmi creati con app inventor 2, devi imparare ad aggiungere estensioni alla piattaforma.
Vediamo subito come fare.


Come aggiungere estensioni a MIT App Inventor 2


Per poter aumentare le funzioni che hai a disposizione su app inventor, quello che devi fare è andare in progettazione (designer), e sulla destra, nella colonna componenti disponibili (palette), scrollare la pagina fino a trovare le estensioni (extension).

Cliccare dunque su extension di app inventor 2, e poi su Import extension.

Come aggiungere estensioni a MIT App Inventor 2

Adesso avrai a disposizione due scelte, o inserire l'url dal quale scaricare l'estensione, oppure caricare un file .aix dal tuo computer.

import extension app inventor 2

L'estensione .aix dovrebbe contenere del codice java appositamente confezionato per girare sotto mit app inventor 2.
Adesso, voglio dire, se uno usa questo genere di framework, credo che non abbia voglia di studiarsi java, quindi magari il tuo caso sarà quello in cui caricherai un'estensione creata da qualcun altro... ma ovviamente nessuno ti vieta di smanettare da solo per crearti le tue estensioni.

Una volta atteso il caricamento dell'estensione, occorrerà scegliere un nome, in modo che tutti i componenti aggiuntivi in essa contenuti, vengano sempre riconosciuti con quel nome.

Scegli un nome

A procedura completata, troverai una nuova voce nella sezione extension di app inventor 2, una voce che si chiama esattamente con il nome che le hai dato prima.
Trascina la tua estensione nello schermo (screen) desiderato, per iniziare ad usufruire di nuove funzionalità che prima magari erano solo fantascienza.

La tua nuova estensione

Andando poi in blocchi (blocks), troverai una sezione dedicata alla tua extension, cliccando poi sulla quale vedrai tutti i blocchi/funzionalità/procedure in essa contenute.

I blocchi dell'extension

Bene, è tutto.
Ora non ti resta altro da fare che scandagliare la rete alla ricerca di file .aix extension app inventor 2, per poter creare programmi sempre più sofisticati... senza scrivere una riga di codice :)

Torna all'elenco delle lezioni

domenica 26 marzo 2017

Resettare ListView / VistaLista (MIT App Inventor 2)

La Listview o VistaLista (grezzamente tradotta in italiano), è un componente di MIT App Inventor 2 molto utile per mostrare a video dei risultati presenti dentro una lista (list).

Le listview possono essere popolate direttamente dalla schermata di progettazione, compilando la voce ElementiDaStringa (Elements from string), oppure tramite codice, nella sezione blocchi.

Quello che però voglio spiegarvi in questo breve tutorial, è come resettare una listview / vistalista, cosa non banale come si potrebbe pensare, dato che questo componente è assai limitato al momento.


Come Resettare ListView / VistaLista in MIT App Inventor 2


Prima di azzerare la listview, vediamo prima come popolarla.
Facciamolo dal visualizzatore, come nella foto qui sotto mostrata.

ListView / VistaLista in MIT App Inventor 2

Oppure popoliamo la vistalista app inventor tramite codice, usando il comando Imposta listview ElementiDaStringa (set listview elementsfromstring), che andrà a prendere i valori separati da virgola contenuti in una variabile.
Oppure ancora, si può anche popolare la listview prendendo direttamente i valori salvati in una lista, tramite il comando Imposta listview elementi (set listview elements).

Adesso che abbiamo popolato la nostra vistalista, vediamo come resettare una listview in app inventor 2.
Con resettare intendo deselezionare tutti gli elementi della listview, in modo che non ci sia alcun elemento sottolineato.
Sembra assurdo, ma non c'è un vero e proprio comando per fare ciò, quindi ecco lo stratagemma che ho trovato io:

Imposta listview elementi a listview elementi (set listview elements to listview elements)

Resettare ListView / VistaLista (MIT App Inventor 2)

Tramite questo comando la listview verrà di fatto ricaricata, e ci sarà quindi un impercettibile reset, che avrà come risultato finale il vedere la nostra lista senza più alcun elemento selezionato.

In questo link trovate il progetto .aia da importare per testare il funzionamento delle vistelista.

PS Tra gli altri limiti dell'elemento list view / vista lista, c'è il fatto che non è possibile ordinare una listviews app inventor.
Sembra assurdo ma al momento è così.

Tornare all'elenco delle lezioni

sabato 25 marzo 2017

Andare a capo testo etichetta / label (MIT App Inventor 2)

Potrà sembrare una banalità, ma anche sapere come andare a capo in un'etichetta / label in Mit App Inventor 2, non è una cosa poi così scontata.

Quando aggiungi un'etichetta in app inventor infatti, hai la possibilità di popolarla sia dalla schermata di progettazione (designer), sia dai blocchi (blocks).
Ma se si vuole scrivere del testo su più righe, come si fa?
Te lo spiego subito!


Come andare a capo in una etichetta / label con MIT App Inventor 2


Banalmente, per poter andare acapo in una label di app inventor, basta usare la seguente sintassi:

\n

Tutto qui, semplice no?
Meglio che però ti spieghi meglio una cosa.
Questa sintassi di wrap text app inventor 2, equivale al codice per andare a capo, e va usata senza alcuno spazio tra le righe/parole della tua etichetta.

Quindi, se devi mettere su 2 righe una frase/testo, dovrai popolare la tua etichetta app inventor 2, scrivendo così:
Riga1\nRiga2
Senza lasciare alcuno spazio prima e dopo il \n, altrimenti ad esempio, la seconda riga partirà con uno spazio sulla sinistra.

Andare a capo testo etichetta / label (MIT App Inventor 2)

Tra l'altro, questa sintassi funziona anche per andare a capo con il testo dei bottoni di app inventor, quindi suppongo sia valida anche per altri elementi che contemplano il text.

Torna all'elenco lezioni

venerdì 24 marzo 2017

Come usare le Procedure (MIT App Inventor 2)

MIT App Inventor 2 possiede, come ogni ambiente di sviluppo che si rispetti, la possibilità di creare procedure.

Ma che cos'è una procedura?
Una procedura è una sorta di funzione/raggruppatore di blocchi di istruzioni, che può essere lanciata da qualsiasi altro blocco, per poter eseguire un elenco di istruzioni codificato.
Quando si usano le procedure?
Sostanzialmente quando ci sono dei blocchi di codice che si vuole riciclare/riutilizzare, in modo da risparmiare righe di codice (o di blocchi, in questo caso).

Vediamo dunque come creare una procedura in app inventor 2, con e senza parametri, e come fare per richiamarla con un semplice click.


Come usare le Procedure in MIT App Inventor 2


Per creare una procedura andiamo in blocchi (blocks) e poi clicchiamo su Procedure (procedures).
Adesso possiamo trascinare il blocco Crea procedura esegui (to procedure do), dare un nome alla nostra procedura, ed aggiungere un'azione al suo interno, tipo popolare un'etichetta (label).

Per chiamare una procedura dobbiamo sempre riaprire il menù procedure e trascinare il blocco Esegui nomeprocedura (call nomeprocedura) nel punto in cui vogliamo che essa venga eseguita, ad esempio al click di un bottone.

Avremo così creato ed eseguito una procedura su app inventor 2.

Se poi vogliamo passare dei parametri alla procedura, ci basta cliccare sull'ingranaggio della procedura in questione, e trascinare al suo interno uno o più Parametri (inputs).
Poi ovviamente, quando si andrà ad aggiungere una chiamata alla procedura in questione, bisognerà passargli anche tutti i parametri precedentemente definiti.

Come usare le Procedure in MIT App Inventor 2

Se poi vogliamo utilizzare una procedura che restituisce dei risultati, trasciniamo il blocco Crea procedura risultato (to procedure result).
Questo tipo di blocco che ci consente di creare funzioni app inventor 2 che restituiscono un risultato, vanno utilizzate con il blocco Esegui con risultato (do results) presente nella categoria di blocchi Controllo (control).

Per maggiore chiarezza sull'utilizzo delle procedure in app inventor, vi lascio il link per scaricare il progetto .aia.

Imparare ad utilizzare al meglio le procedure in app inventor 2 è molto importante, dato che queste ci consentono di creare (ad esempio) delle vere e proprie funzioni da lanciare e rilanciare quante volte si vuole, facendoci risparmiare tempo e fatica.

Tornare all'elenco delle lezioni

domenica 19 marzo 2017

Svuotare il backpack (MIT App Inventor 2)

Il backpack è il repository dei blocchi (blocks) di MIT App Inventor 2.
In una delle scorse lezioni vi avevo spiegato come fare per riempirlo (leggere questo post per scoprire come fare), oggi invece vediamo come ripulirlo.

Sapere come svuotare il backpack, alla lunga, è una nozione che può risultare fondamentale, soprattutto quando inizia ad essere un po' troppo pieno.
Questa operazione, in realtà molto banale, potrebbe risultare difficile in un primo momento, perchè l'opzione per fare piazza pulita nello zaino di app inventor, non si trova esattamente dove uno si aspetterebbe di trovarla.


Come svuotare il backpack di MIT App Inventor 2


Per cancellare tutti i blocchi presenti nel backpack di app inventor, con un solo colpo, seguire la seguente procedura:
  1. Entrare nella sezione blocchi (blocks) di un qualsiasi progetto app inventor
  2. Cliccare con il tasto destro del mouse in un punto vuoto del visualizzatore
  3. Cliccare sulla voce Empity the backpack e dare la conferma

Come svuotare il backpack di MIT App Inventor 2

Avrete così cancellato in un solo colpo tutti i blocchi presenti nel vostro zainetto app inventor.

Lo so che questa sembra un'operazione facile, una banalità, e di fatto lo è.
Ma se siete finiti in questo post da google, significa che anche voi non sapevate dove trovare l'opzione per svuotare il backpack di app inventor :)

Come si capisce se nel backpack di app inventor ci sono degli oggetti?
Semplice, o ci si clicca sopra, oppure lo si intuisce anche solo ad occhio nudo, facendo caso al fatto che l'icona dello zaino è diversa.

backpack vuoto

Esatto, il backpack privo di oggetti è rappresentato da uno zaino vuoto.

Tornare all'elenco delle lezioni

Elenco lezioni MIT App Inventor 2

Qui di seguito trovate un elenco delle lezioni di MIT App Inventor 2, un programma / interfaccia web che consente di creare app per cellulari Android.
Grazie a questa guida infatti, sarete in grado di creare la vostra prima App per cellulare, da usare per voi, o da distribuire ai vostri amici... o al mondo intero, tramite play store.

MIT App Inventor 2 è un'ottima piattaforma di sviluppo, adatta anche e soprattutto per chi non sa programmare.
Infatti, con app inventor potrete creare un'applicazione per cellulare, anche senza conoscere una riga di codice, tramite una semplice e comoda interfaccia visuale molto intuitiva

Guida MIT App Inventor 2

App inventor è comunque un ambiente di sviluppo complesso, con una moltitudine di funzionalità e opzioni.
Forse non sarà possibile sviluppare videogiochi o programmi complessissimi, e questo ambiente ha comunque i suoi limiti, ma se imparerete ad usarlo e a conoscerlo bene, magari grazie a questo tutorial, sarete presto in grado di creare applicazioni di tutto rispetto.

Provate dunque a seguire e a mettere in pratica i trucchi ed i suggerimenti qui man mano riportati, e piano piano anche voi diventerete dei veri sviluppatori per android.

Elenco lezioni MIT App Inventor 2

sabato 18 marzo 2017

Copiare blocchi da un progetto ad un altro (MIT App Inventor 2)

Una delle necessità che mi è sorta dopo un po' che sviluppavo in MIT App Inventor 2, è stata quella di dover copiare dei blocchi da un progetto ad un altro.

Quando può servire il voler spostare dei blocchi (blocks) da un progetto ad un altro, o da uno schermo (screen) ad un altro?
Semplice, se ad esempio creiamo una funzione in un programma/progetto, che però può tornarci utile anche in un'altra app, allora duplicare il blocco è decisamente un'operazione più rapida che riscrivere tutto da capo.
Purtroppo però, la classica funzione di duplicazione blocchi può essere svolta solo all'interno di uno stesso schermo, quindi ecco che ci viene incontro una apposita funzionalità di app inventor.


Come copiare dei blocchi da un progetto ad un altro  in MIT App Inventor 2


Dopo queste brevi ma doverose promesse, eccomi subito a spiegarvi la soluzione al quesito del giorno: copiare dei blocchi su progetti diversi.

Lo strumento che ci serve è lo zainetto, ovvero il backpack.
Grazie a questo strumento infatti potremo spostare uno o più blocchi da uno screen ad un altro, o da un progetto ad un altro.

Quindi nel concreto, ecco cosa bisogna fare:
  1. Aprire il progetto dove si trova la funzione/procedura da copiare
  2. Cliccare con il tasto destro del mouse sui blocchi desiderati
  3. Selezionare la voce Add to backpack
    Spostare blocchi tra progetti MIT
  4. Adesso, aprire il progetto in cui si vuole copiare il blocco
  5. Cliccare sul backpack (icona dello zainetto nella schermata blocchi)
  6. Trascinare nel visualizzatore i blocchi da copiare
Blocco clonato

Ed ecco fatto, ora la vostra funzione sarà stata riportata nell'altro progetto, e non dovrete scrivere alcuna riga di codice (per modo di dire) aggiuntiva.
Ovviamente però, se i blocchi copiati fanno riferimento a dei componenti che il progetto destinatario non possiede, la procedura importata non funzionerà correttamente.

E se volessimo copiare un blocco da un progetto esterno (non nostro)?
E' il caso in cui troviamo online esempi di funzioni/procedure app inventor create da altri, che vorremmo poter utilizzare nelle nostre app.
In questo caso ci basterà:
  1. Scaricare il file .aia dal sito che offre gratuitamente il progetto
  2. Aprire app inventor 2 e cliccare su: Progetti -> Importa progetto .aia dal mio computer
  3. Copiare i blocchi che ci interessano nel backpack
  4. Aprire la nostra app ed estrarre la procedura appena copiata nel backpack

Tutto molto semplice no? Spostare blocchi tra progetti app inventor è semplice, si, se si sa come fare :p

Torna all'elenco delle lezioni

mercoledì 15 marzo 2017

Funzioni matematiche (MIT App Inventor 2)

A scuola non eri bravo con la matematica?
Niente paura, ci pensa MIT App Inventor 2!

Ebbene si, app inventor, tra le sue tante funzionalità, ha anche la possibilità di compiere alcuni operazioni matematiche.
Somma, sottrazione, moltiplicazione, divisione, elevamento a potenza, seno, coseno, radice quadrata, arrotondamenti per eccesso o per difetto, tangente, frazioni, e tanto altro ancora troverai all'interno di mit app inventor 2.


Come usare le funzioni matematiche di MIT App Inventor 2


Su questa cosa c'è poco da dire, se non che come al solito bisogna cliccare sulla voce blocchi (blocks) e poi, ovviamente, pigiare sulla sezione matematica (math).

Ora non ci basterà altro che trascinare la funzione matematica desiderata nel visualizzatore, ed il gioco è fatto.

funzioni matematiche di MIT App Inventor 2

La sezione matematica è sicuramente una delle più usate in app inventor 2, dato che il primo blocco è proprio quello che consente di valorizzare le variabili con un numero (itero o decimale), e quindi grazie ad essa è possibile salvare valori numerici ed incrementarli con il + o con il -.

Se poi fosse necessario sapere qual è il numero minore tra quelli presenti in delle variabili, basta utilizzare il blocco chiamato min.
Mentre per il blocco è un numero (is a number?) ci può sicuramente tornare utile per i controlli delle form per le nostre applicazioni per cellulare.

min e is a number

A questo indirizzo trovi un progetto .aia con qualche esempio di funzioni matematiche di app inventor.

Le potenzialità della sezione dei blocchi matematici di app inventor sono sicuramente elevate, e possono tornare sempre utili anche se non si sta costruendo un programma che simula la calcolatrice... cosa che tra l'altro potresti provare a fare, per allenarti ad imparare tutti i blocchi presenti in questa sezione.

Torna all'elenco delle lezioni

Numero casuale (MIT App Inventor 2)

La funzione che vorrei mostrarvi oggi su MIT App Inventor 2 riguarda i numeri casuali.
Estrarre un numero casuale è infatti un'operazione che prima o poi può servire a tutti, anche se si sviluppano applicazioni pure non troppo complesse.
Vediamo dunque come svolgere questa semplice operazione.


Come estrarre un numero casuale con MIT App Inventor 2 


Per poter ottenere dei numeri random per la propria app per android, basta andare in blocchi (blocks) e cliccare sulla sezione matematica (math).

Ora, ciò che ci serve è il blocco chiamato intero casuale tra 1 a 100 (random integer from 1 to 100).

Trascinando infatti questo blocco e cambiandone il range (numero minimo e numero massimo) in base alle proprie esigenze, sarà possibile estrarre un numero (intero) casuale da poter utilizzare come ci pare e piace.

Numero casuale con MIT App Inventor 2

Grazie a questa funzione random number di app inventor 2, potremo ad esempio creare un programma per cellulare che estrae i numeri del lotto, oppure, integrando questa funzione con una procedura appositamente creata, potremo generare dei codici alfanumerici casuali, utilizzabili ad esempio per la generazione delle password.
Insomma, saper estrarre un numero casuale con app inventor 2, può tornare sempre utile.

Per poter provare subito l'esempio pratico di questa lezione, cliccare qui per scaricare il progetto app inventor in formato .aia.

La casualità del numero estratto con questo metodo, è garantita da questa funzione random, ma se avete bisogno di estrarre solo una volta un numero, vi occorrerà salvare i numeri già usciti da qualche parte.
Per far ciò, vi basterà ad esempio usufruire dei blocchi di tipo liste (lists), utilizzandoli come array per controllare che un numero non sia già stato estratto in precedenza.
Dovrete quindi aggiungere di volte in volta alla lista che contiene i numeri estratti, solo i numeri non ancora usciti, e ripetere la procedura di generazione numero random, fino a che non sarà uscito un valore inedito.

Torna all'elenco delle lezioni

domenica 12 marzo 2017

Cancellare blocchi (MIT App Inventor 2)

Una delle cose che sicuramente vi capiterà di fare programmando in MIT App Inventor 2, è cancellare dei blocchi (blocks).
L'operazione è ovviamente semplice e banale, e non servirebbe una guida, ma come si dice... tutto fa google... scherzo, vi mosterò 3 metodi con cui è possibile cancellare un blocco in app inventor 2.


Come cancellare dei blocchi in MIT App Inventor 2


Per eliminare un blocco su app inventor, seguire uno dei seguenti metodi:
  1. Tasto destro sul blocco da eliminare, poi cliccare sulla voce Elimina blocco (Delete block)
  2. Selezionare il blocco cliccandoci sopra con il mouse (verrà evidenziato in giallo), poi cliccare il tasto CANC
  3. Trascinare il blocco sull'icona del cestino e rilasciarlo

Cancellare blocchi (MIT App Inventor 2)

Attenzione però a tre cose:
  1. Cancellando un blocco che contiene altri blocchi, ovviamente tutti questi sottoblocchi verranno cancellati a cascata
  2. A meno che non si tratti di un numero più o meno consistente di blocchi, l'operazione di cancellazione non richiede conferma
  3. Anche se vedete l'icona del cestino, i blocchi cancellati sono persi per sempre, quindi occhio a cosa cancellate

Bene, ora anche eliminare blocchi su app inventor è un'operazione che non ha più segreti per voi, buon delete!

Tornare all'elenco delle lezioni

venerdì 10 marzo 2017

Salvare dati su TinyDB (MIT App Inventor 2)

Ogni applicazione per cellulare (e non) che si rispetti, deve avere la possibilità di salvare i dati delle partite dei vari giocatori/utilizzatori.
Su Mit App Inventor 2 è ovviamente possibile memorizzare dei dati sul telefonino dove è installata l'app da noi creata, utilizzando diverse tecniche, una delle quali fa uso di un componente chiamato TinyDB.


Come inserire/recuperare dati tramite TinyDB di MIT App Inventor 2


Per poter salvare dei dati della nostra applicazione sul cellulare, in modo ad esempio da salvare il livello in cui siamo arrivati in un determinato gioco, o dei punteggi, bisogna utilizzare il componente TinyDB, presente nella sezione Archiviazione (storage).

Dopo aver trascinato il componente invisibile tinydb nel visualizzatore, clicchiamo su blocchi (blocks), per andare subito a vedere come leggere e scrivere dati su questo database di app inventor.

Per poter salvare dei dati su tinydb, basta utilizzare il seguente blocco: esegui tinydb memorizza valore, etichetta / valore da memorizzare (call tinydb storevalue), dove nel campo etichetta (tag) potremo mettere una stringa di testo per dare il nome alla variabile da salvare, e nel campo valore (value to store) potremo indicare il testo, il numero o la lista con i dati che stiamo andando a memorizzare.

Un suggerimento che posso darvi è quello di chiamare le etichette con magari il nome dell'app seguito dal nome della variabile da memorizzare, in modo da non aver problemi anche in fase di debug con app inventor.

Per poter richiamare i dati salvati invece, aggiungere il blocco chiamato esegui tinydb ottieni valore etichetta / valore se etichetta non presente (call tinydb getvalue), dove ovviamente nel campo etichetta va indicata la variabile da richiamare, mentre in valore se etichetta non presente (value if tag not there) va scritto cosa vogliamo che questa funzione restituisca in caso non trovi alcun dato.

Salvare dati su TinyDB

Un altro blocco molto utile di tinydb è esegui tinydb cancella tutto (call tinydb clearall), che in un colpo solo ci consente di svuotare tutte le variabili memorizzate su tinydb dalla nostra app.

Se volete fare qualche prova, qui trovate il file di progetto .aia con già i blocchi valorizzati come da esempio appena citato.
Se ad esempio lanciate l'app, salvate i dati, poi chiutete, riaprite e richiamate i dati, li ritroverete come per magia in memoria.

Come potrete ben capire, tinydb è uno strumento quasi indispensabile se si vogliono sviluppare applicazioni di un certo calibro con mit app inventor 2.

Torna all'elenco lezioni

lunedì 6 marzo 2017

Cambiare ordine schermi / screen (MIT App Inventor 2)

Avendo iniziato a creare la mia prima applicazione completa per cellulare tramite MIT App Inventor 2, dopo un po' mi sono trovato davanti ad un problema banale quanto apparentemente insormontabile: cambiare l'ordine degli screen (schermi).

Si perchè, dopo aver quasi terminato la mia app per android, mi sono reso conto che ci voleva prima di tutto uno schermo introduttivo, la classica home page dell'applicazione per intenderci.
Avevo infatti creato il mio gioco, facendolo partire immediatamente, ho poi ho deciso di aggiungere una schermata introduttiva con tanto di opzioni. Quindi, sono andato ad aggiungere uno schermo chiamato Schermo2 (screen2), ed è solo allora che ho scoperto che non è possibile ordinare gli screen in mit app inventor 2.

cambiare l'ordine degli schermi / screen in MIT App Inventor 2

Vediamo quindi come riuscire a superare questo limite dell'ambiente di sviluppo.


Come cambiare l'ordine degli schermi / screen in MIT App Inventor 2


Per poter riordinare le schermate di una nostra applicazione app inventor, mettendo ad esempio lo schermo 1 (screen1) dopo lo schermo 2 (screen2) e lo schermo 3 (screen3) prima dell'1, occorre agire al di fuori del browser.

Prima di tutto bisogna che sia chiaro il concetto di import/export progetti mit.
Poi, seguire questi passaggi:
  1. Esportare il progetto della nostra applicazione, salvando il file .aia sul nostro pc e facendone una copia di sicurezza prima di andare a metterci mano
  2. Creare una cartella temporanea sul nostro pc, chiamandola temp (o come ci pare)
  3. Aprire il file .aia salvato sul pc, con un programma tipo winzip
  4. Entrare nella cartella src, e continuare a salire fino a trovare l'ultima cartella figlia contenente una serie di file con estensioni .bky, .scm, .yail (a me ad esempio il .yail non c'era, quindi modificate solo i file che trovate)

    screen da rinominare
  5. Copiare tutti i file trovati, nella cartella temporanea creata in precedenza (temp)
  6. Se (ad esempio) le schermate mit da riordinare sono 2 (es. screen1 e screen2), partite da screen1.bky, screen1.scm e screen1.yail, e rinominate tutti file in screenX.estensione. Poi rinominare i file screen2.estensione in screen1.estensione, ed infine rinominare i file screenX.estensione in screen2.estensione, in modo da invertire l'ordine dei file
  7. Adesso aprite tutti i file screen1.estensione con un editor di testo e cercate e sostituite tutte le occorrenze della parola Screen2 con Screen1 (dato che in precedenza il file che ora si chiama screen1, era in realtà screen2), poi ripetete l'operazione con tutti i file screen2, rinominando le occorrenza di Screen1 in Screen2 (ed ovviamente salvate poi tutti i file modificati)
  8. Infine, andare nell'archivio scaricato, nella cartella dove abbiamo preso i file, e sovrascriverli con i nuovi file (oppure cancellarli e ricarcarli, se si è proprio cambiato nome a qualche schermata)
  9. Una volta salvato il nuovo file .aia, andare in mit app inventor e cancellare il progetto originale
  10. Infine, importare sul sito di MIT, il nuovo progetto tramite il file .aia

Il risultato finale sarà quello di aver riordinato nella maniera che più ci aggrada le schermate della nostra applicazione MIT App inventor.

Ordine screen mit invertito

Il metodo sopra indicato è più facile a farsi che a dirsi, tuttavia è davvero strano che questa applicazione non consenta già con qualche semplice click del mouse di riordinare gli screen, dato che cambiare l'ordine degli schermi di un gioco creato su mit app inventor 2, è un'esigenza più che legittima, che prima o poi vi capiterà sicuramente se sviluppate qualche gioco o applicazione un po' complessa.

Elenco lezioni

Esportare / Importare progetti (MIT App Inventor 2)

Tra le varie possibilità messe a disposizione da MIT App Inventor 2, c'è anche quella di poter esportare ed importare progetti.
Questa utile funzionalità infatti, può servirci per salvare sul proprio computer un progetto, modificarne alcuni dati, e poi reimportarlo online, oppure per condividere un progetto con un amico, oppure ancora semplicemente, per poter avere una copia di backup dei propri progetti mit app inventor sul pc di casa.


Come Esportare / Importare progetti in MIT App Inventor 2


Vediamo subito come eseguire l'operazione di import / export di un progetto app inventor.

EXPORT
  1. Aprire il progetto che si vuole esportare
  2. Poi cliccare sul menù Progetti e poi su Esporta il progetto selezionato .aia nel mio computer (Export selected project .aia to my computer)
  3. Salvare il file di progetto con estensione .aia sul proprio computer

Importare progetti in MIT App Inventor 2

Adesso, dopo aver fatto le opportune modifiche al file .aia (che è un file archivio che può essere aperto con winzip, winrar, ed altri programmi simili), per poterlo reimportare online su mit app inventor, occorre prima cancellare il progetto originale.

Per cancellare un progetto mit quindi: cliccare su I miei progetti (my projects), selezionare il progetto desiderato, ed infine cliccare sul bottone cancella progetto (delete project).
Ovviamente, attenzione a non sbagliare, perchè se cancellerete un progetto di cui non avete fatto il backup... byebye ad ore ed ore di lavoro!

Ora che abbiamo fatto pulizia, andiamo subito a fare l'import del progetto.

IMPORT
  1. Cliccare su Progetti (projects)
  2. Selezionare la voce Importa progetto .aia dal mio computer (Import project .aia from my computer)
  3. Selezionare il file del progetto (nomeprogetto.aia) dal proprio computer e dare l'ok

Avrete così importato un progetto completo dal vostro pc a mit app inventor 2.

Grazie a questo procedimento potrete mandare i progetti da voi creati, a tutti i vostri amici programmatori app inventor, magari per chiedergli una mano :)

Elenco lezioni

domenica 5 marzo 2017

Eseguire blocchi (MIT App Inventor 2)

Quando si sviluppano applicazioni particolarmente lunghe in MIT App Inventor 2, una cosa molto utile in fase di debug, è la possibilità di eseguire dei blocchi specifici.

Se ad esempio vogliamo far compiere una specifica azione alla nostra applicazione, per vedere se abbiamo scritto bene il codice, senza però dover aspettare di arrivarci a suon di click, ecco che può tornare utile sapere come far partire un singolo blocco con un semplice click del mouse.


Come eseguire specifici blocchi  in MIT App Inventor 2


Veniamo subito al dunque, per eseguire un blocco specifico, basta compiere i seguenti passi:
  1. Cliccare con il mouse sul blocco desiderato per selezionarlo
  2. Cliccare con il tasto destro del mouse
  3. Scegliere l'opzione Esegui (Do it)

Come eseguire specifici blocchi

Il blocco selezionato verrà immediatamente eseguito, e verranno invece ignorate tutte le altre istruzioni presenti nella nostra app per android.

Ovviamente poi, se si tratta di un blocco padre, con tante istruzioni figlie al suo interno, queste verranno tutte eseguite a cascata, quindi occorrerà compiere questa operazione cliccando solo sul blocco che si vuole lanciare.

Un'altra banalità, ma ve la scrivo lo stesso, è quella che per poter vedere l'esecuzione di un blocco lanciato a mano, dovrà essere attivo, o l'emulatore per pc, oppure l'app in questione dovrà girare sul cellulare, sul quale si vedrà immediatamente l'effetto del nostro click da computer.

Torna all'elenco lezioni

venerdì 3 marzo 2017

Duplicare blocchi (MIT App Inventor 2)

Una delle più utili e comode funzionalità di MIT App Inventor 2 è quella che ti dà la possibilità di duplicare i blocchi (blocks).
Poter replicare/copiare un blocco infatti, ci consente di non dover riscrivere tutto dall'inizio, ma solo di modifare la parte di codice che ci interessa.
Vediamo dunque come fare


Come duplicare i blocchi  in MIT App Inventor 2


Per poter duplicare un blocco in app inventor, la procedura da seguire è molto semplice:
  1. Cliccare con il mouse sul blocco da duplicare, questo verrà sottolineato in giallo
  2. Cliccare con il tasto destro del mouse
  3. Selezionare la voce Duplica (Duplicate)

Come duplicare i blocchi  in MIT App Inventor 2

Il blocco selezionato verrà subito duplicato, e sarà pronto per essere modificato.

Questa procedura è molto utile non solo per duplicare un singolo blocco di codice, ma soprattutto perchè duplica anche tutti i blocchi in esso ramificati, quindi è uno strumento molto potente di app inventor 2, che con un click ci consente di risparmiare minuti preziosi di "prendi e trascina".

Ovviamente però, i blocchi replicati/copiati conterranno al loro interno i riferimenti alle variabili dei blocchi d'origine, quindi andranno tutti modificati a mano.

Torna all'elenco lezioni di MIT

giovedì 2 marzo 2017

Disabilitare blocco (MIT App Inventor 2)

Un'altra funzionalità molto utile per uno sviluppatore di app per android tramite MIT App Inventor 2, è la possibilità di disabilitare blocchi di codice.
Disattivare uno o più blocchi infatti, può consentirci di fare il debug di un'applicazione, saltando brutalmente una serie di azioni nidificate.
Vediamo dunque come fare.


Come disabilitare blocchi su MIT App Inventor 2


Per disattivare un blocco della nostra app, in modo che non venga eseguito quando lanciamo l'app sul nostro cellulare, seguire i seguenti passaggi:
  1. Selezionare con il mouse il blocco da disabilitare
  2. Cliccare con il tasto destro
  3. Cliccare sulla voce Disabilita blocco (Disable block)

Disabilitare blocchi su MIT App Inventor 2

Il blocco selezionato diventerà di color grigino, e quando andremo ad eseguire la nostra applicazione, quel blocco, e tutti quelli in esso nidificati (se presenti), verranno saltati.

Blocco disattivato
Per riattivare un blocco disattivato in mit app inventor 2 invece, selezionare il blocco, tasto destro del mouse, e poi Abilita blocco (Enable block). 

Leggi altri post tutorial su Mit App inventor

Variabili locali (MIT App Inventor 2)

Dopo aver parlato più in generale delle variabili in Mit App Inventor 2, vediamo di affrontare più nel dettaglio le variabili locali (local variables), per capire meglio come usarle.
Questo tipo specifico di variabile, viene usato all'interno di procedure o blocchi, ed ha valore solo in ambito limitato, a differenza delle global var, che sono disponibili per tutta l'app.


Variabili locali in MIT App Inventor 2


Una variabile locale può essere creata andando nella sezione blocchi (blocks) di App inventor.
Bisogna cliccare sulla categoria Variabili (variables) e poi trascinare la voce Inizializza variabile locale nome al valore (Initialize local name to).

Come dicevo poco sopra, questo genere di variabile va creato all'interno di una procedura o di un blocco già esistente, quindi ad esempio creiamo una procedura (procedure) chiamata prova e trasciniamoci al suo interno la nostra variabile locale.

Adesso, dopo aver dato un nome alla nostra variabile (es. pippo), possiamo decidere come valorizzarla e che azioni svolgere con essa.
Se infatti agganciamo qualcosa dopo la dicitura al valore (To), staremo andando a dare un valore alla nostra variabile, pescandolo da un'altra variabile (presumibilmente globale), o inserendo a mano un valore testuale, numerico o booleano.

Nella sezione del blocco chiama In (In) invece, andremo ad esempio a metterci, o un altro valore, oppure potremo compiere subito qualche azione.
Infatti, potremmo decidere di valorizzare manualmente la nostra variabile con Imposta nomevariabile al valore (Set namevariable to), fargli eseguire qualcosa, come ad esempio Imposta etichetta testo a (set label text to), e poi rivalorizzare nuovamente la variabile e fargli fare qualcos'altro, senza dover quindi creare ulteriori variabili.

Variabili locali in MIT App Inventor 2

L'esempio citato in effetti è abbastanza inutile, ma ammettiamo di voler valorizzare 10 oggetti diversi con lo stesso numero, metterlo dentro una variabile locale è sicuramente il metodo più corretto, così se si decide poi di cambiare quel numero, lo si fa una volta sola.

Cliccando qui comunque, trovate il progetto .aia per fare una prova.

Imparare ad usare le variabili locali di app inventor 2 può tornare molto utile in certi casi, quindi è bene quanto meno iniziare a conoscere il loro funzionamento.
Torna all'elenco delle lezioni su MIT