Changing checkbox style to Cross - Android

Question

I have been coding an Android Application, and using CheckBox for GUI.

Generally, the style of CheckBox is a green colored tick, but I want to make it red colored cross.

How to do it.? Please Help.

I want to change the style.. not the color. Changing color is just a part of question. main part is how to change the the `tick` to `X` — Veer Shrivastav, Mar 14 '13 at 17:20

score 2 · Answer 1 · answered Mar 14 '13 at 17:13

Take a Custom Drawable selector with one image for unchecked state and another for checked state and set it as drawable resource for your Checkbox

Example:

Create a xml file in res/drawable folder

<selector xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:state_checked="true" android:drawable="@drawable/crossimagecheckbox" />
    <item android:state_checked="false" android:drawable="@drawable/uncheckecheckbox" />

</selector>

score 2 · Accepted Answer · edited May 23 '17 at 12:21

You can set any color of tick mark of Checkbox. but you need to make the custom checkbox for that.

Look here and here.

Source : Android: Set color of CheckBox

<?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/cbchk_blue"
    android:state_focused="false">
    <shape android:shape="rectangle">
        <stroke android:width="2dp" android:color="@color/blue_dark" />
        <gradient  android:endColor="@color/white" android:startColor="@color/blue_dark" android:type="sweep"  />
        <size android:height="30dp" android:width="30dp" />
    </shape>
</item>
<item android:state_checked="true" 
    android:drawable="@drawable/cbchk_blue"
    android:state_focused="true">
    <shape android:shape="rectangle">
        <stroke android:width="2dp" android:color="@color/white" />
        <gradient  android:endColor="@color/white" android:startColor="@color/blue_dark" android:type="sweep"  />
        <size android:height="30dp" android:width="30dp" />
    </shape>
</item>
<item android:state_checked="false" 
    android:drawable="@drawable/cbunchk_blue"
    android:state_focused="false">
    <shape android:shape="rectangle">
        <stroke android:width="2dp" android:color="@color/blue_dark" />
        <size android:height="30dp" android:width="30dp" />
    </shape>
</item>
<item android:state_checked="false" 
    android:drawable="@drawable/cbunchk_blue"
    android:state_focused="true">
    <shape android:shape="rectangle">
        <stroke android:width="2dp" android:color="@color/white" />
        <size android:height="30dp" android:width="30dp" />
    </shape>
</item>

What does the `` tag do.? I have not been through that tag before. — Veer Shrivastav, Mar 14 '13 at 17:24
@VeerShubhranshuShrivastav Use the tag to create a drawable in XML with for ex: rounded corners. (You can do other stuff with the shape tag like define a color gradient as well) — Ajay S, Mar 14 '13 at 17:27

score 2 · Answer 3 · edited Jun 11 '15 at 11:56

You need to create a selector for checkbox.

in layout checkbox add the following:

android:background="@drawable/checkbox_selector"

in checkbox_selector.xml

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false"
        android:drawable="@drawable/normal_picture" />
    <item android:state_checked="true"
        android:drawable="@drawable/checked_picture" />
</selector>

Now create normal_picture and checked_picture according to your requirement.

score 1 · Answer 4 · edited May 23 '17 at 12:29

I believe this link is highly relevant. Read Jean's answer:

Checkboxes being children of Button you can just give your checkbox a background image with several states as described here, under "Button style": http://developer.android.com/reference/android/widget/Button.html

...and exemplified here: http://developer.android.com/guide/topics/resources/drawable-resource.html#StateList

Changing checkbox style to Cross - Android

4 Answers4