Check box change background icons in Android

Question

I have looking for posts that would help me in implementing a custom check box.I have a checkbox for determining whether its a favourite or not and using two different custom icons for displaying the state.I have used small int as datatype(0 or 1) to determine whether favourite or not.I have tried using onclicklistener as well as oncheckchangelistener,but no luck.

This is my drawable

<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/ic_action_important" android:state_checked="false"/>
    <item android:drawable="@drawable/ic_action_important_holo_dark" android:state_checked="true"/>
       <item android:drawable="@drawable/ic_action_important_holo_dark" android:state_pressed="true"/>
        <item  android:state_focused="true"
  android:drawable="@drawable/ic_action_important_holo_dark" />
    <!-- <item android:drawable="@drawable/ic_action_important"/>     -->
</selector>

This the checkbox code..

<CheckBox
        android:id="@+id/is_favourite_check"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/email_img_button"
        android:layout_marginLeft="12dp"
        android:clickable="true"
        android:layout_toRightOf="@+id/email_img_button"
        android:button="@drawable/checkbox_selector" />

And this is the implemented code in fragment.

is_Favourite.setOnCheckedChangeListener(this);
@Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        if (((CheckBox) buttonView).isChecked()) 
        {
            int result=mContactsManager.updateInfo(info.getId(), 1);
            Log.d("Test", "Result is "+result +" ie is favourite");

        } else {

            int result=mContactsManager.updateInfo(info.getId(), 0);
            Log.d("Test", "Result is "+result +" ie not a favourite");
        }
    }

when its 1 I tried setting it to chkbox.setchecked(true) and if 0 to chkbox.setchecked(false).But this doesnt seem to be working.Any mistakes in my logic?? Plz do help.Thanks in advance.

Answer 1

Add to CheckBox android:button="@drawable/your_drawable_xml"

Answer 2

Few months back i faced same problem, but finally i found a simple and sweet solution, you have to use two different drawable images one to indicate checked and second to indicate unchecked !

CustomCheckboxActivity.java

package com.example;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.Toast;

public class CustomCheckboxActivity extends Activity {
    private CheckBox checkBox1;
      private CheckBox checkBox2;

      /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        checkBox1=(CheckBox)findViewById(R.id.checkBox1);
        checkBox2=(CheckBox)findViewById(R.id.checkBox2);
        Button button=(Button)findViewById(R.id.button1);
        button.setOnClickListener(new OnClickListener() {

                  public void onClick(View v) {
                        if(checkBox1.isChecked()==true && checkBox2.isChecked()){
                              Toast.makeText(getApplicationContext(), checkBox1.getText()+"  "+checkBox2.getText(), Toast.LENGTH_LONG).show();
                        }
                        else if (checkBox1.isChecked()==true){
                              Toast.makeText(getApplicationContext(), checkBox1.getText(), Toast.LENGTH_LONG).show();
                              }
                        else if(checkBox2.isChecked()==true){
                              Toast.makeText(getApplicationContext(), checkBox2.getText(), Toast.LENGTH_LONG).show();

                        }

                  }
            });

    }
}

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#ffffff"
    >
<TextView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/hello"
    />
<CheckBox
android:text="  OptionOne"
android:textColor="#000000"
android:button="@drawable/custom_checkbox"
android:id="@+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</CheckBox>
<CheckBox
android:text="  OptionTwo"
android:textColor="#000000"
android:button="@drawable/custom_checkbox"
android:id="@+id/checkBox2"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</CheckBox>
<Button
android:text="Button"
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</Button>
</LinearLayout>

To customize checkbox, create an xml file in drawable folder res/drawable/custom_checkbox.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" />

Answer 3

try this selector .

if I put drawable wrong then please change it.

it's work in my app.

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

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

    <item android:state_checked="true" android:state_window_focused="false"
          android:state_enabled="true"
          android:drawable="@drawable/ic_action_important_holo_dark" />

    <item android:state_checked="false" android:state_window_focused="false"
          android:state_enabled="true"
          android:drawable="@drawable/ic_action_important" />

    <item android:state_checked="true" android:state_focused="true"
          android:state_enabled="true"
          android:drawable="@drawable/ic_action_important_holo_dark" />

    <item android:state_checked="false" android:state_focused="true"
          android:state_enabled="true"
          android:drawable="@drawable/ic_action_important" />

    <item android:state_checked="false"
          android:state_enabled="true"
          android:drawable="@drawable/ic_action_important" />

    <item android:state_checked="true"
          android:state_enabled="true"
          android:drawable="@drawable/ic_action_important_holo_dark" />

</selector>

Answer 4

use this -

<CheckBox 
  ...
 android:button="@drawable/your_drawable_xml
                />

Answer 5

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

    <item android:drawable="@drawable/ic_action_important_holo_dark" android:state_checked="true"/>
    <item android:drawable="@drawable/ic_action_important" android:state_checked="false"/>
    <item android:drawable="@drawable/ic_action_important"/>

</selector>

Set this drawable as button for checkbox and try.Let me know whether your problem solved or not.