Titel-Chips

Titel-Chips enthalten kurze Informationen.

Designelemente sollten am unteren Rand des Frames verankert werden.

Grundsätze

Kontextbezogen: Der primäre Zweck eines Titel-Chips besteht darin, einen klaren und unmittelbaren Kontext für die zugehörigen Inhalte zu liefern.

Kompakt: Titel-Chips sind für kurze Informationen konzipiert, in der Regel für einen kurzen Titel, Namen oder Status.

Visuell unverwechselbar: Das Glimmer-Design von Jetpack Compose sollte zwar beibehalten werden, aber das Label muss sich optisch so stark von interaktiven Schaltflächen unterscheiden, dass es als Label und nicht als Schaltfläche wahrgenommen wird.

Nutzung und Platzierung

Der Titel-Chip ist standardmäßig schreibgeschützt.

Verwenden Sie einen Titel-Chip für ein statisches oder dekoratives Element, um den Nutzer zu informieren und ein Label zu erstellen.
Verwenden Sie Titelschnipsel als Aufforderung zum Tippen, da sie keinen Fokusstatus haben. Verwenden Sie stattdessen eine Schaltfläche.

Designelemente sollten am unteren Rand des Frames verankert sein.
Titel-Chips können mit einer statischen Leiste in einer mobilen App verglichen werden.

Innerhalb eines Layouts

Der Titel-Chip ist standardmäßig schreibgeschützt.

Chips scrollen mit dem Layout
Alternativ können Chips im Layout fixiert werden. Das Chip-Element nimmt die oberen 56 dp ein.

Anatomie

Designelemente sollten am unteren Rand des Frames verankert sein.

Chip mit Standardtitel und Chip mit fixiertem Titel werden angezeigt. Fixierte Titel-Chips werden mit einer Umrisslinie angezeigt.

1. Label für Titel-Chips

2. Optionales vorangestelltes Symbol oder Element

Personalisierung

Titel-Chips können mit oder ohne Symbol zusammen mit anderen Stileigenschaften angezeigt werden.

Properties Personalisierung Standardeinstellungen
Form Ja Groß, Kreis
Padding Ja 16 dp, 8 dp
Rahmen Ja 2 dp, #606460
Text Ja Body Small
Vorangestelltes Symbol Ja 40 dp
Tiefe Ja 0
Maximale Breite Nein 352 dp
Mindesthöhe Ja 56 dp