Custom alert dialog with rounded corner and transparent background

Question

How to design custom alert dialog with rounded corner and transparent dismiss button?

I need only rounded corner and transparent dismiss button,not the whole view. — Braj Bhushan Singh, Jan 18 '17 at 12:49
First Google it..you can find. Don't post your question directly. http://stackoverflow.com/questions/28937106/how-to-make-custom-dialog-with-rounded-corners-in-android — Vishal Jadav, Jan 18 '17 at 12:52
Possible duplicate of [How to implement a custom AlertDialog View](http://stackoverflow.com/questions/2795300/how-to-implement-a-custom-alertdialog-view) — Braj Bhushan Singh, Jan 22 '17 at 08:20

score 30 · Answer 1 · edited Oct 02 '20 at 11:08

30

Create your dialog like this

AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(
                                            context, R.style.CustomAlertDialog);
AlertDialog alertDialog = alertDialogBuilder.create();

In your styles.xml

<style name="CustomAlertDialog" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:windowBackground">@drawable/popup_background</item>
</style>

popup_background.xml write whatever corner radius you want

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FFFFFF" />
    <corners android:radius="6dp" />
</shape>

You can change corner radius. Good luck!

edited Oct 02 '20 at 11:08

Gary Chen

238
2
14

answered Jan 18 '17 at 12:55

Belzebub

864
9
18

if I want to use gradient, how will I accomplish it sir? – Lidor Eliyahu Shelef May 18 '20 at 13:54
1

https://stackoverflow.com/questions/13929877/how-to-make-gradient-background-in-android The answer to this question should help you, change the popup_background into a gradient shape. – Belzebub May 19 '20 at 18:14
This one pretty good solution but one issue I face dialog width changed as compare to original alert dialog. you have any solution for same. – Kishan Donga Jun 09 '20 at 11:09

Gabriele Mariotti · Answer 2 · 2019-12-18T08:02:43.743

You can use the Material components for android library and the androidx.appcompat.app.AlertDialog.

Just use something like:

new MaterialAlertDialogBuilder(context)
            .setTitle("Dialog")
            .setMessage("Lorem ipsum dolor ....")
            .setPositiveButton("Ok", /* listener = */ null)
            .setNegativeButton("Cancel", /* listener = */ null)
            .show();

Using a Material Components Theme you can customize the shape of your component with the shapeAppearanceOverlay attribute in your style.

Something like:

  <!-- Alert Dialog -->
  <style name="MyThemeOverlayAlertDialog" parent="@style/ThemeOverlay.MaterialComponents.MaterialAlertDialog">
    <item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay.MyApp.Dialog.Rounded</item>
  </style>

Here you can define the rounded corners:

  <style name="ShapeAppearanceOverlay.MyApp.Dialog.Rounded" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">8dp</item>
  </style>

Works! The best alternative I could find. Setting another drawable modifies the size of the dialog box, so it is not an option — Nicolás Vera, Dec 18 '19 at 07:56

score 0 · Answer 3 · answered Jan 18 '17 at 12:53

You Can create your customview by extending the alert dialog class.

but i would recommend a PopupWindow or a subview that you show with animation when a specific action performed.

https://developer.android.com/reference/android/widget/PopupWindow.html

or you can make an activity with transparent background by adding this attribute to you Manifest.xml

  android:theme="@android:style/Theme.Translucent"

score 0 · Answer 4 · answered Jan 25 '19 at 18:28

0

Try this,it worked for me like a charm
I am working on sdkversion 28 with minimum sdk version 19

        dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));

answered Jan 25 '19 at 18:28

Aashis Shrestha

192
2
12

OP asked for rounded corners *and* transparent background. Do you have any suggestion for the corners? – Bö macht Blau Jan 25 '19 at 18:49

score -2 · Answer 5 · answered Jan 18 '17 at 12:51

try it...

 final Dialog dialog = new Dialog(context);
            // Include dialog.xml file
            dialog.setContentView(R.layout.your_custom_layout);
            // Set dialog title
            //dialog.setTitle("Custom Dialog");


            // set values for custom dialog components - text, image and button
            final EditText name = (EditText) dialog.findViewById(R.id.name_edit);


            dialog.show();

           /
            Button editButton = (Button) dialog.findViewById(R.id.editbtn);
            // if decline button is clicked, close the custom dialog
            editButton.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    // Close dialog

                    dialog.dismiss();

                }
            });

            final Button cancenbtn = (Button) dialog.findViewById(R.id.cancelbtn);
            // if decline button is clicked, close the custom dialog
            cancelnbtn.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    // Close dialog


                    dialog.dismiss();
                }
            });

Custom alert dialog with rounded corner and transparent background

5 Answers5

Linked