Android Material Chip - ChipGroup with singleSelection doesn't work adding chips dynamically

Question

I am using Material Chip for first time.

Problem: I am adding chip dynamically using following code. Please check I wrote app:singleSelection="true" which is important for me. Even though its selecting multiple chips at a time.

I want to select only one chip with tick mark at a time.

XML Code:

<com.google.android.material.chip.ChipGroup
                android:id="@+id/categoryChipsView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                app:chipSpacing="10dp"
                app:singleSelection="true"
                app:itemSpacing="15dp"
                app:singleLine="true">
</com.google.android.material.chip.ChipGroup>

Java Code:

private void addChipView(String chipText) {
    View child = getLayoutInflater().inflate(R.layout.row_chip_view, null);
    Chip chip = child.findViewById(R.id.chip);
    chip.setText(chipText);
    chip.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Toast.makeText(mContext, ((Chip) v).getText(), Toast.LENGTH_SHORT).show();
        }
    });
    // This is ChipGroup view
    binding.categoryChipsView.addView(child);
}

row_chip_view.xml

<com.google.android.material.chip.Chip xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/chip"
    style="@style/Widget.MaterialComponents.Chip.Filter"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="10dp"
    android:text="@string/app_name"
    android:textColor="@android:color/white"
    app:checkedIcon="@drawable/ic_check"
    app:chipBackgroundColor="@color/colorAccent"
    app:chipEndPadding="8dp"
    app:chipIconTint="@android:color/white"
    app:chipStartPadding="8dp"
    app:textEndPadding="5dp"
    app:textStartPadding="5dp" />

What I have tried statically, I have pasted view of row_chip_view.xml as child of ChipGroup in main xml and Its working fine. I can select only one chip at a time.

           <com.google.android.material.chip.ChipGroup
                android:id="@+id/categoryChipsView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                app:chipSpacing="10dp"
                app:singleSelection="true"
                app:itemSpacing="15dp"
                app:singleLine="true">

                <com.google.android.material.chip.Chip 
                    android:id="@+id/chip"
                    style="@style/Widget.MaterialComponents.Chip.Filter"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:text="@string/app_name"
                    android:textColor="@android:color/white"
                    app:checkedIcon="@drawable/ic_check"
                    app:chipBackgroundColor="@color/colorAccent"
                    app:chipEndPadding="8dp"
                    app:chipIconTint="@android:color/white"
                    app:chipStartPadding="8dp"
                    app:textEndPadding="5dp"
                    app:textStartPadding="5dp" />

                <com.google.android.material.chip.Chip 
                    android:id="@+id/chip2"
                    style="@style/Widget.MaterialComponents.Chip.Filter"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:text="@string/app_name"
                    android:textColor="@android:color/white"
                    app:checkedIcon="@drawable/ic_check"
                    app:chipBackgroundColor="@color/colorAccent"
                    app:chipEndPadding="8dp"
                    app:chipIconTint="@android:color/white"
                    app:chipStartPadding="8dp"
                    app:textEndPadding="5dp"
                    app:textStartPadding="5dp" />

                <com.google.android.material.chip.Chip 
                    android:id="@+id/chip3"
                    style="@style/Widget.MaterialComponents.Chip.Filter"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:text="@string/app_name"
                    android:textColor="@android:color/white"
                    app:checkedIcon="@drawable/ic_check"
                    app:chipBackgroundColor="@color/colorAccent"
                    app:chipEndPadding="8dp"
                    app:chipIconTint="@android:color/white"
                    app:chipStartPadding="8dp"
                    app:textEndPadding="5dp"
                    app:textStartPadding="5dp" />

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

BUT I WANT IT DYNAMICALLY.

Update: New Scenario

First of all I have added four chips in XML within ChipGroup and after that tried to add another three chips PROGRAMATICALLY in same ChipGroup. The first four chips is allow to select only one but last three chips allow me to select multiple. Very Weird.

Do let me know If I am missing anything.

Your help will be appreciated.

Answer 1

Remove in your row_chip_view.xml the android:id attribute.

<com.google.android.material.chip.Chip 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    style="@style/Widget.MaterialComponents.Chip.Filter"
    .../>

And in the addChipView use:

private void addChipView(String chipText) {
    Chip chip = (Chip) getLayoutInflater().inflate(R.layout.row_chip_view, chipGroup, false);
    chip.setText(chipText);
    //...

    // This is ChipGroup view
    chipGroup.addView(chip);
}