Android Theming Preference Dialog

Question

I have an application that uses a preference activity to set some user settings. I been trying to figure this out all day. I am trying to theme the alert dialog when an user presses an Edit Text Preference object. A dialog opens up and the user can set the shared preference. The dialog pops up:

I want the text green. I want the divider green. The line and cursor green.

This is what I have so far.

<style name="CustomDialogTheme" parent="@android:style/Theme.Dialog">
    <item name="android:background">@color/text_green</item>
    <item name="android:textColor">@color/text_green</item>
</style>

Can someone point me in the right direction or maybe share some code. I am at lost. I've been surfing the net to find something most of the day. Thanks in advance.

Answer 1

If you don't want to create a custom layout or use a third party library, you can subclass EditTextPreference, then access each View you want to edit by using Resources.getIdentifier then using Window.findViewById. Here's a quick example.

public class CustomDialogPreference extends EditTextPreference {

    public CustomDialogPreference(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public CustomDialogPreference(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    /**
     * {@inheritDoc}
     */
    @Override
    protected void showDialog(Bundle state) {
        super.showDialog(state);
        final Resources res = getContext().getResources();
        final Window window = getDialog().getWindow();
        final int green = res.getColor(android.R.color.holo_green_dark);

        // Title
        final int titleId = res.getIdentifier("alertTitle", "id", "android");
        final View title = window.findViewById(titleId);
        if (title != null) {
            ((TextView) title).setTextColor(green);
        }

        // Title divider
        final int titleDividerId = res.getIdentifier("titleDivider", "id", "android");
        final View titleDivider = window.findViewById(titleDividerId);
        if (titleDivider != null) {
            titleDivider.setBackgroundColor(green);
        }

        // EditText
        final View editText = window.findViewById(android.R.id.edit);
        if (editText != null) {
            editText.setBackground(res.getDrawable(R.drawable.apptheme_edit_text_holo_light));
        }
    }
}

Implementation

Replace <EditTextPreference.../> with <path_to_CustomDialogPreference.../> in your xml.

Note

I used Android Holo Colors to create the background for the EditText.

Answer 2

You can build your custom layout for your own dialog theme using your own customized components or you can use external libs, for example android-styled-dialogs

So in this case use can customize dialogs as you want:

<style name="DialogStyleLight.Custom">
    <!-- anything can be left out: -->
    <item name="titleTextColor">@color/dialog_title_text</item>
    <item name="titleSeparatorColor">@color/dialog_title_separator</item>
    <item name="messageTextColor">@color/dialog_message_text</item>
    <item name="buttonTextColor">@color/dialog_button_text</item>
    <item name="buttonSeparatorColor">@color/dialog_button_separator</item>
    <item name="buttonBackgroundColorNormal">@color/dialog_button_normal</item>
    <item name="buttonBackgroundColorPressed">@color/dialog_button_pressed</item>
    <item name="buttonBackgroundColorFocused">@color/dialog_button_focused</item>
    <item name="dialogBackground">@drawable/dialog_background</item>
</style>