How can I design a custom alert dialog with rounded corners and a transparent dismiss button?
-
I need only rounded corner and transparent dismiss button,not the whole view.– Braj Bhushan SinghJan 18, 2017 at 12:49
-
asking question need to show minimum effort– RaselJan 18, 2017 at 12:49
-
@Rasel Can you help me out with this?– Braj Bhushan SinghJan 18, 2017 at 12:51
-
First Google it..you can find. Don't post your question directly. stackoverflow.com/questions/28937106/…– Vishal JadavJan 18, 2017 at 12:52
-
Possible duplicate of How to implement a custom AlertDialog View– Braj Bhushan SinghJan 22, 2017 at 8:20
5 Answers
Create your dialog like this:
AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(
context, R.style.CustomAlertDialog);
AlertDialog alertDialog = alertDialogBuilder.create();
In your styles.xml file:
<style name="CustomAlertDialog" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="android:windowBackground">@drawable/popup_background</item>
</style>
In file 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 the corner radius.
-
if I want to use gradient, how will I accomplish it sir? May 18, 2020 at 13:54
-
1stackoverflow.com/questions/13929877/… The answer to this question should help you, change the popup_background into a gradient shape.– BelzebubMay 19, 2020 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. Jun 9, 2020 at 11:09
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>
-
2Works! The best alternative I could find. Setting another drawable modifies the size of the dialog box, so it is not an option Dec 18, 2019 at 7:56
-
1What a great answer, this suppose to be the correct answer, I agree with @NicolásVera Aug 30, 2022 at 8:26
You can create your customview by extending the alert dialog class.
But I would recommend a PopupWindow or a subview that you show with an animation when a specific action performed.
Or you can make an activity with a transparent background by adding this attribute to your Manifest.xml file:
android:theme="@android:style/Theme.Translucent"
Try this. It worked for me like a charm.
I am working on sdkversion 28 with a minimum SDK version 19.
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
-
OP asked for rounded corners and transparent background. Do you have any suggestion for the corners? Jan 25, 2019 at 18:49
Try it...
final Dialog dialog = new Dialog(context);
// Include the dialog.xml file
dialog.setContentView(R.layout.your_custom_layout);
// Set the 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 the 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 the decline button is clicked, close the custom dialog
cancelnbtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// Close dialog
dialog.dismiss();
}
});