CODEWITHSUNDEEP
androidcheckbox
Marian Pavel
Marian Pavel

Reputation: 2876

Android replace checkbox style with custom drawable selector

I have tried to make a xml selector with the following:

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

and when I try to set the backgroundDrawable to the checkBox the checkbox doesn't replace the CheckBox style too:

  shuffle.setBackground(android.support.v4.content.res.ResourcesCompat.getDrawable(getResources(), R.drawable.shuffle, null));

Following this question: Change icons of checked and unchecked for Checkbox for Android I need to set the button drawable with my xml: android:button="@drawable/checkbox" but I can't do this because I'm creating the CheckBox programmatically. Is there a way how to achieve this?

Upvotes: 13

Views: 39171

Answers (7)

CoolMind
CoolMind

Reputation: 28793

Looking at https://m2.material.io/components/checkboxes/android#key-properties I found that we should use button and useMaterialThemeColors (and maybe app:buttonTint="@null"):

<CheckBox
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:button="@drawable/selector_checkbox"
    android:checked="true"
    android:text="text"
    app:useMaterialThemeColors="false" />

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

enter image description here

If you want to adjust styles do this:

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="checkboxStyle">@style/Widget.CheckBox</item>

<style name="Widget.CheckBox" parent="Widget.MaterialComponents.CompoundButton.CheckBox">
    <item name="android:button">@drawable/selector_checkbox</item>
    <item name="android:textAppearance">your text appearance</item>
    <item name="useMaterialThemeColors">false</item>
</style>

Upvotes: -1

Tienanhvn
Tienanhvn

Reputation: 269

drawable/checkbox_custome.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/checkbox_empty" />
    <item android:state_checked="true"
        android:drawable="@drawable/checkbox_check" />
</selector>

Upvotes: 1

koutuk
koutuk

Reputation: 832

Use This 

shuffle.setButtonDrawable(R.drawable.custom_checkbox_selector);

XML code;

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

    <item android:drawable="@drawable/radiobutton_checked" android:state_checked="true"/>
    <item android:drawable="@drawable/radiobutton_unchecked" android:state_checked="false"/>

</selector>

Upvotes: 5

Mikhail Valuyskiy
Mikhail Valuyskiy

Reputation: 1288

If you use sdk 28 (androidx) and above try to use

androidx.appcompat.widget.AppCompatCheckBox

instead of

Checkbox

Upvotes: 5

TetianaDev
TetianaDev

Reputation: 381

This works for me:

<android.support.v7.widget.AppCompatCheckBox
android:id="@+id/checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/custom_checkbox"
android:button="@null"/>

Upvotes: 4

Sunil
Sunil

Reputation: 3793

Simple way

  1. Create a new layout in drawable folder and name it custom_checkbox (You can rename also)

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

  2. Use this in your layout activity

    <CheckBox
android:id="@+id/checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="@drawable/custom_checkbox"/>

Upvotes: 25

Madhu
Madhu

Reputation: 1800

Use below line of code, i think it will work

yourcheckbox.setButtonDrawable(yourdrawable);

Upvotes: 13

Related Questions