Required single selection on MaterialButtonToggleGroup

Question

Is there an option to make the MaterialButtonToggleGroup have a required selected button when using app:singleSelection="true"?

When clicking to a different button works fine (all other buttons are deselected), but when you click the same (already selected) button it deselects it itself and I want to remain selected.

My example:

 <com.google.android.material.button.MaterialButtonToggleGroup
      android:layout_width="wrap"
      android:layout_height="wrap_content"
      app:singleSelection="true">

      <com.google.android.material.button.MaterialButton
        android:id="@+id/filterA"
        style="@style/Widget.MaterialComponents.Button.OutlinedButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="A"/>

      <com.google.android.material.button.MaterialButton
        android:id="@+id/filterB"
        style="@style/Widget.MaterialComponents.Button.OutlinedButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="B"/>

      <com.google.android.material.button.MaterialButton
        android:id="@+id/filterC"
        style="@style/Widget.MaterialComponents.Button.OutlinedButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="C"/>

    </com.google.android.material.button.MaterialButtonToggleGroup>

I already filled a feature request, because I couldn't find a decent solution https://issuetracker.google.com/issues/132823510 — Vladimir Petrovski, May 16 '19 at 08:48
The app:singleSelection="true" doesnt work for me. All buttons are still selectable at the same time — Avi, Jul 13 '19 at 13:52

score 26 · Accepted Answer · answered Dec 20 '19 at 15:08

26

You can define it in the layout using the app:selectionRequired attribute:

    <com.google.android.material.button.MaterialButtonToggleGroup
        app:selectionRequired="true"
        app:checkedButton="@id/..."
        app:singleSelection="true">

You can also use the method setSelectionRequired:

buttonGroup.setSelectionRequired(true);

Note: This requires a minimum of version 1.2.0-alpha03

answered Dec 20 '19 at 15:08

Gabriele Mariotti

320,139
94
887
841

1

Yes you are right, google team added this feature -> https://issuetracker.google.com/issues/132823510 – Vladimir Petrovski Mar 14 '20 at 18:08

score 4 · Answer 2 · answered Nov 01 '19 at 14:08

4

I got this working with the following:

toggle_group.addOnButtonCheckedListener { group, checkedId, isChecked ->
    if (group.checkedButtonId == -1) group.check(checkedId)
}

If you have singleSelection enabled, the conditional will only evaluate to true when the user has clicked on the button which is already checked, making it so no button is checked. When this happens, we just need to check the button they unchecked.

answered Nov 01 '19 at 14:08

Steven Tchadenis

151
11

how to map child button when checked? – Faisal Dec 16 '19 at 15:01
1

Thanks for this. It's the simplest solution around, with no dependency on the alpha build. – Adi B Feb 07 '20 at 08:48

score 2 · Answer 3 · answered Sep 19 '19 at 19:04

I also came across this issue and I found this is working with the app:singleSelection="true"

    String selectedValue = "Male";
    genderBtnToggle.addOnButtonCheckedListener(new MaterialButtonToggleGroup.OnButtonCheckedListener() {
        @Override
        public void onButtonChecked(MaterialButtonToggleGroup group, int checkedId, boolean isChecked) {
            MaterialButton btn = genderBtnToggle.findViewById(checkedId);
            if (!isChecked && btn.getText().toString().equals(selectedValue)) {
                genderBtnToggle.check(checkedId);
            }

            if (isChecked) {
                selectedValue = btn.getText().toString();
            }
        }
    });

score 0 · Answer 4 · answered Sep 09 '19 at 05:29

I also came across this issue and will be waiting for a permanent fix from google. In the meantime, I did the following to make sure that at least one button is checked.

    final MaterialButtonToggleGroup tGroup = view.findViewById(R.id.toggleGroup);
    final MaterialButton breast = tGroup.findViewById(R.id.breast);
    final MaterialButton bottle = tGroup.findViewById(R.id.bottle);
    final MaterialButton solids = tGroup.findViewById(R.id.solids);

    View.OnClickListener onClickListener = new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            tGroup.check(v.getId());
        }
    };

    breast.setOnClickListener(onClickListener);
    bottle.setOnClickListener(onClickListener);
    solids.setOnClickListener(onClickListener);

Hope this helps.

Required single selection on MaterialButtonToggleGroup

4 Answers4