4.5: I RadioButton in Android

Condividi su:

Dopo un paio di articoli focalizzati sul prendere confidenza con i primi elementi introdotti, procediamo con un nuovo oggetto grafico: i RadioButton.

Cosa sono i RadioButton

I RadioButton non sono altro che quegli elementi di una lista dov’è possibile selezionarne solo uno. Quella sorta di caselle di spunta, ma col pallino. Per rendere chiara la cosa, ecco l’app che vogliamo creare per imparare ad utilizzare questo nuovo elemento:

App

I RadioButton, la maggior parte delle volte, sono imprescindibili da un altro oggetto, il RadioGroup. Questo fa da elemento genitore dei RadioButton e li raggruppa.


Il layout dell’app

A noi interessa sapere come funziona questo nuovo elemento, quindi la nostra app sarà molto semplice. Avrà una TextView contenente la domanda da porre all’utente; un RadioGroup che raccoglie le risposte possibili (gestite tramite RadioButton) e, infine, una TextView che specificherà la risposta data.

Sulle TextView nulla da dire, se non che quella che specifica la risposta data sarà gestita ovviamente a runtime, quindi la inseriamo, le assegniamo un ID e magari la settiamo su invisibile. Quella della domanda, invece, può essere settata in tutto già nel layout.

Prima di aggiungere i RadioButton, bisogna inserire un RadioGroup. Entrambi li trovate facilmente nella lista di widget disponibili. Aggiunto questo, non dobbiamo fare altro che popolarlo con i RadioButton di cui necessitiamo. Questi dovranno essere figli del RadioGroup, quindi, piuttosto che trascinarli nell’anteprima del layout, li portiamo sopra il RadioGroup, nella sezione “Component tree”.
Nell’editor testuale basterà inserire i tag relativi ai RadioButton prima del tag di chiusura del RadioGroup.

Completato il layout, assicuriamoci di inserire tutti gli ID, sopratutto del RadioGroup, che di default non l’ha.

Gestire i RadioButton all’interno del codice

Finito col layout, possiamo passare alla logica. Essenzialmente non c’è nulla di così diverso da quanto già visto.

Per prima cosa definiamo gli oggetti che ci serviranno all’interno del codice:

private TextView answer;
private RadioGroup radioGroup;
private RadioButton radioButton;

Manca la TextView relativa alla domanda: non dovendo farci nulla a runtime, non ci serve definirla. Avrete anche notato che abbiamo dichiarato un solo oggetto di tipo RadioButton, mentre ne abbiamo tre nel layout, fra poco vedremo perché. Fatto questo, possiamo assegnare i riferimenti all’interno del metodo “onCreate()”:

answer = (TextView) findViewById(R.id.answerID);
radioGroup = (RadioGroup) findViewById(R.id.radioGroupID);

Tralasciamo il RadioButton, poiché acquisiremo in maniera dinamica il riferimento del radio selezionato, quindi in seguito al verificarsi dell’evento.

Il listener

Per prima cosa, dobbiamo collegare un listener al RadioGroup, creando poi l’oggetto a cui sarà demandata la gestione dell’evento:

radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener(){
});

Ovviamente, avendo a che fare con un evento di natura diversa, non un click, ma il cambio di selezione su un elemento del gruppo di radio, anche il setter del listener sarà diverso, così come l’oggetto che gestirà l’evento. Il meccanismo è lo stesso, cambia l’evento da monitorare e quindi gestire.

Fatto questo non ci resta altro da fare che l’override del metodo che verrà richiamato al verificarsi dell’evento. Banalmente, vogliamo cambiare il contenuto della TextView in base al RadioButton selezionato.
Vediamo prima la definizione del metodo, essendo anche questo nuovo:

public void onCheckedChanged(RadioGroup radioGroup, @IdRes int checkedID) {
}

Questo è il metodo che viene richiamato quando si verificherà l’evento di cambio selezione, come parametri riceve il RadioGroup e l’ID del RadioButton selezionato. Ovviamente AndroidStudio ci vene in aiuto: una volta impostato il listener, apparirà una lampadina rossa al lato del codice; qui sarà presente un collegamento che permetterà di far scrivere a lui questa parte di codice, provare per credere.

Passiamo ora alla logica vera e propria. Per prima cosa, assegniamo il RadioButton selezionato all’oggetto predisposto prima:

radioButton = (RadioButton) findViewById(checkedID);

Ora è chiaro perché non abbiamo dichiarato tanti oggetti quanti sono i radio presenti, recuperiamo di volta in volta solo quello selezionato.
Fatto ciò controlliamo quale sia quello selezionato. Conosciamo tutti gli ID dei vari RadioButton, quindi, banalmente, basterà confrontare questi con quello selezionato e agire di conseguenza.


L’istruzione “switch”

Avendo tre radio, dovremmo scrivere altrettanti “if”. In questo caso, però, ci viene d’aiuto un’istruzione particolare: lo “switch”. Questo svolge la stessa funzione di una serie di “if” che controllano lo stesso valore, ma con un codice più elegante, vediamolo:

switch (radioButton.getId()){
    case R.id.yesID:{
        answer.setText(R.string.yesAns);
        answer.setVisibility(View.VISIBLE);
    }
    break;
    case R.id.noID:{
        answer.setText(R.string.noAns);
        answer.setVisibility(View.VISIBLE);
    }
    break;
    case R.id.maybeID:{
        answer.setText(R.string.maybeAns);
        answer.setVisibility(View.VISIBLE);
    }
    break;
}

Per prima cosa, c’è la keyword “switch” seguita dal valore da controllare (nel nostro caso l’ID del radio selezionato) che recupereremo con l’apposito metodo. Dopo vengono tutti i casi da analizzare (case condizione: istruzioni_da_eseguire) col relativo codice da eseguire nel caso si verifichi quella condizione. Avrete notato che dopo ogni gruppo “case” è presente l’istruzione “break”. Questa permette di saltare direttamente fuori lo “switch”. Omettendola, verrebbe eseguito anche il codice di tutti i “case” successivi a quello verificato, cosa che assolutamente non vogliamo, quindi ci facciamo aiutare da questa istruzione un po’ offlimits. In generale, si tendono ad evitare salti all’interno del codice, ma in questo caso è proprio necessario. L’alternativa sarebbe stata inserire un ulteriore controllo sull’ID del radio con un “if” all’interno dei vari “case”, ma così diventerebbe poi superfluo utilizzare lo “switch”.
Lo “switch” prevede anche un caso di default, cioè possiamo stabilire del codice da eseguire in quei casi non coperti dalle varie condizioni. Nel nostro esempio sarebbe impossibile, quindi non l’abbiamo utilizzato.

Per completezza, essendo un argomento nuovo, vediamo la struttura di uno “switch” in generale:

switch (variabile da controllare){
    case valore1:{
        //Istruzioni
    }
    break;
    case valore2:{
        //istruzioni
    }
    break;
    //altri "case"
    default:{
        //Istruzioni
    }
    break;
    }

In sintesi, se la variabile da controllare è uguale a “valore1”, allora viene eseguito il codice che segue; se è uguale a “valore2”, esegue il codice che segue questo. Se non è uguale a nessuno dei casi stabiliti, viene eseguito il codice che segue “default”. Per evitare che venga eseguito anche il codice dei “case” successivi, utilizziamo l’istruzione “break” per uscire dallo “switch”.

Conclusioni

La nostra app è completa, questo il codice completo di MainActivity:

MainActivity
Click per ingrandire

Con questo abbiamo terminato l’app di prova dei RadioButton, non ci resta che provarla e sperimentarne varianti. Nel prossimo articolo introdurremo le SeekBar.

Condividi su:

label, , , ,

About the author