Android - Layout dell'interfaccia utente

Il blocco predefinito di base per l'interfaccia utente è un file Viewoggetto che viene creato dalla classe View e occupa un'area rettangolare sullo schermo ed è responsabile del disegno e della gestione degli eventi. View è la classe base per i widget, che vengono utilizzati per creare componenti dell'interfaccia utente interattiva come pulsanti, campi di testo, ecc.

Il ViewGroup è una sottoclasse di View e fornisce un contenitore invisibile che contiene altre viste o altri ViewGroup e ne definisce le proprietà di layout.

Al terzo livello abbiamo diversi layout che sono sottoclassi della classe ViewGroup e un layout tipico definisce la struttura visiva per un'interfaccia utente Android e può essere creato in fase di esecuzione utilizzando View/ViewGroup oggetti oppure puoi dichiarare il tuo layout usando un semplice file XML main_layout.xml che si trova nella cartella res / layout del tuo progetto.

Parametri di layout

Questo tutorial è più sulla creazione della tua GUI in base ai layout definiti nel file XML. Un layout può contenere qualsiasi tipo di widget come pulsanti, etichette, caselle di testo e così via. Di seguito è riportato un semplice esempio di file XML con LinearLayout -

<?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:id="@+id/text"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="This is a TextView" />
      
   <Button android:id="@+id/button"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="This is a Button" />
      
   <!-- More GUI components go here  -->
   
</LinearLayout>

Una volta creato il layout, è possibile caricare la risorsa di layout dal codice dell'applicazione, nell'implementazione del callback Activity.onCreate () come mostrato di seguito:

public void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   setContentView(R.layout.activity_main);
}

Tipi di layout Android

Esistono numerosi layout forniti da Android che utilizzerai in quasi tutte le applicazioni Android per fornire una visualizzazione, un aspetto e un aspetto diversi.

Suor n	Layout e descrizione
1	Layout lineare LinearLayout è un gruppo di viste che allinea tutti i figli in una singola direzione, verticalmente o orizzontalmente.
2	Layout relativo RelativeLayout è un gruppo di visualizzazioni che mostra le visualizzazioni figlio in posizioni relative.
3	Layout della tabella TableLayout è una visualizzazione che raggruppa le visualizzazioni in righe e colonne.
4	Layout assoluto AbsoluteLayout consente di specificare la posizione esatta dei suoi figli.
5	Layout del frame FrameLayout è un segnaposto sullo schermo che puoi utilizzare per visualizzare una singola visualizzazione.
6	Visualizzazione elenco ListView è un gruppo di viste che mostra un elenco di elementi scorrevoli.
7	Vista a griglia GridView è un ViewGroup che visualizza gli elementi in una griglia bidimensionale scorrevole.

Attributi di layout

Ogni layout ha una serie di attributi che definiscono le proprietà visive di quel layout. Ci sono pochi attributi comuni tra tutti i layout e sono altri attributi specifici di quel layout. Di seguito sono riportati gli attributi comuni e verranno applicati a tutti i layout:

Suor n	Attributo e descrizione
1	android:id Questo è l'ID che identifica in modo univoco la vista.
2	android:layout_width Questa è la larghezza del layout.
3	android:layout_height Questa è l'altezza del layout
4	android:layout_marginTop Questo è lo spazio extra sul lato superiore del layout.
5	android:layout_marginBottom Questo è lo spazio extra sul lato inferiore del layout.
6	android:layout_marginLeft Questo è lo spazio extra sul lato sinistro del layout.
7	android:layout_marginRight Questo è lo spazio extra sul lato destro del layout.
8	android:layout_gravity Specifica come vengono posizionate le viste figlio.
9	android:layout_weight Specifica quanto spazio aggiuntivo nel layout deve essere allocato alla vista.
10	android:layout_x Questo specifica la coordinata x del layout.
11	android:layout_y Questo specifica la coordinata y del layout.
12	android:layout_width Questa è la larghezza del layout.
13	android:paddingLeft Questa è la spaziatura interna sinistra riempita per il layout.
14	android:paddingRight Questa è la giusta imbottitura riempita per il layout.
15	android:paddingTop Questa è l'imbottitura superiore riempita per il layout.
16	android:paddingBottom Questa è l'imbottitura inferiore riempita per il layout.

Qui larghezza e altezza sono le dimensioni del layout / vista che possono essere specificate in termini di dp (Density-independent Pixels), sp (Scale-independent Pixels), pt (Points che è 1/72 di pollice), px ( Pixel), mm (Millimetri) e infine in (pollici).

Puoi specificare larghezza e altezza con misure esatte ma più spesso, utilizzerai una di queste costanti per impostare la larghezza o l'altezza -

• android:layout_width=wrap_content dice alla tua vista di ridimensionarsi alle dimensioni richieste dal suo contenuto.

• android:layout_width=fill_parent dice alla tua vista di diventare grande quanto la sua vista principale.

L'attributo Gravity gioca un ruolo importante nel posizionamento dell'oggetto vista e può assumere uno o più (separati da '|') dei seguenti valori costanti.

Costante	Valore	Descrizione
superiore	0x30	Spingere l'oggetto nella parte superiore del suo contenitore, senza modificarne le dimensioni.
parte inferiore	0x50	Spingere l'oggetto sul fondo del suo contenitore, senza modificarne le dimensioni.
sinistra	0x03	Spingere l'oggetto a sinistra del suo contenitore, senza modificarne le dimensioni.
giusto	0x05	Spingere l'oggetto a destra del suo contenitore, senza modificarne le dimensioni.
center_vertical	0x10	Posiziona l'oggetto al centro verticale del suo contenitore, senza modificarne le dimensioni.
fill_vertical	0x70	Se necessario, aumenta la dimensione verticale dell'oggetto in modo che riempia completamente il suo contenitore.
center_horizontal	0x01	Posiziona l'oggetto al centro orizzontale del suo contenitore, senza modificarne le dimensioni.
fill_horizontal	0x07	Aumenta la dimensione orizzontale dell'oggetto se necessario in modo che riempia completamente il suo contenitore.
centro	0x11	Posiziona l'oggetto al centro del suo contenitore sia sull'asse verticale che su quello orizzontale, senza modificarne le dimensioni.
riempire	0x77	Aumenta la dimensione orizzontale e verticale dell'oggetto, se necessario, in modo che riempia completamente il suo contenitore.
clip_vertical	0x80	Opzione aggiuntiva che può essere impostata per avere i bordi superiore e / o inferiore del figlio ritagliati ai limiti del suo contenitore. La clip sarà basata sulla gravità verticale: una gravità superiore taglierà il bordo inferiore, una gravità inferiore taglierà il bordo superiore e nessuno dei due taglierà entrambi i bordi.
clip_horizontal	0x08	Opzione aggiuntiva che può essere impostata per avere i bordi sinistro e / o destro del bambino ritagliati ai limiti del suo contenitore. La clip sarà basata sulla gravità orizzontale: una gravità sinistra taglierà il bordo destro, una gravità destra taglierà il bordo sinistro e nessuno dei due taglierà entrambi i bordi.
inizio	0x00800003	Spinge l'oggetto all'inizio del suo contenitore, senza modificarne le dimensioni.
fine	0x00800005	Spingere l'oggetto alla fine del suo contenitore, senza modificarne le dimensioni.

Visualizza identificazione

A un oggetto vista può essere assegnato un ID univoco che identificherà la vista in modo univoco all'interno dell'albero. La sintassi per un ID, all'interno di un tag XML è:

android:id="@+id/my_button"

Di seguito è riportata una breve descrizione dei segni @ e + -

• Il simbolo at (@) all'inizio della stringa indica che il parser XML deve analizzare ed espandere il resto della stringa ID e identificarla come risorsa ID.

• Il simbolo più (+) significa che si tratta di un nuovo nome di risorsa che deve essere creato e aggiunto alle nostre risorse. Per creare un'istanza dell'oggetto vista e catturarla dal layout, utilizzare quanto segue:

Button myButton = (Button) findViewById(R.id.my_button);