Android - UI-Layouts

Der Grundbaustein für die Benutzeroberfläche ist a ViewObjekt, das aus der View-Klasse erstellt wird und einen rechteckigen Bereich auf dem Bildschirm einnimmt und für das Zeichnen und die Ereignisbehandlung verantwortlich ist. Ansicht ist die Basisklasse für Widgets, mit denen interaktive UI-Komponenten wie Schaltflächen, Textfelder usw. erstellt werden.

Das ViewGroup ist eine Unterklasse von View und bietet unsichtbaren Container, der andere Ansichten oder andere ViewGroups enthält und deren Layout-Eigenschaften definiert.

Auf der dritten Ebene haben wir verschiedene Layouts, die Unterklassen der ViewGroup-Klasse sind, und ein typisches Layout definiert die visuelle Struktur für eine Android-Benutzeroberfläche und kann entweder zur Laufzeit mit erstellt werden View/ViewGroup Objekte oder Sie können Ihr Layout mit einer einfachen XML-Datei deklarieren main_layout.xml Diese befindet sich im Ordner res / layout Ihres Projekts.

Layoutparameter

In diesem Tutorial geht es mehr um das Erstellen Ihrer GUI basierend auf in der XML-Datei definierten Layouts. Ein Layout kann beliebige Widgets wie Schaltflächen, Beschriftungen, Textfelder usw. enthalten. Das folgende Beispiel zeigt eine XML-Datei mit 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>

Sobald Ihr Layout erstellt wurde, können Sie die Layoutressource aus Ihrem Anwendungscode in Ihre Activity.onCreate () - Rückrufimplementierung laden ( siehe unten).

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

Android-Layouttypen

Es gibt eine Reihe von Layouts, die von Android bereitgestellt werden und die Sie in fast allen Android-Anwendungen verwenden, um unterschiedliche Ansichten, Erscheinungsbilder und Verhaltensweisen zu erzielen.

Sr.Nr.	Layout & Beschreibung
1	Lineares Layout LinearLayout ist eine Ansichtsgruppe, die alle untergeordneten Elemente vertikal oder horizontal in einer Richtung ausrichtet.
2	Relatives Layout RelativeLayout ist eine Ansichtsgruppe, die untergeordnete Ansichten an relativen Positionen anzeigt.
3	Tabellenlayout TableLayout ist eine Ansicht, die Ansichten in Zeilen und Spalten gruppiert.
4	Absolutes Layout Mit AbsoluteLayout können Sie den genauen Standort der untergeordneten Elemente angeben.
5	Rahmenlayout Das FrameLayout ist ein Platzhalter auf dem Bildschirm, mit dem Sie eine einzelne Ansicht anzeigen können.
6	Listenansicht ListView ist eine Ansichtsgruppe, die eine Liste scrollbarer Elemente anzeigt.
7	Rasteransicht GridView ist eine ViewGroup, die Elemente in einem zweidimensionalen, scrollbaren Raster anzeigt.

Layoutattribute

Jedes Layout verfügt über eine Reihe von Attributen, die die visuellen Eigenschaften dieses Layouts definieren. Es gibt nur wenige gemeinsame Attribute für alle Layouts und es gibt andere Attribute, die für dieses Layout spezifisch sind. Die folgenden Attribute werden häufig verwendet und auf alle Layouts angewendet:

Sr.Nr.	Attribut & Beschreibung
1	android:id Dies ist die ID, die die Ansicht eindeutig identifiziert.
2	android:layout_width Dies ist die Breite des Layouts.
3	android:layout_height Dies ist die Höhe des Layouts
4	android:layout_marginTop Dies ist der zusätzliche Platz auf der Oberseite des Layouts.
5	android:layout_marginBottom Dies ist der zusätzliche Platz auf der Unterseite des Layouts.
6	android:layout_marginLeft Dies ist der zusätzliche Platz auf der linken Seite des Layouts.
7	android:layout_marginRight Dies ist der zusätzliche Platz auf der rechten Seite des Layouts.
8	android:layout_gravity Dies gibt an, wie untergeordnete Ansichten positioniert werden.
9	android:layout_weight Dies gibt an, wie viel zusätzlicher Platz im Layout der Ansicht zugewiesen werden soll.
10	android:layout_x Dies gibt die x-Koordinate des Layouts an.
11	android:layout_y Dies gibt die y-Koordinate des Layouts an.
12	android:layout_width Dies ist die Breite des Layouts.
13	android:paddingLeft Dies ist die linke Polsterung, die für das Layout ausgefüllt ist.
14	android:paddingRight Dies ist die richtige Polsterung für das Layout.
15	android:paddingTop Dies ist die obere Polsterung, die für das Layout gefüllt ist.
16	android:paddingBottom Dies ist die untere Polsterung, die für das Layout ausgefüllt ist.

Hier sind Breite und Höhe die Abmessungen des Layouts / der Ansicht, die in dp (dichteunabhängige Pixel), sp (skalierungsunabhängige Pixel), pt (Punkte, die 1/72 Zoll sind), px (angegeben werden können) angegeben werden können Pixel), mm (Millimeter) und schließlich in (Zoll).

Sie können Breite und Höhe mit genauen Maßen angeben, aber häufiger verwenden Sie eine dieser Konstanten, um die Breite oder Höhe festzulegen.

• android:layout_width=wrap_content Weist Ihre Ansicht an, sich an die für den Inhalt erforderlichen Abmessungen anzupassen.

• android:layout_width=fill_parent Weist Ihre Ansicht an, so groß wie die übergeordnete Ansicht zu werden.

Das Schwerkraftattribut spielt eine wichtige Rolle bei der Positionierung des Ansichtsobjekts und kann einen oder mehrere (durch '|' getrennte) der folgenden konstanten Werte annehmen.

Konstante	Wert	Beschreibung
oben	0x30	Schieben Sie das Objekt an die Oberseite seines Behälters, ohne seine Größe zu ändern.
Unterseite	0x50	Schieben Sie das Objekt auf den Boden des Behälters, ohne die Größe zu ändern.
links	0x03	Schieben Sie das Objekt links von seinem Container, ohne seine Größe zu ändern.
richtig	0x05	Schieben Sie das Objekt rechts neben den Behälter, ohne die Größe zu ändern.
center_vertical	0x10	Platzieren Sie das Objekt in der vertikalen Mitte des Containers, ohne die Größe zu ändern.
fill_vertical	0x70	Vergrößern Sie das Objekt bei Bedarf vertikal, damit es den Behälter vollständig ausfüllt.
center_horizontal	0x01	Platzieren Sie das Objekt in der horizontalen Mitte des Containers, ohne die Größe zu ändern.
fill_horizontal	0x07	Vergrößern Sie das Objekt bei Bedarf horizontal, damit es seinen Behälter vollständig ausfüllt.
Center	0x11	Platzieren Sie das Objekt sowohl in der vertikalen als auch in der horizontalen Achse in der Mitte seines Containers, ohne seine Größe zu ändern.
füllen	0x77	Vergrößern Sie bei Bedarf die horizontale und vertikale Größe des Objekts, damit es den Behälter vollständig ausfüllt.
clip_vertical	0x80	Zusätzliche Option, die so eingestellt werden kann, dass die Ober- und / oder Unterkante des untergeordneten Elements an den Grenzen seines Containers befestigt wird. Der Clip basiert auf der vertikalen Schwerkraft: Eine obere Schwerkraft schneidet die Unterkante, eine untere Schwerkraft schneidet die Oberkante und keiner schneidet beide Kanten.
clip_horizontal	0x08	Zusätzliche Option, die so eingestellt werden kann, dass der linke und / oder rechte Rand des untergeordneten Elements an den Grenzen seines Containers befestigt wird. Der Clip basiert auf der horizontalen Schwerkraft: Eine linke Schwerkraft schneidet die rechte Kante, eine rechte Schwerkraft schneidet die linke Kante und keine schneidet beide Kanten.
Start	0x00800003	Schieben Sie das Objekt an den Anfang seines Containers, ohne seine Größe zu ändern.
Ende	0x00800005	Schieben Sie das Objekt an das Ende seines Containers, ohne seine Größe zu ändern.

Identifikation anzeigen

Einem Ansichtsobjekt kann eine eindeutige ID zugewiesen sein, die die Ansicht innerhalb des Baums eindeutig identifiziert. Die Syntax für eine ID in einem XML-Tag lautet -

android:id="@+id/my_button"

Es folgt eine kurze Beschreibung der Zeichen @ und + -

• Das at-Symbol (@) am Anfang der Zeichenfolge gibt an, dass der XML-Parser den Rest der ID-Zeichenfolge analysieren, erweitern und als ID-Ressource identifizieren soll.

• Das Pluszeichen (+) bedeutet, dass dies ein neuer Ressourcenname ist, der erstellt und unseren Ressourcen hinzugefügt werden muss. Verwenden Sie Folgendes, um eine Instanz des Ansichtsobjekts zu erstellen und aus dem Layout zu erfassen:

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