Defining custom-checkbox in android

smriti3 picture smriti3 · Nov 16, 2013 · Viewed 24.6k times · Source

How to make a custom check-Box in android

my current XML::

<LinearLayout
            android:id="@+id/linearLayout_individualdays"
            android:layout_width="wrap_content"
            android:layout_height="40dp"
            android:layout_below="@+id/linearLayout_type_of_days"
            android:gravity="center|top"
            android:orientation="horizontal"
            android:paddingLeft="5dp"
            android:paddingTop="10dp"
            android:visibility="gone" >

            <CheckBox
                android:id="@+id/checkBox1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Mon" />

            <CheckBox
                android:id="@+id/checkBox2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Tue" />

            <CheckBox
                android:id="@+id/checkBox3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Wed" />

            <CheckBox
                android:id="@+id/checkBox4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Thu" />

        </LinearLayout>

Out-Put::

enter image description here

But How to make something like below::

enter image description here

  • here blue border shows its selected
  • else its not selected
  • It has to be a check-box

Hope i am clear !

Answer

zohreh picture zohreh · Nov 16, 2013

use this code

select.xml in drawable folder

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

        <solid android:color="#ffffff" >
        </solid>

        <stroke
            android:width="2dp"
            android:color="#ff0000" >
        </stroke>
<corners android:radius="5dp" />

    <padding
        android:bottom="4dp"
        android:left="4dp"
        android:right="4dp"
        android:top="4dp" />
    </shape>

deselect.xml in drawable folder

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

        <solid android:color="#ffffff" >
        </solid>

        <stroke
            android:width="2dp"
            android:color="#000000" >
        </stroke>
    <corners android:radius="5dp" />

    <padding
        android:bottom="4dp"
        android:left="4dp"
        android:right="4dp"
        android:top="4dp" />
    </shape>

and custom checkbox

public class checkbox extends CheckBox{



    public checkbox(Context context, AttributeSet attrs) {
            super(context, attrs);
            //setButtonDrawable(new StateListDrawable());
        }
        @Override
        public void setChecked(boolean t){
            if(t)
            {
                this.setBackgroundResource(R.drawable.select);
            }
            else
            {
                this.setBackgroundResource(R.drawable.deselect);
            }
            super.setChecked(t);
        }
        }

checkbox

 <com.example.checkbox.checkbox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@null"
        android:checked="true"
        android:text="checked" />

you can change color in select.xml and deselect.xml to thing that you want