Руководство Android Chip и ChipGroup

Chip
Chip Theme
Chip Listener
ChipGroup
Пример с RadioGroup & RadioButtons

1. Chip

Chip это новый компонент внесенный в Android с версии SDK 28, в основном это компонент интерфейса состоящий из иконки (icon) и текста, расположенный на прямоугольном фоне с закругленными углами.

Чтобы использовать объект Chip в проекте, вам нужно его установить.

После установки, библиотека включающая Chip будет объявлена в файле build.gradle (Module app).

implementation 'com.google.android.material:material:1.1.0'

XML код у простого Chip:

Chip Sample

<!-- IMPORTANT: android:theme is required -->

<com.google.android.material.chip.Chip
    android:id="@+id/chip1"
    style="@style/Widget.MaterialComponents.Chip.Action"

    android:theme="@style/Theme.MaterialComponents.Light"

    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Chip Action" />

theme attribute

Атрибут (attribute) android:theme является обязательным для Chip, без этого атрибута ваше приложение будет полностью не работать и не будет никакого оповещения. Я очень удивился об этом, когда в первый раз использовал Chip.

android:theme="@style/Theme.MaterialComponents"
android:theme="@style/Theme.MaterialComponents.Light"
android:theme="@style/Theme.MaterialComponents.***"

style attribute:

Атрибут (attribute) style имеет 4 значения, он помогает вам определить вид Chip:

@style/Widget.MaterialComponents.Chip.Action (Default)
@style/Widget.MaterialComponents.Chip.Entry
@style/Widget.MaterialComponents.Chip.Choice
@style/Widget.MaterialComponents.Chip.Filter

Style Default

Атрибут (attribute) style является необязательным, его значение по умолчанию это "@style/Widget.MaterialComponents.Chip.Action".

Chip Default Sample

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.google.android.material.chip.Chip
        android:id="@+id/chip1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="50dp"
        android:text="Chip Default"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Default + (Checkable)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip1" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Default + (Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:closeIconVisible="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip2" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip4"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="32dp"
        android:checkable="true"
        android:text="Chip Default + (Icon)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip3" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip5"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Default + (Icon, Checkable)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip4" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip6"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Default + (Icon, Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:closeIconVisible="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip5" />

</androidx.constraintlayout.widget.ConstraintLayout>

style="@style/Widget.MaterialComponents.Chip.Action"

Это значение по умолчанию у style.

style="@style/Widget.MaterialComponents.Chip.Entry"

Chip Entry = Chip Default + Close Icon + Checkable

Chip Entry Sample

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.google.android.material.chip.Chip
        android:id="@+id/chip1"
        style="@style/Widget.MaterialComponents.Chip.Entry"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="50dp"
        android:text="Chip Entry"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip2"
        style="@style/Widget.MaterialComponents.Chip.Entry"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Entry + (Checkable)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip1" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip3"
        style="@style/Widget.MaterialComponents.Chip.Entry"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Entry + (Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:closeIconVisible="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip2" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip4"
        style="@style/Widget.MaterialComponents.Chip.Entry"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="32dp"
        android:checkable="true"
        android:text="Chip Entry + (Icon)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip3" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip5"
        style="@style/Widget.MaterialComponents.Chip.Entry"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Entry + (Icon, Checkable)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip4" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip6"
        style="@style/Widget.MaterialComponents.Chip.Entry"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Entry + (Icon, Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:closeIconVisible="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip5" />

</androidx.constraintlayout.widget.ConstraintLayout>

style="@style/Widget.MaterialComponents.Chip.Choice"

Характеристики Chip Choice:

Когда выбирается (selected) Chip Choice, его фоновый цвет становится темнее.
Не имеется иконки check слева, даже если вы настроите checkable=true.
Icon - Не отображается, даже если вы настроите для него значение.

Chip Choice Sample

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.google.android.material.chip.Chip
        android:id="@+id/chip1"
        style="@style/Widget.MaterialComponents.Chip.Choice"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="50dp"
        android:text="Chip Choice"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip2"
        style="@style/Widget.MaterialComponents.Chip.Choice"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Choice + (Checkable)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip1" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip3"
        style="@style/Widget.MaterialComponents.Chip.Choice"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Choice + (Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:closeIconVisible="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip2" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip4"
        style="@style/Widget.MaterialComponents.Chip.Choice"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="32dp"
        android:checkable="true"
        android:text="Chip Choice + (Icon)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip3" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip5"
        style="@style/Widget.MaterialComponents.Chip.Choice"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Choice + (Icon, Checkable)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip4" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip6"
        style="@style/Widget.MaterialComponents.Chip.Choice"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Choice + (Icon, Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:closeIconVisible="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip5" />

</androidx.constraintlayout.widget.ConstraintLayout>

style="@style/Widget.MaterialComponents.Chip.Filter"

Характеристики Chip Filter:

Chip Filter = Chip Default + Checkable
Icon - Не отображается, даже если вы настроите значение для него.

Chip Filter Sample

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.google.android.material.chip.Chip
        android:id="@+id/chip1"
        style="@style/Widget.MaterialComponents.Chip.Filter"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="50dp"
        android:text="Chip Filter"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip2"
        style="@style/Widget.MaterialComponents.Chip.Filter"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Filter + (Checkable)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip1" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip3"
        style="@style/Widget.MaterialComponents.Chip.Filter"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Filter + (Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:closeIconVisible="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip2" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip4"
        style="@style/Widget.MaterialComponents.Chip.Filter"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="32dp"
        android:checkable="true"
        android:text="Chip Filter + (Icon)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip3" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip5"
        style="@style/Widget.MaterialComponents.Chip.Filter"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Filter + (Icon, Checkable)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip4" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip6"
        style="@style/Widget.MaterialComponents.Chip.Filter"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="16dp"
        android:checkable="true"
        android:text="Chip Filter + (Icon, Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:chipIcon="@drawable/my_icon"
        app:closeIconVisible="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip5" />

</androidx.constraintlayout.widget.ConstraintLayout>

2. Chip Theme

Атрибут (attribute) android:theme является обязательным для Chip. Ваше приложение может не работать, если Chip не имеет данного атрибута или если вы настроите недействительное значение для него.

Некоторые возможные значения:

android:theme="@style/Theme.MaterialComponents.Light"
android:theme="@style/Theme.MaterialComponents.Bridge"
android:theme="@style/Theme.MaterialComponents.DayNight"
.....

android:theme="@style/Theme.MaterialComponents.Light"

android:theme="@style/Theme.MaterialComponents.Bridge"

3. Chip Listener

Очень много событий связанных с Chip, но в основном имеются следующие 3 распространенные события:

chip.setOnClickListener(View.OnClickListener)
chip.setOnCloseIconClickListener(View.OnClickListener)
chip.setOnCheckedChangeListener(CompoundButton.OnCheckedChangeListener)

main_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.google.android.material.chip.Chip
        android:id="@+id/chip_action"
        style="@style/Widget.MaterialComponents.Chip.Action"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:clickable="true"
        android:text="Chip Action"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip_choice"
        style="@style/Widget.MaterialComponents.Chip.Choice"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Chip Choice"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip_action" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip_filter"
        style="@style/Widget.MaterialComponents.Chip.Filter"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Chip Filter"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip_choice" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip_entry"
        style="@style/Widget.MaterialComponents.Chip.Entry"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Chip Entry"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip_filter" />

    <com.google.android.material.chip.Chip
        android:id="@+id/chip_custom"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:checkable="true"
        android:text="Chip Default + (Checkable, Close Icon Visible)"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:closeIconVisible="true"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip_entry" />

    <Button
        android:id="@+id/button_clear"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="Clear Log"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/chip_custom" />

    <EditText
        android:id="@+id/editText_log"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginBottom="8dp"
        android:background="#F8EFEF"
        android:ems="10"
        android:gravity="top|left"
        android:inputType="textMultiLine"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button_clear" />

</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.java

package org.o7planning.androidchipdemo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.CompoundButton;
import android.widget.EditText;

import com.google.android.material.chip.Chip;

public class MainActivity extends AppCompatActivity  {

    private Chip chipAction;
    private Chip chipChoice;
    private Chip chipEntry;
    private Chip chipFilter;
    private Chip chipCustom;

    private EditText editTextLog;
    private Button buttonClear;

    private View.OnClickListener clickListener;
    private View.OnClickListener closeIconClickListener;
    private CompoundButton.OnCheckedChangeListener checkedChangeListener;

    private static final String LOG_TAG = "AndroidChipDemo";


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        this.chipAction = (Chip) this.findViewById(R.id.chip_action);
        this.chipChoice = (Chip) this.findViewById(R.id.chip_choice);
        this.chipEntry = (Chip) this.findViewById(R.id.chip_entry);
        this.chipFilter = (Chip) this.findViewById(R.id.chip_filter);
        this.chipCustom = (Chip) this.findViewById(R.id.chip_custom);
        this.editTextLog = (EditText) this.findViewById(R.id.editText_log);
        this.buttonClear = (Button) this.findViewById(R.id.button_clear);

        //

        this.clickListener= new ClickListenerImpl();
        this.closeIconClickListener = new CloseIconClickListenerImpl();
        this.checkedChangeListener = new CheckedChangeListenerImpl();

        //
        this.chipAction.setOnClickListener( clickListener);
        this.chipAction.setOnCloseIconClickListener(closeIconClickListener);
        this.chipAction.setOnCheckedChangeListener(checkedChangeListener);
        //
        this.chipChoice.setOnClickListener( clickListener);
        this.chipChoice.setOnCloseIconClickListener(closeIconClickListener);
        this.chipChoice.setOnCheckedChangeListener(checkedChangeListener);
        //
        this.chipEntry.setOnClickListener( clickListener);
        this.chipEntry.setOnCloseIconClickListener(closeIconClickListener);
        this.chipEntry.setOnCheckedChangeListener(checkedChangeListener);
        //
        this.chipFilter.setOnClickListener( clickListener);
        this.chipFilter.setOnCloseIconClickListener(closeIconClickListener);
        this.chipFilter.setOnCheckedChangeListener(checkedChangeListener);
        //
        this.chipCustom.setOnClickListener( clickListener);
        this.chipCustom.setOnCloseIconClickListener(closeIconClickListener);
        this.chipCustom.setOnCheckedChangeListener(checkedChangeListener);
        //
        this.buttonClear.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                editTextLog.setText("");
            }
        });
    }

    private void appendLog(String text)  {
        this.editTextLog.append(text) ;
        this.editTextLog.append("\n");
        Log.i(LOG_TAG, text);
    }

    class  ClickListenerImpl implements View.OnClickListener {

        @Override
        public void onClick(View v) {
            appendLog("Clicked");
        }
    }


    class CloseIconClickListenerImpl implements View.OnClickListener {

        @Override
        public void onClick(View v) {
            appendLog("Close Icon Clicked");
        }
    }

    class CheckedChangeListenerImpl implements  CompoundButton.OnCheckedChangeListener {

        @Override
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
            appendLog("Checked Changed! isChecked? " + isChecked);
        }
    }
}

4. ChipGroup

ChipGroup используется для содержания много Chip. По умолчанию Chip будут отсортированы на разных строках, если одна строка не может поместить все Chip.

Но вы можете настроить, чтобы удостовериться, что Chip будут расположены на одной единственной строке.

<com.google.android.material.chip.ChipGroup
   app:singleLine="true"  
   ...>
   
</com.google.android.material.chip.ChipGroup>

ChipGroup так же может работать как RadioGroup, это значит если один из его Chip настроен на статус checked, все остальные Chip будут иметь статус unchecked.

<com.google.android.material.chip.ChipGroup
   app:singleSelection="true"
   ...>
   
</com.google.android.material.chip.ChipGroup>

5. Пример с RadioGroup & RadioButtons

Ниже являются некоторые примеры Chip & ChipGroup, которые могут вас заинтересовать:

Пример ChipGroup и Chip Entry

Pуководства Android

Pуководства Flutter