How to change the background color of the toggle button on Android

Question

I tried to change the background color of the toggle button using XML file as white color, but the toggle button is totally damaged. It looks like all the button was covered with white.

There is no indication of ON or OFF on the toggle button when I have changed the color of the toggle button to white. Is there is another way to change the background which will not damage the indication of the toggle button?

<ToggleButton android:id="@+id/togglebutton"
              android:layout_width="100px"
              android:layout_height="46px"
              android:background="#ffffff"
              android:layout_above ="@+id/save"
              android:textOn="DAY"
              android:textOff="NIGHT" />

This is how my XML code look for the toggle button.

Brash

Show us what you tried. Generally you need to use a color state list or a state list drawable to do what you're describing. – Valdivia

Answer 1

Yes, there is a way to change the background as you wish, but you have to use a selector like this as background:

<selector
    xmlns:android="http://schemas.android.com/apk/res/android"
>
<item
    android:state_focused="true"
    android:state_pressed="false"
    android:drawable="@drawable/some_image" />
<item
    android:state_focused="true"
    android:state_pressed="true"
    android:drawable="@drawable/some_other_image" />
<item
    android:state_focused="false"
    android:state_pressed="false"
    android:drawable="@drawable/some_image1" />
<item
    android:state_focused="false"
    android:state_pressed="true"
    android:drawable="@drawable/other_image" />
</selector>

For @Drawable, etc. (you can use a color or make a gradient. Check this for more information about gradients.

Aggrieve

Answer 2

Follow this way to make your ToogleButton have background color red when On and green when OFF

First, create tooglebutton_selector.xml in drawable folder

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/togglebutton_on"
        android:state_checked="true" />
    <item android:drawable="@drawable/togglebutton_off"
        android:state_checked="false"
        />
</selector>

Second, create togglebutton_on.xml in drawable folder

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid
        android:color="#ff0000" /> // red color
</shape>

Third, create togglebutton_off.xml in drawable folder

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid
        android:color="#00FF00" /> // green color
</shape>

Finally, in your ToggleButton

 <ToggleButton
            android:id="@+id/btnMon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/tooglebutton_selector" //set background of ToggleButton to tooglebutton_selector
            />

Carranza

Can you help ? https://mcmap.net/q/244735/-change-togglebutton-color – Accord

Helpful answer, but from my own experince, it isn't necessary to create togglebutton_on.xml/togglebutton_off.xml if you just want to change color, you can pass the color resource as a parameter for the selector item directly – Antemortem

Answer 3

When you decompile your SystemUI.apk, you should go to the following file: SystemUI/res/values/colors.xml

Then change the following line:

#ff000000 #ffffffff #80000000 #ffadc1d6 #ffffffff #ffe6e6e6

Saks

There must be an easier way to do this? – Hiding

the most unusual solution I've ever seen))) – Troxler