How to remove default images of checkbox

Question

i don't want to show default images of checkkBox.. I want to use drawable images on checked and unchecked state of checkBox. here is my selector file...

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

    android:top="10dp"

    android:bottom="10dp"    >
</padding>

</selector>

here is my checkBox in xml looks like

  <CheckBox
       android:id="@+id/xyz"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_centerVertical="true"
       android:layout_alignParentRight="true"
       android:layout_marginRight="10dp"
       android:background="@drawable/selector"/>

it's overlaping with default images of checkBox...

score 3 · Accepted Answer · answered Apr 28 '14 at 12:12

3

You need to set android:button property :

<CheckBox android:button="@drawable/your_drawable" />

your_drawable.xml

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

answered Apr 28 '14 at 12:12

Neige

2,770
2
15
21

which image i need to put in android:button property... bcs i have only two images which i can show on checked and unchecked state – Mehboob Maniyar Apr 28 '14 at 12:18
Replace `ic_2` by your checked image, and `ic_1` by your unchecked image. You also need to put your images into `res/drawable/` folder. – Neige Apr 28 '14 at 12:19
that's fine but which images i need to replace with your_drawable – Mehboob Maniyar Apr 28 '14 at 12:25
this is not an image but a file (res/drawable/your_drawable.xml) – Neige Apr 28 '14 at 12:27
no problem, take a look here if you want more information about drawable : http://developer.android.com/guide/topics/resources/drawable-resource.html – Neige Apr 28 '14 at 12:36

shweta_jain · Answer 2 · 2014-04-28T12:45:11.457

Try this code -

Make and customcheckbox.xml in to res/drawable folder

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/image_checkbox_selected" android:state_checked="true" android:state_focused="true"/>
    <item android:drawable="@drawable/image_checkbox_normal" android:state_checked="false" android:state_focused="true"/>
    <item android:drawable="@drawable/image_checkbox_normal" android:state_checked="false"/>
    <item android:drawable="@drawable/image_checkbox_selected" android:state_checked="true"/>

</selector>

then in your main xml use this code in your checkbox tag

<CheckBox
            android:id="@+id/checkBox1"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:button="@drawable/customcheckbox"
            android:focusable="false" />

Hope this code helps you!!!

if its not working please let me know i will try to help you more.

it's working but it's overlapping with default checkBox images... i don't want to show default checkBox Images... — Mehboob Maniyar, Apr 28 '14 at 12:27

score 0 · Answer 3 · answered Apr 28 '14 at 12:24

check_box_bg.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_on_background" /> <!-- checked --> 
      <item android:state_checked="false" 
         android:drawable="@drawable/checkbox_off_background" /> <!-- unchecked-->
      </selector>

then you have to use this

android:button="@drawable/check_box_bg"

as

  <CheckBox
                android:id="@+id/qfourcustomcbone"
                android:layout_width="20dp"
                android:layout_height="20dp"
                android:layout_marginLeft="15dp"
                android:button="@drawable/check_box_bg"/>

score 0 · Answer 4 · answered Apr 28 '14 at 12:41

Try below code for custom selector name as custom_checkbox.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/icon_focused_check" android:state_checked="true" android:state_focused="true" android:state_pressed="false"/>
<item android:drawable="@drawable/icon_focused_check" android:state_checked="true" android:state_focused="true" android:state_pressed="true"/>
<item android:drawable="@drawable/icon_check" android:state_checked="true" android:state_focused="false" android:state_pressed="true"/>
<item android:drawable="@drawable/icon_check" android:state_checked="true"/>
<item android:drawable="@drawable/icon_focused_uncheck" android:state_checked="false" android:state_focused="true" android:state_pressed="false"/>
<item android:drawable="@drawable/icon_focused_uncheck" android:state_checked="false" android:state_focused="true" android:state_pressed="true"/>
<item android:drawable="@drawable/icon_uncheck" android:state_checked="false" android:state_focused="false" android:state_pressed="true"/>
<item android:drawable="@drawable/icon_uncheck" android:state_checked="false"/>

</selector>

Add this to your checkbox
<CheckBox android:button="@drawable/custom_checkbox"/>

How to remove default images of checkbox

4 Answers4