Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Set background color of unchecked checkbox Android

It has to be like this:

enter image description here

Currently it looks like this:

enter image description here

The rounded rectangle is not that important. But the unchecked state has to be black. This is my code:

<CheckBox
    android:id="@+id/checkbox"
    android:buttonTint="@color/orange"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>

This is the theme I'm using:

  "Theme.AppCompat.Light.NoActionBar"

I've tried this as well:

<style name="checkbox_style" parent="Bijenkorf">
    <item name="material_grey_600">@color/black</item>
</style>

Because the default unchecked has the color #757575. And I looked this up in the Theme and it was "material_grey_600". But this doesn't compile. Any ideas?

like image 766
Jim Clermonts Avatar asked May 12 '17 09:05

Jim Clermonts


People also ask

How can I change checkbox background in Android?

This example demonstrates how do I change the color of the check box in android. Step 1 − Create a new project in Android Studio, go to File ⇒ New Project and fill all required details to create a new project. Step 2 − Add the following code to res/layout/activity_main. xml.

How do I change the color of a checkbox?

To style the checkbox the user first needs to hide the default checkbox which can be done by setting the value of the visibility property to hidden. Example 1: Consider the example where HTML checkbox is styled using CSS. When the user clicks the checkbox, the background color is set to green.


2 Answers

Do it like this-

In your layout file-

<android.support.v7.widget.AppCompatCheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:theme="@style/CheckboxStyle"/>

and in your style.xml file

<style name="CheckboxStyle" parent="AppTheme">
    <item name="colorAccent">@color/colorAccent</item>
</style>

Or you can change both the checked and unchecked color like this-

<style name="CheckboxStyle" parent="AppTheme">
    <item name="colorAccent">@color/colorAccent</item>  // for checked 
    <item name="android:textColorSecondary">@color/colorSecondary</item>  // for unchecked
</style>

change colorAccent and colorSecondary with your required colors.

hope it will help you..

like image 70
D_Alpha Avatar answered Sep 20 '22 15:09

D_Alpha


I know it is answered but someone may find this useful, another way to achieve this is by using color state list, declare a color state list for the checkbox in an xml file

checkbox_state_list.xml

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

Now use this state list as

<android.support.v7.widget.AppCompatCheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:buttonTint="@color/checkbox_state_list"/>
like image 40
RamIndani Avatar answered Sep 17 '22 15:09

RamIndani