Android LinearLayout tutorial

Il LinearLayout è il più fondamentale layout manager usabile su android; organizza le sue view orizzontalmente o verticalmente a seconda del valore della proprietà: android:orientation :

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
	android:orientation="horizontal"

	android:layout_width="fill_parent" 
	android:layout_height="wrap_content"> 
	<!--qui si aggiungono view o layout figli--> 
</LinearLayout> 

Nel codice sopra, la proprietà android:orientation può valere horizontal o vertical. Definisce il modo in cui le view saranno organizzate: orizzontalmente o verticalmente appunto. Facciamo un passo avanti e vediamo una implementazione pratica; per iniziare progettiamo una pagina di login che apparirà come nella figura seguente:

schermata di login con LinearLayout vertical

Inseriamo una TextView per il titolo (Accedi o Registrati), due EditText per digitare username e password, e due Button per Accedi e Registrati. Il codice dell’Activity sarà come quello sotto.

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/title"
        android:textSize="28sp"
        android:layout_gravity="center_horizontal"/>
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/username"
        android:padding="10dp"
        android:hint="@string/username_hint" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/password"
        android:inputType="textPassword"
        android:padding="10dp"
        android:hint="@string/password_hint" />
    <Button
        android:id="@+id/submit"
        android:layout_width="200dip"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="@string/login" />
    <Button
        android:id="@+id/register"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="@string/register" />
</LinearLayout>

Come si vede nel codice XML sopra:

  • Linear Layout ha due proprietà: layout_height e layout_width. In Android bisogna impostare queste due proprietà per definire l’altezza e la larghezza delle view rispetto alle altre nel proprio livello gerarchico. Quindi l’impostazione va fatta sia nelle view che nei layout (che sono a loro volta considerate view)
  • wrap_content riempie lo spazio in base al proprio contenuto (fino al massimo consentito dalla view genitore)
  • match_parent o anche fill_parent che è oramai deprecato, riempie tutto lo spazio disponibile (fornito dalla view genitore)
  • se si vuole specificare un’altezza o una larghezza statica si può fornire il valore in dp. Per esempio, nel codice sopra i due button hanno una width statica di 200dp
  • dp o anche dip sta per Device Indipendent Pixel serve a impostare il numero di pixel in base alla densità fisica dello schermo. Usare dp o dip è indifferente anche se (come dice la documentazione) dp è più coerente con sp
  • sp sta per Scale-independent Pixels. Si può usare al posto di dp; nel codice sopra è stato usato nella proprietà: android:textSize per impostare la dimensione statica del titolo dell’Activity. Bisogna dire che sp è come dp ma è anche ridimensionato in base alle dimensioni del font scelte dall’utente. Si raccomanda di usare sp quando questa unità si riferisce alla dimensione dei font in modo tale che quest’ultima venga aggiustata sia in base allo schermo che in base alle impostazioni dell’utente (relativamente ai font).

Capire il funzionamento di weight e gravity

Oltre a orientation, anche gli attributi weight e gravity possono cambiare la dimensione e la posizione delle view figlie in un LinearLayout manager.
Si usa android:weight per dare maggiore importanza relativamente alla dimensione rispetto agli altri controlli del container. Ad esempio, ipotiziamo di avere tre controlli: uno con weight 1, gli altri con weight 0. In questo caso il controllo con weight 1 consumerà lo spazio vuoto del container. Nel nostro esempio inseriamo android:weight=1 nel secondo Button al posto di impostare la larghezza staticamente come prima (android:layout_width=”200dip”).
Si usa android:gravity per specificare l’allineamento interno alla view (vedi alla fine di questo articolo per maggiori chiarimenti). Per esempio, se si vuole allineare il testo di una TextView a destra, si dovrebbe impostare la gravity a destra. Ci sono alcuni valori possibili per la gravity che sono: left, center, right, top, bottom, center_vertical, clip_horizontal, e altri.

LinearLayout con orientation horizontal

schermata di login con LinearLayout orizzzontale


La schermata mostra l’effetto di weight pari a 1. Abbiamo inserito i due Button in un nuovo LinearLayout ma stavolta con orientation orizzontale per avere i due Button allineati. Nel primo Button è stata impostata una dimensione (larghezza: weight) statica di 200dp, mentre nel secondo impostando android:weight a 1 imponiamo al Button di prendere il restante spazio disponibile (indipendentemente dalla proprietà width); questo è il motivo per cui risulta più piccolo. Il codice è sotto.
Se si volessero avere i due Button sempre della stessa larghezza (non statica) si dovrebbe inserire android:layout_weight=”1″ anche nel primo Button.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/title"
        android:textSize="28sp"
        android:layout_gravity="center_horizontal"/>
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/username"
        android:padding="10dp"
        android:hint="@string/username_hint" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/password"
        android:inputType="textPassword"
        android:padding="10dp"
        android:hint="@string/password_hint" />
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
    <Button
        android:id="@+id/submit"
        android:layout_width="200dip"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="@string/login"
        android:gravity="center"/>
    <Button
        android:id="@+id/register"
        android:layout_width="200dip"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="@string/register"
        android:layout_weight="1"
        android:gravity="center"
        />
        </LinearLayout>
</LinearLayout>

Differenza tra android:gravity e android:layout_gravity

Android definisce due attributi simili che riguardano la gravity e cioè: android:gravity e android:layout_gravity. I valori possono poi essere:

  • center
  • center_vertical
  • center_horizontal
  • ecc.

La differenza è che android:gravity è usata per il contenuto delle view (ad esempio il testo di una TextView o di un Button); invece android:layout_gravity serve a impostare la gravity della View o del Layout dentro la View genitore.

Questo articolo è stato liberamente tratto, tradotto, riveduto e ampliato dal sito di stacktips.