Styling DialogFragment dialog pre ice cream sandwich

Question

I'm trying to style a FragmentDialog pre 4.0 so it appears as post 4.0.

I'm using ActionBarSherlock but I have to style it myself pre Ice Cream Sandwich.

I want to get following look:

But I'm getting this:

So basically I want it to not fill out the entire screen.

I've tried various styling but all without success and I've gotten to the point where I'm hoping there is some expert that can help me or guide me in the right direction

My DialogFragment:

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //TODO Style 2.3 to look like 4.0
        int sdk = android.os.Build.VERSION.SDK_INT;
        if(sdk < android.os.Build.VERSION_CODES.HONEYCOMB) {
            setStyle(DialogFragment.STYLE_NO_TITLE, R.style.Pre_Honeycomb_Holo_Dialog);
        }
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = null;
        int sdk = android.os.Build.VERSION.SDK_INT;
        if(sdk < android.os.Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
            view = inflater.inflate(R.layout.info_dialog_view, container);
        } else {
            view = inflater.inflate(R.layout.info_dialog_view_content, container);
            this.getDialog().setTitle(R.string.info_dialog_title);
        }
...

Basically I'm building the title layout pre Ice Cream Sandwich but the content area is the same.

My holo_dialog_style:

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
    <style name="Pre.Honeycomb.Holo.Dialog" parent="Theme.Sherlock.Light">
        <item name="android:windowTitleStyle">@null</item>
        <item name="android:windowFrame">@null</item>
        <item name="android:windowBackground">@drawable/panel_bg_holo_light</item>
        <item name="android:windowIsFloating">true</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
        <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
    </style>
</resources>

Answer 1

This is one of the many cases where libraries are your friend!

I'd suggest using Styled Dialogs for Android.

It is able to produce dialogs looking like this:

To use it what you would need to do is first add it to Maven (if you are using it):

<dependency>
    <groupId>eu.inmite.android.lib</groupId>
    <artifactId>android-styled-dialogs</artifactId>
    <version>1.0.1</version>
    <type>apklib</type>
</dependency>

or if you are using Ant, then you would want to just download the latest jar.

Now, you just need to setup your themeing to use the theme that you desire. Add the following to your application theme:

Holo Light

<item name="sdlDialogStyle">@style/DialogStyleLight.Custom</item>

Holo Dark

<item name="sdlDialogStyle">@style/DialogStyleDark.Custom</item>

You can also add the following style to allow you to customize as necessary:

<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>

Once you have that it's pretty easy to use:

Dialog With a Simple Message and Close Button

SimpleDialogFragment.createBuilder(this, getSupportFragmentManager()).setMessage(R.string.message).show();

Dialog With a Title, Message and Close Button

SimpleDialogFragment.createBuilder(this, getSupportFragmentManager()).setTitle(R.string.title).setMessage(R.string.message).show();

Dialog With a Title, Message and Two Buttons

SimpleDialogFragment.createBuilder(this, getSupportFragmentManager()).setTitle(R.string.title).setMessage(R.string.message).setPositiveButtonText(R.string.positive_button).setNegativeButtonText(R.string.negative_button).show();

For additional examples, there's a couple demos available as well.