Chips und ChipGroups: Die neuen Helden der Android-Benutzeroberfläche

Entdecken Sie in unserem neuesten Blogbeitrag die aufregenden Möglichkeiten der Integration von Chips und ChipGroups in Ihre Android-Apps! Von modernem Design bis hin zur verbesserten Benutzerinteraktion – erfahren Sie, wie diese neuen Material Design-Komponenten Ihre Anwendungen auf das nächste Level bringen können.

Android Chips

Chips sind im Grunde Texte, die in einem abgerundeten Hintergrund angezeigt werden. Sie sind anwählbar und können auch Symbole enthalten. Chips sind eine neuere und stilisierte Form von RadioButtons. Um Chips in Ihrer Android-Anwendung zu verwenden, müssen Sie das neueste Android SDK 28 verwenden. Folgende Abhängigkeiten müssen in der build.gradle hinzugefügt werden:

implementation 'androidx.appcompat:appcompat:1.0.0-alpha1'
implementation 'com.google.android.material:material:1.0.0-alpha1'

Verwendung von Android Chips

Ein Chip wird im XML-Layout definiert als:

<com.google.android.material.chip.Chip
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:chipText="Default" />

app:chipText zeigt den Textteil im Chip an. So sieht der Chip auf dem Bildschirm aus:

Arten von Chips

Chips können gestylt werden als:

• Default: Dieser macht nichts, es sei denn, ein anderes XML-Attribut ist vorhanden.
• Entry: Wir müssen den Stil @style/Widget.MaterialComponents.Chip.Entry hinzufügen. Dies macht den Chip anwählbar und enthält standardmäßig ein Häkchen- und ein Schließen-Symbol.
• Choice: Diese Art von Chip wird im Allgemeinen verwendet, um Chips für Auswahlmarkierungen an- oder abzuwählen. Stil @style/Widget.MaterialComponents.Chip.Choice wird im Allgemeinen in Chip-Gruppen verwendet.
• Actions: Dieser Chip ist anwählbar und wird verwendet, um Aktionen auszulösen, wenn sie angeklickt werden. Stil @style/Widget.MaterialComponents.Chip.Action
• Filter: Dieser Chip ist anwählbar und zeigt ein Häkchen an, wenn er ausgewählt ist. Stil @style/Widget.MaterialComponents.Chip.Filter

XML-Attribute

• app:chipText
• app:chipBackgroundColor
• app:rippleColor – Zeigt einen benutzerdefinierten Ripple-Effekt an, wenn der Chip gedrückt wird.
• app:checkable – Wird verwendet, um festzulegen, ob der Umschalter aktiviert ist oder nicht.
• app:chipIcon – Wird verwendet, um ein benutzerdefiniertes Symbol im Chip festzulegen.
• app:closeIcon – Normalerweise in Chips vom Typ Entry vorhanden. Wir können unser Symbol damit festlegen. Das Schließen-Symbol befindet sich standardmäßig rechts vom Text.
• app:closeIconTint
• app:checkedIcon – Wird verwendet, um das Häkchen-Symbol zu ändern, das in Eintrags- und Filtertypen von Chips vorhanden ist.
• app:chipStartPadding/app:chipEndPadding
• app:iconStartPadding/app:iconEndPadding

Android ChipGroup

Ähnlich wie RadioGroups werden ChipGroups verwendet, um Chips zu halten.

<com.google.android.material.chip.ChipGroup
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="16dp">

    <com.google.android.material.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:chipText="Dies" />

    <!-- Weitere Chips hier einfügen -->

</com.google.android.material.chip.ChipGroup>

Fazit

Chips und ChipGroups bieten eine moderne Möglichkeit, Benutzeroberflächen in Android-Anwendungen zu gestalten. Durch die Verwendung von XML-Attributen und Stilen können Chips an verschiedene Anforderungen angepasst werden. Die ChipGroups bieten eine bequeme Möglichkeit, mehrere Chips zu gruppieren und sie gemeinsam zu verwalten. Mit diesem Wissen sind Sie bereit, diese neuen Komponenten in Ihre eigenen Android-Anwendungen zu integrieren.