Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to center progress indicator in ProgressDialog easily (when no title/text passed along)

When calling progressDialog = ProgressDialog.show(this, null, null, true); usually the developers wants to only show the progress indication image, and usually would it expect to be centered within the window (at least from regular UI design point of view). But the image is too far left, it seems that some padding/margin on the right hand side is still being calculated in for (optional) text on the right, although we're not passing any text as parameter. It would just make life little easier for a developer :) So we don't need to create a custom dialog only in order to have the progress indicator being centered by default.

(I filed this as a feature request at http://code.google.com/p/android/issues/detail?id=9697; please star it if you would also like to see this improved).

Now my questions:

  1. How can I easily center the progress image without having to entirely create my own custom alert dialog class? Any parameter I might have overlooked?

  2. Furthermore, how to set the background to transparent?

I'm also wondering about this: https://stackoverflow.com/questions/2866141/how-to-put-custom-animation-into-a-progressdialog I haven't actually tried it myself yet but if you cannot create custom animations, it means if you want a kind of animated progress indicator, you always need to extend the ProgressDialog class? Looking at the ProgressDialog class though, I don't find anything other than regular drawables though (ProgressDialog.java), they're not using AnimatedDrawable there.

like image 871
Mathias Conradt Avatar asked Jul 12 '10 04:07

Mathias Conradt


4 Answers

I did some testing and I feel that the best way to achieve this is doing a custom Dialog.

Here is an example of what I did. This will answer question number 2 but will give you an idea of how to fix question number 1.

public class MyProgressDialog extends Dialog {

    public static MyProgressDialog show(Context context, CharSequence title,
            CharSequence message) {
        return show(context, title, message, false);
    }

    public static MyProgressDialog show(Context context, CharSequence title,
            CharSequence message, boolean indeterminate) {
        return show(context, title, message, indeterminate, false, null);
    }

    public static MyProgressDialog show(Context context, CharSequence title,
            CharSequence message, boolean indeterminate, boolean cancelable) {
        return show(context, title, message, indeterminate, cancelable, null);
    }

    public static MyProgressDialog show(Context context, CharSequence title,
            CharSequence message, boolean indeterminate,
            boolean cancelable, OnCancelListener cancelListener) {
        MyProgressDialog dialog = new MyProgressDialog(context);
        dialog.setTitle(title);
        dialog.setCancelable(cancelable);
        dialog.setOnCancelListener(cancelListener);
        /* The next line will add the ProgressBar to the dialog. */
        dialog.addContentView(new ProgressBar(context), new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
        dialog.show();

        return dialog;
    }

    public MyProgressDialog(Context context) {
        super(context, R.style.NewDialog);
    }
}

All the static methods comes from this link, nothing strange, but the magic occurs in the constructor. Check that I pass as parameter an style. That style is the following:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="NewDialog" parent="@android:Theme.Dialog">
        <item name="android:windowFrame">@null</item>
        <item name="android:windowBackground">@android:color/transparent</item>
        <item name="android:windowIsFloating">true</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowTitleStyle">@null</item>
        <item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
        <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
        <item name="android:backgroundDimEnabled">false</item>
        <item name="android:background">@android:color/transparent</item>
    </style>
</resources>

The result of this is a ProgressBar rotating in the center of the screen. Without backgroundDim and without the Dialog box.

like image 128
Macarse Avatar answered Nov 02 '22 21:11

Macarse


Easy and customizable way:

Define animation: (res/drawable/loader_anim.xml)

<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/image_for_rotation"
android:pivotX="50%"
android:pivotY="50%" />

or:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:drawable="@drawable/img_loader_frame1"
android:duration="150"/>
...
<item
android:drawable="@drawable/img_loader_frame2"
android:duration="150"/>
...
</animation-list>

then, define layout: (res/layout/loader.xml)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/layout_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_gravity="center_vertical|center_horizontal"> 
<ProgressBar
android:layout_width="200dp"
android:layout_height="200dp"
android:indeterminateDrawable="@drawable/loader_anim" />
</LinearLayout>

and then, instance progress dialog:

ProgressDialog dialog;
...
dialog = ProgressDialog.show(this,null,null);
dialog.setContentView(R.layout.loader);
...
process();
...
dialog.dismiss();

More info:

like image 32
Hpsaturn Avatar answered Nov 02 '22 19:11

Hpsaturn


I use the following, it requires no layout file, and puts a centered, borderless blocking progress bar in the middle of the screen.

private ProgressDialog progressDialog;


setUIToWait(true);

...long process...

setUIToWait(false);


private void setUIToWait(boolean wait) {

    if (wait) {
        progressDialog=ProgressDialog.show(this,null,null);
        progressDialog.setContentView(new ProgressBar(this));
    } else {
        progressDialog.dismiss();
    }

}
like image 24
egalot Avatar answered Nov 02 '22 19:11

egalot


If you want to display indeterminate progress bar only.

ProgressDialog progressDialog = ProgressDialog.show(this, null, null, true, false);
progressDialog.setContentView(R.layout.progress_layout);

And create a layout xml file with name "progress_layout.xml"

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <ProgressBar
        android:id="@+id/progressBar1"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />

</LinearLayout>
like image 19
3 revs Avatar answered Nov 02 '22 21:11

3 revs