Martin
Martin

Reputation: 4846

custom style on dialog checkbox

I'm trying to style an AlertDialog to please a customer. They like the Blue title bar on Theme.Holo.Light.Dialog but like the green checkboxes from another theme. this is what I want to produce:

enter image description here

So, I've got a style definitions like this:

<style name="MyDialogTheme" parent="@android:Theme.Holo.Light.Dialog">
            <item name="android:listChoiceIndicatorMultiple">@drawable/checkbox_green</item>
</style> 

<style name="mycheckbox" parent="@android:style/Widget.CompoundButton.CheckBox">
    <item name="android:button">@drawable/checkbox_box</item>

</style>

and I've got a definition for checkbox_green as follows which are just PNG files:

<item android:state_checked="false" 
    android:drawable="@drawable/checkbox_unchecked" />

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

</selector>

and I create my dialog builder with a specific theme in Java like so:

 ContextThemeWrapper ctw = new ContextThemeWrapper( mContext, R.style.MyDialogTheme);
 AlertDialog.Builder builder= new AlertDialog.Builder( ctw );

But I cannot get the dialog to display green checkboxes instead of the blue in this theme. I get this: enter image description here

I could go ahead and create an entire layout and then use that like this:

 AlertDialog shareDialog  = new AlertDialog.Builder(mContext).create();
 LayoutInflater inflater = MainActivity.this.getLayoutInflater();

 View dialogView = null;
 dialogView = inflater.inflate(R.layout.share, (ViewGroup) getCurrentFocus());
 shareDialog.setView(dialogView);

but that requires styling all of the dialog, not just the checkboxes.It seems so much simpler to just re-style the checkboxes but I'm not able to make that work.

what must I do, other than to create a complete layout and use to get the green checkboxes rather than the blue?

Upvotes: 1

Views: 5918

Answers (3)

KitKat
KitKat

Reputation: 1515

Actually, you CAN change the checkbox inside a multi-choice dialog.

You need a custom adapter for your dialog, so as to have access to the views of the list. Then, you call method setCheckMarkDrawable of class CheckedTextView.

Here is an example:

enter image description here

File default_checkbox.xml inside res/drawable

<?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" /> <!-- checked -->

    <item android:state_pressed="true"
        android:drawable="@drawable/checkbox_checked" /> <!-- pressed -->

    <item android:drawable="@drawable/checkbox_default" /> <!-- default -->

</selector>

File DialogUtil.java

package example.dialog;

import android.app.AlertDialog;
import android.content.Context;
import android.util.Log;
import android.view.*;
import android.widget.*;
import android.widget.AdapterView.OnItemClickListener;

public class DialogUtil {

    private DialogUtil() {
    }

    public static AlertDialog show(Context context) {
        String[] items = {"text 1", "text 2", "text 3"};
        AlertDialog.Builder builder = new AlertDialog.Builder(context);
        builder.setTitle("Test")
            .setPositiveButton("OK", null)
            .setAdapter(new CustomAdapter(context, items), null);
        AlertDialog dialog = builder.show();

        ListView list = dialog.getListView();
        list.setItemsCanFocus(false);
        list.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
        list.setOnItemClickListener(listener);
        return dialog;
    }

    private static OnItemClickListener listener = new OnItemClickListener() {

        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            Log.i("DialogUtil", "Clicked on " + view);
        }
    };

    private static class CustomAdapter extends ArrayAdapter<String> {

        public CustomAdapter(Context context, String[] array) {
            super(context, android.R.layout.simple_list_item_multiple_choice, array);
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            View view = super.getView(position, convertView, parent);
            if (view instanceof CheckedTextView) {
                CheckedTextView checkedView = (CheckedTextView) view;
                checkedView.setCheckMarkDrawable(R.drawable.default_checkbox);
            }
            return view;
        }
    }
}

NOTE: If you simply use AlertDialog, then before getting the ListView, you call show, firstly, like explained above.

However, if you use DialogFragment and onCreateDialog, then you get the ListView, inside onStart.

Upvotes: 2

bryceweller
bryceweller

Reputation: 1

As far as I can tell, there's no way to just style parts of the dialog without creating a custom View object.

Create a style like:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AlertDialogCustom" parent="@android:style/AlertDialog">
        <item name="android:textColor">#00FF00</item>
        <item name="android:typeface">monospace</item>
        <item name="android:textSize">10sp</item>
    </style>
</resources>

Inflate view like:

AlertDialog.Builder builder = new AlertDialog.Builder(new ContextThemeWrapper(this, R.style.AlertDialogCustom));

Here are attributes for checkboxes to be used with your custom AlertDialog style.

Upvotes: -1

karan
karan

Reputation: 8853

it should go as below...

first design your checkboxes as you want in any compatible format(jpeg,png)...and place them in drawable folder...

then make seperate xml for buttons and select images you designed for selected and unselected checkboxes...and place this file in drawable folder of your project with proper name say here customchk.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/chk2" />   //custom image 
 <item android:state_checked="true" android:drawable="@drawable/chk1" />   //custom image 
 <item android:drawable="@drawable/chk2" /> <!-- default -->
</selector>

then make your checkbox:button set to your xml file...as below

<CheckBox
            android:id="@+id/notifs"
            android:layout_width="150dp"
            android:button="@drawable/customchk"     //your xml
            android:layout_height="wrap_content"
/>

i guess it should work you do not need to change the all the dialog...

Upvotes: 0

Related Questions