Sie können die Höhe eines Elements definieren, indem Sie prozentuale, feste oder gewichtete Höhenwerte im Editor dieses Elements verwenden.
In diesem Artikel erfahren Sie, wie Sie die Höhe der einzelnen Elemente verändern und welche Werte Sie dafür verwenden können. Auch die Zeilenhöhe in Ihrer Liste kann verändert werden, um längere Inhalte darstellen zu können.
In diesem Artikel:
- Wie können Höhenangaben definiert werden
- Höhe eines Elements ändern
- Zeilenhöhe ändern
- Kartenhöhe in einer Card List
Wie können Höhenangaben definiert werden
Sie können die Höhe eines Elements auf drei verschiedene Arten definieren. Achten Sie darauf keine Kommazahlen zu verwenden.
- Prozentwert (% der Bildschirmgröße)
- Fester Wert in Pixel
- Gewichtete Höhe
Die verschiedenen Höhendefinitionen können in dieser App betrachtet werden: https://get.openasapp.net/l/app/4cbccffd-0635-4ab6-8e6b-bdca0dd9c41a.
Prozentwert
Die Angabe in Prozent ist dynamisch, da sich das Element nach der Bildschirmgröße des Gerätes richtet auf dem die App geöffnet wird.
Die Höhe eines Elements in Prozentwerten anzugeben ist die am weitesten verbreitete Variante. Die Summe aller Elemente Ihrer App kann insgesamt über 100% betragen.
Die Höhe wird wie folgt eingegeben: 10%
Fester Wert in Pixel
Sie können einem Element einen festen Wert in Pixel zuordnen. Das Element wird dann eine feste Höhe haben, die nicht Abhängig von der Bildschirmgröße ist.
Die Höhe wird wie folgt eingegeben: 100
Angabe in gewichteter Höhe
Eine weitere Möglichkeit die Höhe eines Elements zu bestimmen ist die Verwendung von gewichteten Höhen.
Bei der Verwendung von gewichteten Höhen werden die Elemente in Abhängigkeit zueinander, bildschirmfüllend angezeigt.
Das bedeutet: Ihre Elemente werden so definiert, dass sie alle auf dem Bildschirm zu sehen sind, ohne das gescrollt werden muss.
Bei dieser Methode ist es wichtig, alle Elemente in gewichteter Höhe anzugeben. Vermeiden Sie das Mischen von Höhendefinition, z.B. Element A in Pixeln, Element B in % und Element C in gewichteter Höhe.
Beispiel: Element B soll immer doppelt so groß sein wie Element A. Beide Elemente werden immer auf der Anzeige sichtbar sein und diese zu 100% füllen.
In diesem Fall belegen Sie die Höhenangabe von Element B mit 2*. Element A erhält die Höhenangabe 1*. Die Höhe der Elemente wird nun in Abhängigkeit zueinander berechnet, unabhängig von der Größe der Anzeige. Würden Sie nun ein drittes Element mit der Höhenangabe 3* (dreimal so hoch wie 1*), würden sich die Höhen entsprechend automatisch anpassen.
Die Höhe wird wie folgt eingegeben: 1*
Die Vorgehensweise beim Ändern der Höhe der einzelnen Elemente ist nahezu bei allen Elementen einer App identisch.
- Öffnen Sie den Editor für das entsprechende Element. (Preview » Klick auf Stift-Symbol)
- Navigieren Sie im Editor Fenster zum Reiter "Style".
- Geben Sie unter "Height" die gewünschte Höhe des Elements ein. (Wie im Abschnitt "Wie können Höhenangaben definiert werden" beschrieben.)
- Speichern Sie die Änderungen und aktualisieren Ihre App.
Neben der Höhe der gesanten Liste, können Sie auch die Zeilenhöhe innerhalb der Liste ändern.
Um die Zeilenhöhe Ihrer Liste zu bearbeiten gehen Sie wie folgt vor:
- Öffnen Sie den Editor für die Liste. (Preview » Klick auf Stift-Symbol)
- Navigieren Sie im Editor Fenster zum Reiter "Style".
- Unter dem Reiter "Style" sehen Sie nun zwei verschiedene Höhenangaben. Height: Für die Höhe des gesamten Liste-Elements.
Zeilenhöhe: Damit definieren Sie die Zeilenhöhe. - Geben Sie die gewünschte Zellenhöhe ein.
- Speichern Sie die Änderungen und aktualisieren Ihre App.
Die Zeilenhöhe kann nur als fester Wert in Pixel angegeben werden. Zum Beispiel: 60.
Die höhe der einzelnen Karten in einer Card List wird automatisch berechnet je nachdem wie lang der Text in den ausgewählten Listenspalten ist.
