Android Layout Design Tutorial: Alles was Sie wissen müssen



Dieses Android Layout Design Tutorial hilft Ihnen zu verstehen, wie Layouts mithilfe der Ansichten und Ansichtsgruppen mit einer Demo entworfen werden können.

Wenn Sie neu sind Sie sind an der perfekten Stelle gelandet, um sich mit dem Layoutdesign vertraut zu machen. Dieser Artikel über das Tutorial zum Layout von Android-Layouts hilft Ihnen dabeiEinige nützliche Tipps für ein besseres UI-Design sowie Erklärungen zum Entwerfen einer UI.

Ich werde die folgenden Themen diskutieren:





Also lasst uns anfangen!

Cassandra Tabelle gegen Spaltenfamilie

Android Layout Design Tutorial: Einführung in UI-Komponenten

In Bezug auf die UI-Komponenten besteht die typische UI einer Android-Anwendung aus folgenden Komponenten:



  • Hauptaktionsleiste
  • Ansichtssteuerung
  • Inhaltsbereich
  • Aktionsleiste teilen

Diese spielen eine wichtige Rolle bei der Entwicklung einer komplexen Anwendung. Sie erhalten eine klare Übersicht darüber, wenn wir zum Demo-Abschnitt dieses Artikels gelangen.

Ein weiterer wichtiger Faktor, der beim Anpassen des UI-Designs hilft, ist die Ansichtskomponente.

Mal sehen, was eine Ansicht ist



Android Layout Design Tutorial: Ansichten

ZU Aussicht wird als grundlegender Baustein für eine ordnungsgemäße Benutzeroberfläche betrachtet, die tatsächlich aus dem erstellt wird Klasse anzeigen . Dies nimmt einen rechteckigen Bereich auf dem Bildschirm ein und kümmert sich schließlich um das Zeichnen und die Ereignisbehandlung.

Eine Ansicht ist die Basisklasse für Widgets, mit denen interaktive UI-Komponenten wie Schaltflächen, Textfelder usw. erstellt werden. Wenn Sie nun über den Rechteckbereich oder ein Feld sprechen, kann es sich entweder um ein Bild, ein Textstück, eine Schaltfläche oder handeln alles, was eine Android-Anwendung anzeigen kann. Das Rechteck hier ist eigentlich unsichtbar, aber jede Ansicht nimmt eine Rechteckform ein.

Sie haben vielleicht eine Frage, wie groß dieses Rechteck sein kann.

Die Antwort ist, dass Sie es entweder manuell einstellen können, indem Sie die genaue Größe angeben (mit den richtigen Einheiten) oder indem Sie einige vordefinierte Werte verwenden. Diese vordefinierten Werte sind match_parentand wrap_content. Dies match_parent bedeutet, dass es den gesamten verfügbaren Platz auf dem Display des Geräts einnimmt. Wohingegen, wrap_content verweist darauf, dass es nur so viel Platz einnimmt, wie für die Anzeige seines Inhalts erforderlich ist.

Lassen Sie uns nun auf die Hauptunterschiede zwischen View und ViewGroup hinweisen.

Aussicht

  1. Aussicht Objekte sind die Grundbausteine ​​der UI-Elemente in Android.
  2. Eine Ansicht ist ein einfaches Rechteckfeld, das auf die Aktionen des Benutzers reagiert.
  3. Ansicht bezieht sich auf die android.view.View-Klasse, die die Basisklasse aller UI-Klassen ist.
  4. Beispiele sind EditText, Button, CheckBox usw.

ViewGroup

  1. ViewGroup ist der unsichtbare Container, der View und ViewGroup enthält.
  2. ViewGroup ist die Basisklasse für die Layouts .
  3. LinearLayout ist beispielsweise die ViewGroup, die Button (View) und andere Layouts enthält.

Lassen Sie uns nun fortfahren und die vorhandenen Layouts verstehen.

Android Layout Design Tutorial: Arten von Layouts

ZU Layout Definiert die Struktur für eine Benutzeroberfläche in der Anwendung. Alle Elemente im Layout werden mit einer Hierarchie von erstellt Aussicht und ViewGroup Objekte.

Nun wollen wir sehen, wie das Layout deklariert wird.

Sie können ein Layout auf zwei Arten deklarieren:

  • Deklarieren Sie UI-Elemente in XML. Android bietet ein einfaches XML-Vokabular, das den View-Klassen und Unterklassen entspricht, z. B. für Widgets und Layouts.

Hinweis: Sie können auch den Layout-Editor von Android Studio verwenden, um Ihr XML-Layout mithilfe einer Drag-and-Drop-Oberfläche zu erstellen.

  • Layoutelemente instanziieren bei Laufzeit . Die Anwendung kann erstellen Aussicht und ViewGroup Objekte und bearbeiten ihre Eigenschaften programmgesteuert.

Lassen Sie uns die verschiedenen Arten von Layouts diskutieren.

Die Benutzeroberfläche in Android ist eine Hierarchie von Ansichten und Ansichtsgruppen. Die ViewGroups sind Zwischenknoten in der Hierarchie, und die Ansichten sind Endknoten.

  • Lineares Layout
  • Absolutes Layout
  • Relatives Layout
  • Tabellenlayout
  • Rahmenlayout

Lassen Sie uns sie im Detail diskutieren.

Lineares Layout

Das lineare Layout wird verwendet, um ein Element in jeder Zeile zu platzieren. Alle Elemente werden also von oben nach unten geordnet platziert. Dies ist ein sehr weit verbreitetes Layout zum Erstellen von Formularen unter Android. Es kann auch als Ansichtsgruppe bezeichnet werden, die alle untergeordneten Elemente vertikal oder horizontal in einer Richtung ausrichtet.

Absolutes Layout

Im absoluten Layout können Sie die genauen Koordinaten jedes Steuerelements angeben, das Sie platzieren möchten. In dieser Art von Layout können Sie die genauen X- und Y-Koordinaten jedes Steuerelements angeben. Hier können Sie den genauen Standort der untergeordneten Elemente angeben.

Relatives Layout

Ein relatives Layout ist a ViewGroup das zeigt untergeordnete Ansichten in relativen Positionen an. Siekann die Position der Elemente in Bezug auf andere Elemente oder in Bezug auf den übergeordneten Container angeben.

Tabellenlayout

Mit dem Tabellenlayout können Sie eine Tabelle mit Zeilen und Spalten erstellen und Elemente darin platzieren. In jeder Zeile können Sie ein oder mehrere Elemente angeben. Mit diesem Befehl können Sie ein neues Tabellenlayout erstellen.

Rahmenlayout

Das Rahmenlayout wird verwendet, wenn Sie auf jedem Bildschirm ein Element anzeigen möchten. Mit dem Rahmenlayout können Sie mehrere Elemente haben.Dieses Rahmenlayout ist ein Platzhalter auf dem Bildschirm, mit dem Sie eine einzelne Ansicht anzeigen können.

Android Layout Design Tutorial: Maßeinheiten

Wenn Sie die Größe eines Elements auf einer Android-Benutzeroberfläche angeben, sollten Sie unbedingt die folgenden Maßeinheiten beachten.

Einheit Beschreibung
dp Dichteunabhängiges Pixel. 1dp entspricht einem Pixel auf a 160 dpi Bildschirm.
sp Unabhängiges Pixel skalieren. Dies ist dp sehr ähnlich, wird jedoch nur zur Angabe der Schriftgrößen empfohlen.
pt Punkt. Ein Punkt ist definiert als 1/72 Zoll.
px Pixel. Entspricht den tatsächlichen Pixeln auf dem Bildschirm

Kommen wir nun zum letzten Thema dieses Artikels.

Android Layout Design Tutorial: Demo

In diesem Demo-Abschnitt erfahren Sie, wie Sie mit Layouts in arbeiten Android Studio .

Siehe die zu Android Studio.

So sieht das Layout aus. Wählen Sie einfach die Zeichnung aus und Sie werden einige Klassen finden. Wählen Sie eine andere Klasse unter dieser Zeichnung aus. Sie können entweder die Layoutstruktur codieren oder das Design anzeigen und die Komponenten einfach per Drag & Drop auf den Designbereich ziehen.

Demo - Android Layout Design Tutorial - Edureka

Sie können die Komponenten anzeigen, die Sie im Komponentenbaum ausgewählt haben.

Sie finden diese auch im Layout.

  1. Palette : Hier befindet sich die Liste der Ansichten und Ansichtsgruppen, die Sie in Ihr Layout ziehen können.
  2. Komponente Baum : Besteht aus der Ansichtshierarchie für Ihr Layout.
  3. Symbolleiste : Schaltflächen zum Konfigurieren des Layout-Erscheinungsbilds im Editor und zum Ändern einiger Layout-Attribute.
  4. Design-Editor : Layout in der Entwurfs- oder Blaupausenansicht oder beides. Wird auch als Designraum angesehen.
  5. Attribute : Steuert die Attribute der ausgewählten Ansicht.

Damit kommen wir zum Ende dieses Artikels über „Android Layout Design Tutorial“. Ich hoffe, euch ist klar, was in diesem Tutorial mit euch geteilt wurde.Seien Sie gespannt auf andere Blogs und viel Glück mit Ihrer Karriere in der Android-Entwicklung.

Nachdem Sie die Grundlagen des Android-Layout-Designs verstanden haben, lesen Sie die von Edureka, einem vertrauenswürdigen Online-Lernunternehmen mit einem Netzwerk von mehr als 250.000 zufriedenen Lernenden auf der ganzen Welt.

Edurekas Schulungskurs zur Zertifizierung der Android-App-Entwicklung richtet sich an Studenten und Fachleute, die Android-Entwickler werden möchten. Der Kurs soll Ihnen einen Vorsprung in die Java-Programmierung verschaffen und Sie sowohl für Kernkonzepte als auch für fortgeschrittene Konzepte sowie für ein Projekt schulen, bei dem erwartet wird, dass Sie eine App in Android erstellen.

Hast du eine Frage an uns? Bitte erwähnen Sie es im Kommentarbereich dieses Blogs „Android Layout Design Tutorial“. Wir werden uns so schnell wie möglich bei Ihnen melden.