Contatore, programmare un’app sul serio

android_hello world

Dopo i due articoli sulla nostra app Hello World, eccone uno un po’ più serio, dove vedremo anche qualcosa del codice e del layout, andando a creare un Contatore.

Creiamo dunque un nuovo progetto, dando nome Contatore e package quello che volete, creiamo la Activity e apriamola subito appena dopo aver finito con la creazione del progetto.

Ci troveremo davanti ad un’interfaccia all’incirca così:

Schermata di Eclipse della Activity

L’Activity si può aprire clickando due volte a sinistra su res/layout/activity_nome.xml

Vedrete subito che più o meno in mezzo abbiamo i controlli da poter inserire nell’Activity, quindi procediamo in questo modo: eliminiamo la scritta Hello World che viene inserita di default clickandoci sopra e premendo “Canc” sulla tastiera, quindi prendiamo un Large Text e trasciniamolo all’interno dell’Activity. Nello stesso modo prendiamo due Button e mettiamoli sotto il testo. Avrete notato di  certo che vi sono dei triangolini gialli sopra i componenti che abbiamo messo, vediamo di sistemare questo “Warning”.

Facciamo doppio click sul testo, e verremo mandati in un ambiente testuale che all’inizio potrebbe confondere, ma tranquilli: questo non è altro che la stessa Activity di prima. Incredibile? Sappiate che l’Editor che Eclipse e l’SDK usano per creare un’Activity salva le vostre scelte nel formato xml, che altro non è che quello che ora state leggendo su Eclipse.

Stringhe, dimensioni: XML

Vedrete anche che il warning ci viene segnalato nelle righe in cui si trova il testo che già c’era di default. Questo accade perché spesso le app sono localizzate, e quindi avere una centralizzazione delle stringhe aiuta i traduttori, non dovendo andare a cercare nel codice ma avendo un posto in cui tutte le stringhe risiedono. È comunque buona norma, anche in casi di piccole app, centralizzare le stringhe. Come facciamo? Apriamo il file res/values/strings.xml

Notate che anche questo è un xml ma Eclipse ci mostra un’interfaccia più intuitiva per inserire le stringhe. Inseriamo le 3 stringhe, chiamandole “testo1”, “button1”, “button2”, e dando i valori “0”, “+”, “-“. Salviamo il documento con CTRL+s e torniamo all’xml dell’activity.

Ora invece del “Large Text” andiamo a scrivere @string/testo1, e così per il resto, come in figura

Codice xml dell'Activity Contatore modificato
Codice xml dell’Activity Contatore modificato

Vedete che abbiamo appena inserito una sorta di link, con i quali diciamo “vai a vedere nel file strings”. In questo modo possiamo controllare tutte le stringhe proprio da quel file.

Possiamo anche cambiare grandezza qui, nell’XML, andando a modificare i parametri android:layout_width, android:layout_height per larghezza e altezza, dove “wrap_content” significa “fallo abbastanza grande perché il contenuto ci stia”.

Perché farlo qui e non nell’Editor apposito? Perché spesso l’Editor fa casino, e si deve ricorrere all’XML, provate voi a modificare la grandezza di un componente dall’Editor, vi renderete conto che è un’impresa impossibile in quanto non è sviluppato benissimo, e comunque un po’ di sano XML non fa male a nessuno.

Possiamo modificare appunto anche i riferimenti e i margini con gli altri parametri, stando attenti che i componenti hanno un ID NON deciso in principio da noi, questi ID sono casualmente uguali a ciò che abbiamo scritto nel file strings. Infatti il nome/ID del primo componente (il testo) è textView1, il secondo button1 e il terzo button2.

Infine decidiamo di ingrandire il testo, sebbene già sia grande, aggiungendo la proprietà android:textSize=”80sp”, usate “sp” e non “dp” per le stringhe.

XML finale dell'Activity Contatore
XML finale dell’Activity Contatore

Programmiamo!

Bene, torniamo alla schermata dell’Activity con il tasto in basso “Graphical Layout”, e noterete che Eclipse ha fatto il suo dovere, mettendo le stringhe nei componenti e aggiustando le grandezze, i riferimenti e i margini.

Ora però l’Activity non fa ancora niente, o meglio, verrà visualizzata ed i bottoni si potranno premere, ma al loro tap non succederà niente. Vediamo come programmarli.

Attenzione: da ora in poi lascerò sottointese alcune parti, riguardanti la programmazione generale e alcune in Java, quindi abbiate almeno un’infarinatura! Ciononostante l’argomento non è troppo difficile, ma ritengo che sia un prerequisito minimo, se non sapete dove iniziare, googlate “Java”.

Bene, rechiamoci nel file src/nome.del.package/Contatore.java e creiamo tre variabili globali, all’interno della classe ma fuori da ogni metodo, una di tipo TextView e le altre due di tipo Button, importando i relativi package con CTRL+SHIFT+o.

TextView testo1; Button button1; Button button2;Andiamo nel metodo onCreate generato di default, e alla fine aggiungiamo, per inizializzare le variabili, facendo capire ad Android che noi vogliamo che quelle variabili contengano un riferimento ai componenti utilizzati precedentemente, identificandoli grazie al loro ID, alcune righe. Usiamo prima di tutto il metodo findViewById ereditato dalla classe Activity, consci del fatto che usandolo ci verrà restituita una View, e quindi dovremo aggiungere un cast a TextView, quindi:

testo1 = (TextView) findViewById(R.id.textView1);Facciamo lo stesso per i due button, modificando il parametro textView1 con button1 e button2, e modificando il cast con Button.Ora creiamo due Listener, di tipo OnClickListener, e leghiamoli subito ai due pulsanti. In questo esempio ho preferito usare il metodo della creazione di una classe anonima, ma se volete, e se viene richiesto dalla complessità del progetto, è consigliabile usare classi normali. Ecco quindi il codice

Vedete che abbiamo usato il metodo della classe Button “setOnClickListener” dando come parametro una classe anonima che implementa “OnClickListener”, che essendo un’interfaccia crea il metodo onClick che accetta la View v.

Quello che vogliamo che venga fatto ora, per i due pulsanti, va messo nel metodo OnClick.

Ecco un esempio, aggiungendo la variabile contatore. Attenzione che nel modificare il testo della textView dobbiamo settare un parametro String, quindi usiamo String.valueof(parametro)

Codice Finale di Contatore.java
Codice Finale di Contatore.java

Ed eccoci giunti al termine anche di questa guida, come al solito vi lascio disponibile l’apk da scaricare da Aptoide, buon divertimento!

Seguiteci anche su Facebook, Google Plus e Twitter, per restare sempre in contatto con noi e con le nostre guide.