Skip to content

Android: Blurring and dimming background windows from dialogs

by mat on January 17th, 2010

The android SDK has lots of nice goodies built in to make your applications look sexier. One such feature is the blurring of windows. This effect looks particularly nice if a background window is blurred while a dialog box is shown above which can really make it stand out. Below shows the application such an example; on the left is the default about box (for WordCube Pro) and on the right is with added blur and no dimming.

android blur dim, before, after

android bluring and dimming effect before and after

I am using the AlterDialog.Builder to create my dialog, however this method will work with all kinds of dialog providing you can access it via getWindow.

   dialog = new AlertDialog.Builder(WordCube.this)
   .setTitle(WordCube.this.getResources().getString(R.string.app_name))
   .setMessage(s)
   .setIcon(R.drawable.logo)
   .setPositiveButton(R.string.btn_close, null)
   .show();

Below shows the code needed to add blur and remove dimming of the background (as I think the blur looks nicer when the background is well lit).

WindowManager.LayoutParams lp = dialog.getWindow().getAttributes();
lp.dimAmount=0.0f;
dialog.getWindow().setAttributes(lp);
dialog.getWindow().addFlags(WindowManager.LayoutParams.FLAG_BLUR_BEHIND);

The blur is simply created using the last line (line 4) which sets a flag for the dialog telling android that we want windows below this one to be blurred. To achieve the dimming, we need to retrieve the layout parameters for the dialog window, set the dim amount to zero, update these parameters with setAttributes (lines 1-3).

Any comments, questions, or improvements please let me know.

23 Comments
  1. Ravi permalink

    One word Thank You. I was trying to do this – your site answered in 5 seconds. Thank you Thank you.

  2. jack permalink

    Is it possible that removing blur, dimming of the background using your technique ?
    I just want a transparent background window of a dialog.

  3. I haven’t tested it but I think this is how you would do it:

    WindowManager.LayoutParams lp = dialog.getWindow().getAttributes();
    lp.alpha=0.5f;
    dialog.getWindow().setAttributes(lp);
    

    By setting alpha to 0.5 it should make the window 50% transparent. Try it out let me know how it goes…

  4. Chad permalink

    Thanks! People don’t waste 3 hours like I did. You have to SHOW the dialog first or in my case with a custom dialog setContentView() first BEFORE, like so. Or it WONT work.

    SkillMenuView skillMenuView = new SkillMenuView(this);
    setContentView(skillMenuView);

    WindowManager.LayoutParams lp = getWindow().getAttributes();
    lp.dimAmount = 0.0F;
    lp.screenBrightness = 1.0F;
    getWindow().setAttributes(lp);

  5. Matt permalink

    This helped out immensely.

    I tried to override the AlertDialog theme originally and was not having very much success.

  6. It worked like a charmed!

    Thank you so much!

  7. Ken permalink

    setContentView(R.layout.main);
    mDialog = new ProgressDialog(this); mDialog.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
    mDialog.setCancelable(true);

    mDialog.getWindow().addFlags(WindowManager.LayoutParams.FLAG_BLUR_BEHIND);

    WindowManager.LayoutParams lp = mDialog.getWindow().getAttributes();
    lp.dimAmount = 0.0f;
    mDialog.getWindow().setAttributes(lp);

    Doesn’t really work… I even tried to modify the styles.xml file. Please help.

  8. sat permalink

    Valuable information , worked perfectly for the alertDialog.

  9. mcveat permalink

    Thanks. You helped very much.

  10. Thank you very very much for such precise and fully-working piece of code.

    I also searched for that for minutes and your site just answered me in 4 lines and 5 secondes :)

    Thx

  11. Bill permalink

    I cannot get this to work. Any help is greatly appreciated. It states that “The method getWindow() is undefined for the type AlertDialog.Builder”. Here’s the code I’m using:

    public static void showEula(final boolean accepted, final Activity activity) {
    AlertDialog.Builder eula = new AlertDialog.Builder(activity)
    .setTitle(R.string.eula_title)
    .setIcon(android.R.drawable.ic_dialog_info)
    .setMessage(activity.getString(R.raw.eula))
    .setCancelable(accepted);

    if (accepted) {
    // If they’ve accepted the EULA allow, show an OK to dismiss.
    eula.setPositiveButton(android.R.string.ok,
    new DialogInterface.OnClickListener() {
    public void onClick(DialogInterface dialog, int which) {
    dialog.dismiss();
    }
    });
    } else {
    // If they haven’t accepted the EULA allow, show accept/decline buttons and exit on
    // decline.
    eula
    .setPositiveButton(R.string.accept,
    new android.content.DialogInterface.OnClickListener() {
    public void onClick(DialogInterface dialog, int which) {
    setAcceptedEula(activity);
    dialog.dismiss();
    }
    })
    .setNegativeButton(R.string.decline,
    new android.content.DialogInterface.OnClickListener() {
    public void onClick(DialogInterface dialog, int which) {
    dialog.cancel();
    activity.finish();
    }
    });
    }
    eula.show();
    WindowManager.LayoutParams lp = eula.getWindow().getAttributes();
    lp.dimAmount = 0.0F;
    eula.getWindow().setAttributes(lp);
    eula.getWindow().addFlags(WindowManager.LayoutParams.FLAG_BLUR_BEHIND);

    }

  12. Praveen permalink

    @BILL
    You should create the alertdialog from the builder.
    AlertDialog a = eula.create();
    a.show();
    and then call a.getwindows().getattribues() on the alert dialog.
    Without showing the alert dialog get window will fail.

  13. SOurabh permalink

    I want to do it on pop up of POPUPWINDOW.I tried but it is not working

  14. Asela permalink

    To dim background you have to set the dim amount as well as the flag
    WindowManager.LayoutParams lp = dialog.getWindow().getAttributes();
    lp.dimAmount=0.6f;
    dialog.getWindow().setAttributes(lp);
    dialog.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);

  15. Pranay permalink

    How can we do this for a POP-UP WINDOW?

  16. Note that blur is deprecated and on Android ICS you will get black behind for dialog instead of blur.

  17. Jefta permalink

    Is it only works on dialog? i want to use it on inflated view, is there any way to make it?

  18. This wouldn’t work with DialogFragment.

  19. andré permalink

    Very good man!!

  20. To: Chad
    THANK YOU for posting your comment. I was just about to give up hope of controlling the dialog’s background.

    Pete

  21. wizardx95 permalink

    how can i add it into “hello world” first app?
    i’m newbie and
    where to add:
    dialog = new AlertDialog.Builder(WordCube.this)
    .setTitle(WordCube.this.getResources().getString(R.string.app_name))
    .setMessage(s)
    .setIcon(R.drawable.logo)
    .setPositiveButton(R.string.btn_close, null)
    .show();

    and where to add:
    WindowManager.LayoutParams lp = dialog.getWindow().getAttributes();
    lp.dimAmount=0.0f;
    dialog.getWindow().setAttributes(lp);
    dialog.getWindow().addFlags(WindowManager.LayoutParams.FLAG_BLUR_BEHIND);

    and finally main.xml code look like?
    can u help me? i’m newbie
    thank u very much!

  22. Srikanth permalink

    Thanks a lot. You saved me a lot of time. Thank you so much.

Trackbacks & Pingbacks

  1. How to make the popup window BG blur : Android Community - For Application Development

Leave a Reply

Note: I am currently writing my thesis so probably wont have time to reply to your comment
Note: XHTML is allowed. Your email address will never be published.

Subscribe to this comment feed via RSS