#Lezione 1

##Benvenuti alla Lezione 1 del corso Android - Rosa Luxemburg Qui di seguito in [fig.1] lo screenshot dell'applicazione nello stato iniziale , senza aver ancora introdotto nulla di nuovo. Per visualizzare tale immagine sullo schermo dell'emulatore, dovete semplicemente lanciare l'applicazione Android non appena avete creato una nuova lezione, come spiegato nella Procedura-creazione-nuova-lezione.

screenshot [fig.1]

Qui sarebbe necessario spiegare i concetti fondamentali della programmazione in Android, di cui ho fatto cenno a lezione: il layout e il codice java sottostante tale layout. Per una disanima esaustiva dei valori possibili per ogni parametro, lasciatemi dare solo i link dell'help online situato a questo indirizzo: Android Developers

altrimenti ci dilungheremmo troppo su particolari che anche se non approfonditi adesso, diverranno familiari al programmatore man mano che prosegue nella stesura del codice. Nonostante ciò farò cenno ad alcuni di questi valori riguardanti taluni parametri, per chiarirne l'effetto visivo che essi generano, se e quando sarà necessario , durante la stesura del presente documento.

#xml: Nella lezione 1 aggiungiamo al nostro layout una etichetta

<TextView/>

####id="tvContatore"

e due

<Button/>

####id="bAdd" e id="bSub" come visibile in [fig.2]

screenshot1 [fig.2]

Andiamo quindi a valorizzare una serie di parametri necessari alla corretta visualizzazione degli oggetti inseriti.

Nella TextView abbiamo i parametri id (identificativo di risorsa, unico per ogni oggetto), layout_width (ampiezza dell'oggetto), layout_height (altezza dell'oggetto), text (testo che mostra l'etichetta), gravity (posizione del testo nell'etichetta), textSize (dimensione del testo in screen-pixels sp), textStyle (stile del testo). Per ognuno di questi parametri esistono dei valori forniti dall'ide semplicemente mettendo il cursore al centro del valore e premendo ctrl-space sulla tastiera.

Abbiamo già detto che l'id (android:id="@+id/tvContatore") è un identificativo.

(android:layout_width="fill_parent") dice che voglio che l'etichetta in larghezza, occupi tutto lo spazio fornito dal parent ovvero dall'oggetto che lo contiene, in parole povere significa che l'etichetta deve essere larga quanto lo schermo dello smartphone o tablet che mostra questa attività.

(android:layout_height="wrap_content") invece vuole che l'etichetta , in altezza, sia delle dimensioni appena necessarie a contenere il testo che mostra l'etichetta in qualsiasi dimensione esso venga scelto.

(android:text="Contatore = 0") è l'etichetta che la TextView mostra all'utente.

(android:gravity="center") vuole che il testo sia esattamente al centro dell'etichetta, non a sinistra o destra.

(android:textSize="35sp") è la dimensione del testo in screen-pixels.

(android:textStyle="bold") infine lo stile del testo, bold, ovvero in grassetto.

<TextView
    android:id="@+id/tvContatore"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="Contatore = 0"
    android:gravity="center"
    android:textSize="35sp"
    android:textStyle="bold" />

Ora, senza aggiungere altre spiegazioni potete sicuramente applicare quello detto per la TextView anche per i due Button, essendo i parametri utilizzati, pressocchè gli stessi. (è chiaro che i due oggetti, TextView e Button sono diversi e numerosi parametri dell'uno possono non esistere nell'altro e viceversa e quindi possono essere valorizzati se necessario, oltre quelli qui indicati.

<Button
    android:id="@+id/bAdd"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="Aggiungi [1]" />

<Button
    android:id="@+id/bSub"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="Sottrai [1]" />

Ottenendo infine il codice sottostante:(vedi [fig.3])

screenshot2 [fig.3]

Non abbiamo ancora parlato dell'altro oggetto contenuto nel layout il quale funge da contenitore per i tre oggetti di cui sopra:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    ....TextView....Buttons....

</LinearLayout>

screenshot3 [fig.4]

E' interessante dire qualcosa su (** android:orientation="vertical"**) che è un parametro nuovo rispetto a quelli già analizzati, e che appartiene a questo tipo di oggetto; ci dice che il layout ha un'orientazione di tipo verticale, ciò significa che gli oggetti contenuti all'interno di questo tag xml, appaiono in colonna l'uno sotto l'altro nella successione con la quale li abbiamo inseriti nel corpo del tag. Quindi, dato che il codice è il seguente:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    ...

    <TextView
        android:id="@+id/tvContatore"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Contatore = 0"
        android:gravity="center"
        android:textSize="35sp"
        android:textStyle="bold" />

    <Button
        android:id="@+id/bAdd"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Aggiungi [1]" />

    <Button
        android:id="@+id/bSub"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Sottrai [1]" />

</LinearLayout>

il nostro layout mostrerà per prima la TextView e sotto in colonna i due bottoni bAdd e bSub.

Questo è il layout grafico che otteniamo:

screenshot4 [fig.5]

Passiamo ora al codice java: #java:

Il codice consiste in una classe di nome MainActivity che discende dalla classe ActionBarActivity.Class(), che a sua volta discende dalla classe

##Activity.Class()

La classe contiene alcune variabili istanziate dopo la dichiarazione di classe:

int counter;
TextView myTextView;
Button add, sub;

come si vede [fig.6] la dichiarazione di una variabile è uno statement formato dal nome della classe seguito dal nome della variabile che eredita quella classe, e termina con un punto e virgola ; La nostra classe contiene poi la funzione onCreate() all'interno della quale possiamo personalizzare il layout della nostra attività.

##onCreate(){}

Le prime operazioni in assoluto, che deve svolgere la funzione onCreate() al suo interno sono:

1.richiamare la stessa funzione del padre (super) passandogli come parametro quello del figlio Bundle savedInstanceState , contenente lo stato dell'attività salvato dopo l'ultima precedente esecuzione della stessa. (questo vuol dire che se abbiamo ad esempio cambiato una variabile booleana da true a false durante l'ultimo utilizzo dell'applicazione, chiudendo l'applicazione quel parametro è stato salvato e viene ricaricato ora).

super.onCreate(savedInstanceState);

2.Selezionare il layout dell'attività, e questo viene fatto dall'istruzione:

setContentView(R.layout.activity_main);

dove R.layout.activity_main fa riferimento al file R.java creato automaticamente dall'aplicazione e contenente i codici esadecimali a ciascuno dei quali orrisponde un oggetto grafico sul layout.

Abbiamo quindi deciso con questa istruzione, che il layout della nostra attività è contenuto nel file activity_main.xml che mostra gli oggetti in lui contenuti nell'iterfaccia utente. (vedi [fig.2])

Vengono infine inizializzate le variabili create nella classe:

counter = 0;
myTextView = (TextView) findViewById(R.id.tvContatore);
add = (Button) findViewById(R.id.buttonAdd);
sub = (Button) findViewById(R.id.buttonSub);

A questo punto l'applicazione mostrerà la faccia dell'attività MainActivity all'utente, ma non potremo fare nulla di interessante fino a quando non intercetteremo gli eventi che gli oggetti grafici lanciano ogni volta che l'utente interagisce con essi attraverso un click o sarebbe meglio dire un tap, cioè toccandoli o scrivendo al loro interno, come si fa nella compilazione di un qualsiasi modulo.

screenshot5 [fig.6]

##Evento onClick(){}

Per intercettare, ad esempio l'evento lanciato dal bottone buttonAdd quando facciamo tap su di esso dobbiamo dichiarare di volerlo intercettare istanziando la classe Listener dell'oggetto tramite la chiamata alla funzione setOnClickListener() e facendo qualcosa (di interessante si spera) all'interno della funzione onClick(){} della classe stessa passata come parametro con la dichiarazione

new OnClickListener(){}

All'interno , come si vede, l'evento viene intercettato e quello che produce è l'incremento della variabile contatore con l'istruzione: contatore++; dopo di chè viene aggiornata l'etichetta tvContatore dicendole di mostrare come testo la stringa "Contatore = "seguita (+) dalla variabile contatore or ora incrementata.

(come si evince da quanto fino ad ora descritto, il novizio dovrebbe rendersi conto che qualsiasi cambiamento di stato dell'applicazione deve essere descritto e programmato con dovizia di particolari, essendo il computer, fondamentalmente una macchina stupida che non è in grado di prendere decisioni autonomamente; a parte questa premessa, il lato positivo che fa si che un essere umano decida di fare il programmatore sono i risultati visibili dopo il duro lavoro, e la capacità di poterli descrivere nelle loro operazioni atomiche, a livello concettuale. In definitiva direi: un buon esercizio per la nostra mente e una macchina che fa , o meglio dovrebbe fare, (dipende sempre da noi), tutto quello che le diciamo di fare.

add.setOnClickListener(new OnClickListener() {

  @Override
  public void onClick(View v) {
    // TODO Auto-generated method stub
    contatore++;
    tvContatore.setText("Contatore = " + contatore);
  }

  });