Progress Dialog appears weirdly on Pre-lollipop devices

Question

My progress dialog on pre-lollipop devices appears like this:

See that double window? I have no clue as to why this this happening.

Code

1. Initializing the progress dialog like this:

   progressDialog = new ProgressDialog(context);
   progressDialog.setMessage(messsage);
   progressDialog.setIndeterminate(true);
   progressDialog.setCancelable(false);
   

2. Defined a style like this in values and values-21:

<style name="AlertDialog.Theme" parent="Theme.AppCompat.Light.Dialog">
        <item name="android:textColorPrimary">@color/black</item>
        <item name="android:background">@color/white</item>
        <item name="android:textColor">@color/black</item>
        <item name="colorAccent">@color/orange</item>
        <item name="colorPrimary">@color/orange</item>
        <item name="colorPrimaryDark">@color/darkerorance</item>
    </style>

3. After some searching on google, I added the alert style in my main theme like this:

<item name="android:dialogTheme">@style/AlertDialog.Theme</item>
        <item name="dialogTheme">@style/AlertDialog.Theme</item>
        <item name="android:alertDialogTheme">@style/AlertDialog.Theme</item>
        <item name="alertDialogTheme">@style/AlertDialog.Theme</item>

And the main theme extends from Theme.AppCompat.Light.NoActionBar.

This works great on Lollipop and above, but appears like in the image on pre-lollipop. Can anyone help out here and tell me what am I doing wrong?

Answer 1

Your answer is not working for pre-Lollipop (tested on API 19). But I find solution: you need to use android.support.v7.app.AlertDialog (in import settings)

Answer 2

I am a little late replying but this is how I got around solving it.
I created a separate v-14 styles.xml and defined a style as shown below

values-v14/styles.xml

<style name="AlertDialog.Holo" parent="@android:style/Theme.Holo.Light.Dialog">
    <item name="android:textColorPrimary">@color/black</item>
    <item name="android:textColor">@color/black</item>
    <item name="android:textAppearance">@style/Helvetica.Regular</item>
    <item name="android:windowTitleStyle">@style/DialogTitleStyle</item>
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
</style>

P.S - textAppearance and windowTitleStyle are styles I had created for the custom fonts.

The regular (values/styles.xml) alert dialog style used is:

<style name="AlertDialog.Theme" parent="Theme.AppCompat.Light.Dialog">
    <item name="android:textColorPrimary">@color/black</item>
    <item name="android:textColor">@color/black</item>
    <item name="colorAccent">@color/zifycolor</item>
    <item name="colorPrimary">@color/zifycolor</item>
    <item name="colorPrimaryDark">@color/zifycolorDarker</item>
    <item name="android:windowTitleStyle">@style/DialogTitleStyle</item>
    <item name="buttonBarButtonStyle">@style/AlertDialogButtonStyle</item>
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>

Finally to show a progress dialog:

/**
 * Create a progress dialog. The appropriate theme gets applied.
 *
 * @param context  valid context with a window
 * @param messsage message to show
 * @return {@code ProgressDialog} instance
 */
public static ProgressDialog createProgressDialog(@NonNull final Context context, @NonNull String messsage) {
    ProgressDialog progressDialog;

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
        progressDialog = new ProgressDialog(context, R.style.AlertDialog_Theme);
    else
        progressDialog = new ProgressDialog(context, R.style.AlertDialog_Holo);

    progressDialog.setMessage(messsage);
    progressDialog.setCancelable(false);
    return progressDialog;

}

So far it works great! Hope it helps somebody.