Roberto Miranda
Roberto Miranda

Reputation: 93

Change CheckBox Style inside AlertDialog in Android

I am having troubles changing the chexbox theme of a Alert Dialog. I am not able to change selected checkbox color to my AccentColor.

this is my style code

<style name="AlertDialogCustom" parent="Theme.AppCompat.Light.Dialog.Alert">      
<item name="android:checkboxStyle">@style/CustomCheckBox</item>
</style>
<style name="CustomCheckBox"     parent="android:style/Widget.CompoundButton.CheckBox">
<item name="android:button">@drawable/activated_checkbox</item>
</style>

Selector : activated_checkbox

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

and method that shows the AlertDialog.

private void showDialog() {

    final CharSequence[] items = getResources().getStringArray(R.array.tipoDescargas);
    final boolean[] states = {false, false, false};
    AlertDialog.Builder builder = new AlertDialog.Builder(this,R.style.AlertDialogCustom);
    builder.setTitle(getResources().getString(R.string.preguntaDescargas));
    builder.setMultiChoiceItems(items, states, new DialogInterface.OnMultiChoiceClickListener() {
        public void onClick(DialogInterface dialogInterface, int item, boolean state) {
        }
    });
    builder.setPositiveButton("Descargar", new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog, int id) {
            SparseBooleanArray CheCked = ((AlertDialog) dialog).getListView().getCheckedItemPositions();
            if (CheCked.get(0) && CheCked.get(1) && CheCked.get(2))
                Toast.makeText(getApplication(), "TODOS", Toast.LENGTH_SHORT).show();
            if (CheCked.get(0)) {
                Toast.makeText(getApplication(), "Item 1", Toast.LENGTH_SHORT).show();
            }
            if (CheCked.get(1)) {
                Toast.makeText(getApplication(), "Item 2", Toast.LENGTH_SHORT).show();
            }
            if (CheCked.get(2)) {
                Toast.makeText(getApplication(), "Item 3", Toast.LENGTH_SHORT).show();
            }
        }
    });
    builder.setNegativeButton("Cancelar", new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog, int id) {
            dialog.cancel();
        }
    });builder.create().show();
}

Can anyone help me? Thank you

UPDATE 1

<style name="AlertDialogCustom" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:checkedTextViewStyle">@style/CustomCheckBox</item>
</style>

<style name="CustomCheckBox" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:checkMark">@drawable/activated_checkbox</item>
</style>

SOLUTION

I found the solution that display correctly the color.

<style name="AlertDialogCustom" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:listChoiceIndicatorMultiple">@drawable/activated_checkbox</item>
</style>

and Selector

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

Upvotes: 4

Views: 3891

Answers (3)

Roberto Miranda
Roberto Miranda

Reputation: 93

With this code, icons displays correctly

<style name="AlertDialogCustom" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="android:listChoiceIndicatorMultiple">@drawable/activated_checkbox</item>
</style>

and the selector code

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

Upvotes: 5

MH.
MH.

Reputation: 45503

The default multi choice layout that AlertDialog uses for presenting each option is in fact a CheckedTextView. Since this class doesn't extend CheckBox in any way, the android:checkboxStyle reference in your theme will have no effect.

API level 17 added the attribute android:checkedTextViewStyle, which can be used to style CheckedTextView specifically. If your minimum sdk version is set to this, or any higher version, then you could use this approach.

An alternative that, also available on older platforms, is android:listChoiceIndicatorMultiple (there is also an equivalent for single choice items, or perhaps better said: items that visually look like radio buttons, but again, are CheckedTextView in reality). Use this to supply your own drawable that is to be displayed as checkmark (or radio button circle).

Upvotes: 0

KishuDroid
KishuDroid

Reputation: 5451

You can make use custom selector for customizing your check box.

<CheckBox
    android:text="Custom CheckBox"
    android:button="@drawable/checkbox_selector"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>

Your Selector class , put it in drawable folder :

<?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/checkedimage" />
    <item android:state_checked="false" android:drawable="@drawable/uncheckedimage" />
</selector>

Upvotes: 0

Related Questions