Android - Progettazione dell'interfaccia utente

In questo capitolo esamineremo i diversi componenti dell'interfaccia utente dello schermo di Android. Questo capitolo tratta anche i suggerimenti per migliorare la progettazione dell'interfaccia utente e spiega anche come progettare un'interfaccia utente.

Componenti dello schermo dell'interfaccia utente

Una tipica interfaccia utente di un'applicazione Android è costituita dalla barra delle azioni e dall'area del contenuto dell'applicazione.

• Barra delle azioni principali
• Controllo della vista
• Area del contenuto
• Barra delle azioni divisa

Questi componenti sono stati mostrati anche nell'immagine qui sotto:

Comprensione dei componenti dello schermo

L'unità di base dell'applicazione Android è l'attività. Un'interfaccia utente è definita in un file xml. Durante la compilazione, ogni elemento nell'XML viene compilato in una classe GUI Android equivalente con attributi rappresentati da metodi.

Visualizza e ViewGroups

Un'attività è costituita da visualizzazioni. Una vista è solo un widget che appare sullo schermo. Potrebbe essere un pulsante, ecc. Una o più viste possono essere raggruppate in una GroupView. L'esempio di ViewGroup include i layout.

Tipi di layout

Esistono molti tipi di layout. Alcuni dei quali sono elencati di seguito:

• Layout lineare
• Layout assoluto
• Layout della tabella
• Layout del frame
• Layout relativo

Layout lineare

Il layout lineare è ulteriormente suddiviso in layout orizzontale e verticale. Significa che può disporre le viste in una singola colonna o in una singola riga. Ecco il codice del layout lineare (verticale) che include una vista di testo.

<?xml version=”1.0” encoding=”utf-8”?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”
   android:layout_width=”fill_parent”
   android:layout_height=”fill_parent”
   android:orientation=”vertical” >
   
   <TextView
      android:layout_width=”fill_parent”
      android:layout_height=”wrap_content”
      android:text=”@string/hello” />
</LinearLayout>

AbsoluteLayout

AbsoluteLayout consente di specificare la posizione esatta dei suoi figli. Può essere dichiarato così.

<AbsoluteLayout
   android:layout_width=”fill_parent”
   android:layout_height=”fill_parent”
   xmlns:android=”http://schemas.android.com/apk/res/android” >
   
   <Button
      android:layout_width=”188dp”
      android:layout_height=”wrap_content”
      android:text=”Button”
      android:layout_x=”126px”
      android:layout_y=”361px” />
</AbsoluteLayout>

TableLayout

Il TableLayout raggruppa le visualizzazioni in righe e colonne. Può essere dichiarato così.

<TableLayout
   xmlns:android=”http://schemas.android.com/apk/res/android”
   android:layout_height=”fill_parent”
   android:layout_width=”fill_parent” >
   
   <TableRow>
      <TextView
         android:text=”User Name:”
         android:width =”120dp”
         />
      
      <EditText
         android:id=”@+id/txtUserName”
         android:width=”200dp” />
   </TableRow>
   
</TableLayout>

RelativeLayout

RelativeLayout consente di specificare come le visualizzazioni figlie sono posizionate l'una rispetto all'altra e può essere dichiarato in questo modo.

<RelativeLayout
   android:id=”@+id/RLayout”
   android:layout_width=”fill_parent”
   android:layout_height=”fill_parent”
   xmlns:android=”http://schemas.android.com/apk/res/android” >
</RelativeLayout>

FrameLayout

FrameLayout è un segnaposto sullo schermo che puoi utilizzare per visualizzare una singola visualizzazione. Può essere dichiarato così.

<?xml version=”1.0” encoding=”utf-8”?>
<FrameLayout
   android:layout_width=”wrap_content”
   android:layout_height=”wrap_content”
   android:layout_alignLeft=”@+id/lblComments”
   android:layout_below=”@+id/lblComments”
   android:layout_centerHorizontal=”true” >
   
   <ImageView
      android:src = “@drawable/droid”
      android:layout_width=”wrap_content”
      android:layout_height=”wrap_content” />
</FrameLayout>

Oltre a questi attributi, esistono altri attributi comuni a tutte le viste e ai ViewGroup. Sono elencati di seguito:

Unità di misura

Quando specifichi la dimensione di un elemento su un'interfaccia utente Android, dovresti ricordare le seguenti unità di misura.

Densità dello schermo

Ottimizzazione dei layout

Ecco alcune delle linee guida per creare layout efficienti.

• Evita annidamenti non necessari
• Evita di utilizzare troppe visualizzazioni
• Evita l'annidamento profondo