CODEWITHSUNDEEP
androidxmlcheckbox
Nazila
Nazila

Reputation: 1453

How to change background of Android checkBox?

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?

Upvotes: 10

Views: 13930

Answers (4)

Blackd
Blackd

Reputation: 903

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.

Upvotes: 4

Rudresh
Rudresh

Reputation: 751

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

Upvotes: 15

PulkitG
PulkitG

Reputation: 672

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"));
        }
    }
});

Upvotes: 0

Amit Ranjan
Amit Ranjan

Reputation: 567

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>

Upvotes: 1

Related Questions