Home » Android » xml – How to change background of Android checkBox?

xml – How to change background of Android checkBox?

Posted by: admin June 15, 2020 Leave a comment

Questions:

I have android checkBox and the default background is transparent, I want it to be white so I use style:

<style name="BrandedCheckBox" parent="AppTheme">
    <item name="colorAccent">@color/cyan</item>
    <item name="colorControlNormal">@color/text_gray</item>
    <item name="colorControlActivated">@color/cyan</item>
</style>

and set checkBox theme:

<CheckBox
    android:id="@+id/check_payable"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentEnd="true"
    android:layout_gravity="center"
    android:theme="@style/BrandedCheckBox"/>

But the result is this:
enter image description here
But I want it to to be like this: enter image description here

Can any one help me on this?

How to&Answers:

you can use android:button

   <CheckBox
       android:id="@+id/check_box"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:button="@drawable/checkbox_background" />

checkbox_background.xml

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

I’m Using these two images in drawable

checkbox_unchecked

checkbox_checked

Answer:

Just use a selector drawable defining the exact look you want for each state (the drawables listed in the selector can have transparencies if you need it).
Then also ensure you set this in the xml of your checkbox:

android:background="@drawable/checkbox_background"
android:button="@null"

And to avoid some recent bugs of AppCompat Checkbox I recommend you to stick with the good old android.widget.CheckBox (you should use full path to ensure you will not use AppCompat one).

In a short future you will be able to migrate to AppCompatCheckBox from androidX. However at this moment (while I am writing this) it still have bugs with custom backgrounds when running in old api levels. I already reported one here: https://issuetracker.google.com/issues/120865686

I hope my answer is useful for you.

Answer:

white color code #FFFFFF in your color.xml

<style name="BrandedCheckBox" parent="AppTheme">
    <item name="colorAccent">@color/cyan</item>
    <item name="colorControlNormal">@color/text_gray</item>
    <item name="colorControlActivated">@color/white</item>
</style>

Answer:

You can use code: android:background="#006C84"

<CheckBox
    android:id="@+id/cb"
    android:background="#006C84"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

In the activity you can use:

chkBox = (CheckBox)findViewById(R.id.cb);

chkBox.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener()
{
    @Override
    public void onCheckedChanged(CompoundButton buttonView,boolean isChecked)
    {
        // TODO Auto-generated method stub
        if (buttonView.isChecked())
        {
            // When Checked
            //cb.setBackgroundColor(Color.BLACK);
            chkBox.setBackgroundColor(Color.parseColor("#FF8D3F"));
        }
        else
        {
            // When Not Checked
            // Set Your Default Color.
            chkBox.setBackgroundColor(Color.parseColor("#006C84"));
        }
    }
});