Widget: i componenti interattivi

4 giugno 2014

In questo capitolo faremo conoscenza da vicino con i widget. Che siano tutti discendenti della classe View ormai l’abbiamo imparato. Ma quali sono i widget più comuni in Android? Ne elenchiamo alcuni:

  • TextView: la classica label. Serve a rappresentare del testo fisso;
  • EditText: corrisponde all’inputbox di altre tecnologie. Viene usata per permettere l’inserimento del testo. Mediante attributi XML può essere adattata alle proprie necessità. Molto utile è android:inputType i cui valori definiscono i formati più comuni di input (date, password, testo, etc.);
  • Button: è il pulsante. La casistica più comune comporterà la gestione dell’evento click per attivare una qualche reazione nell’Activity;
  • CheckBox: come ci si aspetta definisce un classico flag che può essere attivato o disattivato. Nel codice Java leggeremo il suo stato (checked o unchecked) mediante un valore booleano;
  • Radio: esistono i radiobutton come in ogni altra tecnologia per interfacce utente. Vengono solitamente usati per definire valori alternativi tra loro come il sesso di una persona (maschio/femmina), possesso di facoltà (automunito Sì/No), etc.

L’elenco dei widget sarebbe sconfinato. Ne esistono veramente di ogni tipologia per poter aiutare l’utente ad introdurre gli input più variegati. Per ulteriori approfondimenti, fare pure affidamento alla documentazione ufficiale.

Widget al lavoro: un esempio

Nel capitolo relativo agli Intent, si era immaginato un form di login.

Un modulo di login in Android

Vediamo come potrebbe essere nel dettaglio.

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
         <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Username:"/>
         <EditText
        android:layout_width="@dimen/width"
        android:layout_height="wrap_content"
        android:inputType="text"
        android:id="@+id/username" />
    </TableRow>
    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
         <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Password:"/>
         <EditText
        android:layout_width="@dimen/width"
        android:layout_height="wrap_content"
        android:inputType="textPassword"
        android:id="@+id/password" />
    </TableRow>
    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
         <Button
         android:layout_width = "wrap_content"
         android:layout_height = "wrap_content"
         android:onClick="login"
         android:text="Login"/>
          <Button
         android:layout_width = "wrap_content"
         android:layout_height = "wrap_content"
         android:onClick="cancel"
         android:text="Cancella"/>
    </TableRow>
</TableLayout>

Notiamo gli aspetti salienti:

  • come layout è stato usato un TableLayout particolarmente adatto alla realizzazione di form che spesso mostrano una struttura a griglia molto regolare;
  • tra i controlli usati alcuni mostrano l’attributo android:id. Serve  per lo più alle EditText usate per inserire username e password dell’utente che sta tentando il login. L’id sarà indispensabile per recuperare dal codice Java i valori inseriti;
  • i due widget Button presentano l’attributo onClick usato per definire quale metodo dell’Activity si occuperà della gestione del click sul pulsante. Rappresenta una scorciatoia rispetto all’uso dei listener.

Il primo Button presenta questa valorizzazione di onClick:

android:onClick="login"

Ciò comporta che nell’Activity dovremo trovare un metodo della seguente forma:

public void login(View arg0)

dove il nome del metodo corrisponde al valore dell’attributo onClick e il parametro View in input rappresenta il widget che ha sollevato l’evento, in questo caso il Button.

Uno sguardo da vicino al metodo login nell’Activity ci mostra come i widget vengono richiamati nel codice Java.

public void login(View v)
{
       EditText username=(EditText) findViewById(R.id.username);
       EditText password=(EditText) findViewById(R.id.password);
       String account_username=username.getText().toString();
       String account_password=accounts.get(username.getText().toString());
       . . .
       . . .
}

Il metodo findViewById viene usato per recuperare il controllo corrispondente all’id.

Anche in questo caso R.id.username corrisponde all’attributo android:id=”@+id/username” che è stato assegnato all’EditText. Dando uno sguardo alla documentazione dei widget, si dovrà di volta in volta riconoscere quei metodi che servono a recuperare il valore del controllo.

In elementi come TextView e EditText rivolti al trattamento del testo, con un metodo getText() si potrà leggere il contenuto e gestirlo come una stringa.

Tutte le lezioni

1 ... 15 16 17 ... 80

Se vuoi aggiornamenti su Widget: i componenti interattivi inserisci la tua e-mail nel box qui sotto:
Tags:
 
X
Se vuoi aggiornamenti su Widget: i componenti interattivi

inserisci la tua e-mail nel box qui sotto:

Ho letto e acconsento l'informativa sulla privacy

Acconsento al trattamento di cui al punto 3 dell'informativa sulla privacy