Change the background color of MaterialButtonToggleGroup
Asked Answered
U

4

5

I'm using MaterialButtonToggleGroup to create selector buttons. I want to change the background color of MaterialButton buttons. Its default color is light blue, and I want to change it to light green. Currently, I'm using drawable sectors to change the background color, but it is not working.

Default color, enter image description here

Want this color, enter image description here

Here is my layout,

<com.google.android.material.button.MaterialButtonToggleGroup
    android:id="@+id/toggleContent"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:checkedButton="@id/btnOutline"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    android:visibility="visible"
    app:layout_constraintRight_toRightOf="parent"
    app:singleSelection="true">

    <com.google.android.material.button.MaterialButton
        android:id="@+id/btnOutline"
        style="@style/Widget.MaterialComponents.Button.OutlinedButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/button_selector"
        android:text="@string/outline"
        android:textAllCaps="false" />

    <com.google.android.material.button.MaterialButton
        android:id="@+id/btnMain"
        style="@style/Widget.MaterialComponents.Button.OutlinedButton"
        android:background="@drawable/button_selector"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/main"
        android:textAllCaps="false" />

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

Here is my drawable file "button_selector",

    <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_selected="true" android:drawable="@drawable/selector_color"/>

</selector>

Here is the "selector_color" file,

  <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <solid android:color="#93cdcb"/>
</shape>
Ungraceful answered 1/2, 2021 at 8:23 Comment(1)
This seems directly related: #60558558Vicarious
M
4

For material button you should use app:backgroundTint instead of android:background Android documentation also mentions it here: https://developer.android.com/reference/com/google/android/material/button/MaterialButton

Do not use the android:background attribute. MaterialButton manages its own background drawable, and setting a new background means MaterialButton can no longer guarantee that the new attributes it introduces will function properly

For filled buttons, this class uses your theme's ?attr/colorPrimary for the background tint color and ?attr/colorOnPrimary for the text color. For unfilled buttons, this class uses ?attr/colorPrimary for the text color and transparent for the background tint.

Mf answered 1/2, 2021 at 8:47 Comment(0)
V
3

I had the same issue and solved it by using android:state_checked="true"instead of android:state_selected="true" in the selector.

Vd answered 12/5, 2021 at 15:21 Comment(0)
B
1

Instead of setting it to 'android:background' you could try setting the selector on the 'android:backgroundTint' property. If you want to update the border-color consider updating and 'app:strokeColor'

Ballon answered 1/2, 2021 at 8:39 Comment(0)
B
0

Create MaterialButton programatically

    MaterialButtonToggleGroup grupo = new MaterialButtonToggleGroup(this, null, com.google.android.material.R.attr.materialButtonOutlinedStyle);
    MaterialButton btn1 = new MaterialButton(this, null, com.google.android.material.R.attr.materialButtonOutlinedStyle);
    btn1.setText("Ejemplo 1");
    //here 
    btn1.setBackgroundTintList(ColorStateList.valueOf(Color.GREEN));
    btn1.style
    grupo.addView(btn1);
Butterscotch answered 9/5, 2023 at 14:56 Comment(1)
Answer needs supporting information Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.Spermicide

© 2022 - 2024 — McMap. All rights reserved.