How to make custom dialog with rounded corners in android

Question

What I am trying to do: I am trying to make a custom dialog in android With rounded corners.

What is happening: I am able to make custom dialog but it doesn't have rounded corners. I tried adding a selector but still I couldn't achieve rounded corners.

Below is my code for the same:

Java code:

private void launchDismissDlg() {

        dialog = new Dialog(getActivity(), android.R.style.Theme_Dialog);
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
        dialog.setContentView(R.layout.dlg_dismiss);
        dialog.setCanceledOnTouchOutside(true);

        Button btnReopenId = (Button) dialog.findViewById(R.id.btnReopenId);
        Button btnCancelId = (Button) dialog.findViewById(R.id.btnCancelId);

        btnReopenId.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {



            }
        });


        btnCancelId.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {



            }
        });
        dialog.setCanceledOnTouchOutside(false);
        dialog.getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN);
        dialog.getWindow().setLayout(LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT);
        dialog.show();

    }

xml code:

<?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:background="@android:color/white"
    android:orientation="vertical" >

    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:gravity="center" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="&quot;I WOULD LIKE TO DISMISS THE VENDOR&quot;"
                android:textColor="@color/col_dlg_blue_light"
                android:textSize="14sp"
                android:textStyle="bold" />
        </TableRow>

        <TableRow
            android:id="@+id/tableRow2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:gravity="center" >

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="BECAUSE"
                android:textColor="@android:color/black"
                android:textStyle="bold" />
        </TableRow>



        <TableRow
            android:id="@+id/tableRow4"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/btnReopenId"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@color/col_dlg_green_light"
                android:text="REOPEN"
                android:padding="5dp"
                android:textSize="14sp"
                android:textColor="@android:color/white"
                android:textStyle="bold" />

            <Button
                android:id="@+id/btnCancelId"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@color/col_dlg_pink_light"
                android:text="CANCEL"
                android:padding="5dp"
                android:textSize="14sp"
                android:textColor="@android:color/white"
                android:textStyle="bold" />
        </TableRow>
    </TableLayout>

</LinearLayout>

@Apurva ... i have not used floating menu ... but i am talking about an alert dialog(custom) — Devrath, Mar 09 '15 at 07:43
I was asking about floating menu because I've seen round cornered pop up in only that. Never seen dialog with rounded corners. — Apurva, Mar 09 '15 at 07:46
[http://stackoverflow.com/questions/12501488/android-alertdialog-with-rounded-corners](http://stackoverflow.com/questions/12501488/android-alertdialog-with-rounded-corners) — M D, Mar 09 '15 at 07:46

score 400 · Accepted Answer · edited Aug 17 '18 at 05:15

400

Create a xml in drawable , say dialog_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid
        android:color="@color/white"/>
    <corners
        android:radius="30dp" />
    <padding
        android:left="10dp"
        android:top="10dp"
        android:right="10dp"
        android:bottom="10dp" />
</shape>

set it as the background in your layout xml

android:background="@drawable/dialog_bg"

Set the background of the dialog's root view to transparent, because Android puts your dialog layout within a root view that hides the corners in your custom layout.

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

edited Aug 17 '18 at 05:15

angryITguy

8,747
8
51
79

answered Mar 09 '15 at 07:47

Koma Yip

4,293
1
9
12

1

The problem with this approach is that the button's background will also be transparent. – Henrique de Sousa Dec 01 '15 at 17:25
58

`dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));` is what mising on most of the other SO threads! +1 – Randika Vishman Feb 19 '16 at 08:06
Background TRANSPARENT is not showing please help me sir,,,@koma yip – Gowthaman M Jun 22 '17 at 04:35
Yes sir,i have recylierview on top i need TRANSPARENT dialog.but it is showing white color dialog,not showing background transparent...@KomaYip – Gowthaman M Jun 22 '17 at 04:59
I used this and lower corners are rounded now. but upper corners are still not rounded. – Vivek Pratap Singh Nov 09 '17 at 07:25
@VivekPratapSingh, i think the upper part not being fully shown? – Koma Yip Nov 09 '17 at 07:30
4

`setBackgroundDrawable` seems to be deprecated... any alternatives to that? – DarkCygnus Jun 15 '18 at 18:07
3

Add `dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));` before `setContentView` – Ravi Vaniya Nov 01 '18 at 08:36
1

This works except that the part where the dialog's buttons are shown are transparent :/ – Spikatrix Jan 09 '19 at 05:00
1

instead @color/white and save the white color in colors.xml, you can use @android:color/white – maxwellnewage Nov 28 '19 at 20:03
Where do I have to place dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT)); ? setBackgroundDrawable doesn't work for me. – Daniëlle Jan 06 '21 at 21:22
@Daniëlle dialog is the instance of your Dialog object you wish to make rounded, just change it to your own variable – Koma Yip Jan 18 '21 at 02:53

SMR · Answer 2 · 2018-02-05T06:21:53.767

30

You need to do the following:

Create a background with rounded corners for the Dialog's background:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >

    <solid android:color="#fff" />

    <corners
        android:bottomLeftRadius="8dp"
        android:bottomRightRadius="8dp"
        android:topLeftRadius="8dp"
        android:topRightRadius="8dp" />

</shape>

Now in your Dialog's XML file in the root layout use that background with required margin:

android:layout_marginLeft="20dip"
android:layout_marginRight="20dip"
android:background="@drawable/dialog_background"

finally in the java part you need to do this:

dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(layoutResId);
View v = getWindow().getDecorView();
v.setBackgroundResource(android.R.color.transparent);

This works perfectly for me.

edited Feb 05 '18 at 06:21

answered Mar 09 '15 at 07:48

SMR

6,320
2
32
55

1

if you want to use same value for all corners then you should use `` , otherwise you'll get rendering issues – Mehran Aug 25 '18 at 05:51
1

@Mehran good point. Thanks for pointing that out. Can you also share the source of this info? – SMR Aug 29 '18 at 05:53
@SMR `Path.isConvex is not supported` this is the warning you usually get in your layout if you use a shape with same value for all corners. https://stackoverflow.com/q/34736981/6605907 – Mehran Aug 29 '18 at 07:48

score 23 · Answer 3 · edited Apr 26 '17 at 06:41

23

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

this works for me

edited Apr 26 '17 at 06:41

pRaNaY

21,330
22
85
134

answered Dec 15 '16 at 11:11

Gabriel Ribeiro Silva

349
2
3

Gabriele Mariotti · Answer 4 · 2020-08-07T08:09:15.723

With the Androidx library and Material Components Theme you can override the getTheme() method:

import androidx.fragment.app.DialogFragment

class RoundedDialog: DialogFragment() {

    override fun getTheme() = R.style.RoundedCornersDialog

    //....

}

with:

<style name="RoundedCornersDialog" parent="@style/Theme.MaterialComponents.Dialog">
    <item name="dialogCornerRadius">16dp</item>
</style>

Or you can use the MaterialAlertDialogBuilder included in the Material Components Library:

import androidx.fragment.app.DialogFragment
import com.google.android.material.dialog.MaterialAlertDialogBuilder

class RoundedAlertDialog : DialogFragment() {

    //...

    override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
        return MaterialAlertDialogBuilder(requireActivity(), R.style.MaterialAlertDialog_rounded)
                .setTitle("Test")
                .setMessage("Message")
                .setPositiveButton("OK", null)
                .create()
    }

}

with:

<style name="MaterialAlertDialog_rounded" parent="@style/ThemeOverlay.MaterialComponents.MaterialAlertDialog">
    <item name="shapeAppearanceOverlay">@style/DialogCorners</item>
</style>

<style name="DialogCorners">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">16dp</item>
</style>

If you don't need a DialogFragment just use the MaterialAlertDialogBuilder.

Samet ÖZTOPRAK · Answer 5 · 2017-10-03T20:18:12.777

dimen.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <integer name="weight">1</integer>

    <dimen name="dialog_top_radius">21dp</dimen>

    <dimen name="textview_dialog_head_min_height">50dp</dimen>
    <dimen name="textview_dialog_drawable_padding">5dp</dimen>

    <dimen name="button_dialog_layout_margin">3dp</dimen>


</resources>

styles.xml

<style name="TextView.Dialog">
        <item name="android:paddingLeft">@dimen/dimen_size</item>
        <item name="android:paddingRight">@dimen/dimen_size</item>
        <item name="android:gravity">center_vertical</item>
        <item name="android:textColor">@color/black</item>
    </style>

    <style name="TextView.Dialog.Head">
        <item name="android:minHeight">@dimen/textview_dialog_head_min_height</item>
        <item name="android:textColor">@color/white</item>
        <item name="android:background">@drawable/dialog_title_style</item>
        <item name="android:drawablePadding">@dimen/textview_dialog_drawable_padding</item>
    </style>

    <style name="TextView.Dialog.Text">
        <item name="android:textAppearance">@style/Font.Medium.16</item>
    </style>

    <style name="Button" parent="Base.Widget.AppCompat.Button">
        <item name="android:layout_height">@dimen/button_min_height</item>
        <item name="android:layout_width">match_parent</item>
        <item name="android:textColor">@color/white</item>
        <item name="android:gravity">center</item>
        <item name="android:textAppearance">@style/Font.Medium.20</item>
    </style>

 <style name="Button.Dialog">
        <item name="android:layout_weight">@integer/weight</item>
        <item name="android:layout_margin">@dimen/button_dialog_layout_margin</item>
    </style>

    <style name="Button.Dialog.Middle">
        <item name="android:background">@drawable/button_primary_selector</item>
    </style>

dialog_title_style.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <gradient
        android:angle="270"
        android:endColor="@color/primaryDark"
        android:startColor="@color/primaryDark" />

    <corners
        android:topLeftRadius="@dimen/dialog_top_radius"
        android:topRightRadius="@dimen/dialog_top_radius" />

</shape>

dialog_background.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/backgroundDialog" />
    <corners
        android:topLeftRadius="@dimen/dialog_top_radius"
        android:topRightRadius="@dimen/dialog_top_radius" />
    <padding />
</shape>

dialog_one_button.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="wrap_content"
    android:background="@drawable/dailog_background"
    android:orientation="vertical">

    <TextView
        android:id="@+id/dialogOneButtonTitle"
        style="@style/TextView.Dialog.Head"
        android:text="Process Completed" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        android:orientation="vertical">

        <TextView
            android:id="@+id/dialogOneButtonText"
            style="@style/TextView.Dialog.Text"
            android:text="Return the main menu" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <Button
                android:id="@+id/dialogOneButtonOkButton"
                style="@style/Button.Dialog.Middle"
                android:text="Ok" />

        </LinearLayout>

    </LinearLayout>

</LinearLayout>

OneButtonDialog.java

package com.example.sametoztoprak.concept.dialogs;

import android.app.Dialog;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.Window;
import android.widget.Button;
import android.widget.TextView;

import com.example.sametoztoprak.concept.R;
import com.example.sametoztoprak.concept.models.DialogFields;

/**
 * Created by sametoztoprak on 26/09/2017.
 */

public class OneButtonDialog extends Dialog implements View.OnClickListener {

    private static OneButtonDialog oneButtonDialog;
    private static DialogFields dialogFields;

    private Button dialogOneButtonOkButton;
    private TextView dialogOneButtonText;
    private TextView dialogOneButtonTitle;

    public OneButtonDialog(AppCompatActivity activity) {
        super(activity);
    }

    public static OneButtonDialog getInstance(AppCompatActivity activity, DialogFields dialogFields) {
        OneButtonDialog.dialogFields = dialogFields;
        return oneButtonDialog = (oneButtonDialog == null) ? new OneButtonDialog(activity) : oneButtonDialog;
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.dialog_one_button);
        getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

        dialogOneButtonTitle = (TextView) findViewById(R.id.dialogOneButtonTitle);
        dialogOneButtonText = (TextView) findViewById(R.id.dialogOneButtonText);
        dialogOneButtonOkButton = (Button) findViewById(R.id.dialogOneButtonOkButton);

        dialogOneButtonOkButton.setOnClickListener(this);
    }

    @Override
    protected void onStart() {
        super.onStart();
        dialogOneButtonTitle.setText(dialogFields.getTitle());
        dialogOneButtonText.setText(dialogFields.getText());
        dialogOneButtonOkButton.setText(dialogFields.getOneButton());
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.dialogOneButtonOkButton:

                break;
            default:
                break;
        }
        dismiss();
    }
}

score 14 · Answer 6 · answered Oct 06 '19 at 12:55

14

If you use Material Components:

CustomDialog.kt

class CustomDialog: DialogFragment() {

    override fun getTheme() = R.style.RoundedCornersDialog

}

styles.xml

<style name="RoundedCornersDialog" parent="Theme.MaterialComponents.Dialog">
    <item name="dialogCornerRadius">dimen</item>
</style>

answered Oct 06 '19 at 12:55

sheddar

230
4
14

1

It was the solution for me, thanks! In my case, I added text and background color: – fvaldivia Nov 26 '19 at 09:34

score 11 · Answer 7 · edited Jul 31 '19 at 07:09

11

I made a new way without having a background drawable is that make it have CardView as parent and give it a app:cardCornerRadius="20dp" and then add this in the java class dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

It's another way to make it .

edited Jul 31 '19 at 07:09

ppreetikaa

1,025
2
14
22

answered Apr 14 '18 at 22:05

Sattar

1,689
1
23
41

score 11 · Answer 8 · answered Mar 13 '19 at 11:11

11

Setting

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

will prevent dialog to cast a shadow.

Solution is to use

dialog.getWindow().setBackgroundDrawableResource(R.drawable.dialog_rounded_background);

where is R.drawable.dialog_rounded_background

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape android:shape="rectangle" android:padding="10dp">
            <solid
                android:color="@color/dialog_bg_color"/>
            <corners
                android:radius="30dp" />
        </shape>
    </item>

</layer-list>

answered Mar 13 '19 at 11:11

Zoran

354
3
13

2

Most elegant and simple solution that worked on API 27, Android 8.1 Oreo. – ManuelTS Nov 03 '19 at 10:40
1

This is the correct answer in 2020 if you're still stuck with Theme.AppCompat – barnacle.m Mar 23 '20 at 16:58
I don't understand why this is not the accepted answer ... – Denis Oct 26 '20 at 16:21

score 7 · Answer 9 · edited May 23 '17 at 12:18

7

You can use the shape for the background as-

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@android:color/transparent"/>
<corners android:radius="10dp" />
<padding android:left="10dp" android:right="10dp"/>
</shape>

Have a look on this for the details.

edited May 23 '17 at 12:18

Community

1
1

answered Mar 09 '15 at 07:46

Sanjeet A

4,813
3
19
37

xaif · Answer 10 · 2020-06-10T18:16:31.767

You can simply use MaterialAlertDialogBuilder to create custom dialog with rounded corners.

First create a style for the material dialog like this :

<style name="MyRounded.MaterialComponents.MaterialAlertDialog" parent="@style/ThemeOverlay.MaterialComponents.MaterialAlertDialog">
    <item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay.App.CustomDialog.Rounded
    </item>
    <item name="colorSurface">@color/YOUR_COLOR</item>
</style>

<style name="ShapeAppearanceOverlay.App.CustomDialog.Rounded" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">10dp</item>
</style>

then create a Alert Dialog object in Java class like this :

AlertDialog alertDialog =  new MaterialAlertDialogBuilder(this,R.style.MyRounded_MaterialComponents_MaterialAlertDialog)  // for fragment you can use getActivity() instead of this 
                    .setView(R.layout.custom_layout) // custom layout is here 
                    .show();

            final EditText editText = alertDialog.findViewById(R.id.custom_layout_text);   // access to text view of custom layout         
            Button btn = alertDialog.findViewById(R.id.custom_layout_btn);

            btn.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {

                    Log.d(TAG, "onClick: " + editText.getText().toString());
                }
            });

That's all you need to do.

the most correct way, do not forget to use MaterialAlertDialogBuilder instead of AlertDialog.Builder — Zakhar Rodionov, May 21 '20 at 12:55
All the other answers are outdated and ambigious, yet this is the most simplest and accurate one! Thank you — hamza khan, Jun 30 '20 at 11:39

score 6 · Answer 11 · edited Aug 01 '19 at 10:15

simplest way is to use from

CardView and its card:cardCornerRadius

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView 
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:card="http://schemas.android.com/apk/res-auto"
 android:orientation="vertical"
 android:id="@+id/cardlist_item"
 android:layout_width="match_parent"
 android:layout_height="130dp"
 card:cardCornerRadius="40dp"
 android:layout_marginLeft="8dp"
 android:layout_marginRight="8dp"
 android:layout_marginTop="5dp"
 android:layout_marginBottom="5dp"
 android:background="@color/white">

  <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="12sp"
    android:orientation="vertical"
    android:weightSum="1">
    </RelativeLayout>

</android.support.v7.widget.CardView>

And when you are creating your Dialog

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

this solution doesn't allow CardView elevation shadow to be fully displayed — laszlo, Jul 09 '19 at 09:43

score 6 · Answer 12 · answered Jul 15 '19 at 11:46

For anyone who like do things in XML, specially in case where you are using Navigation architecture component actions in order to navigate to dialogs

You can use:

<style name="DialogStyle" parent="ThemeOverlay.MaterialComponents.Dialog.Alert">

    <!-- dialog_background is drawable shape with corner radius -->
    <item name="android:background">@drawable/dialog_background</item>

    <item name="android:windowBackground">@android:color/transparent</item>
</style>

laszlo · Answer 13 · 2019-07-09T10:14:19.237

Here is the complete solution if you want to control the corner radius of the dialog and preserve elevation shadow

Dialog:

class OptionsDialog: DialogFragment() {

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup, savedInstanceState: Bundle?): View {
    dialog?.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
    return inflater.inflate(R.layout.dialog_options, container)
}

}

dialog_options.xml layout:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<androidx.cardview.widget.CardView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="40dp"
    app:cardElevation="20dp"
    app:cardCornerRadius="12dp">

    <androidx.constraintlayout.widget.ConstraintLayout
        id="@+id/actual_content_goes_here"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.cardview.widget.CardView>
</FrameLayout>

The key is to wrap the CardView with another ViewGroup (here FrameLayout) and set margins to create space for the elevation shadow.

score 4 · Answer 14 · answered Feb 03 '20 at 14:20

For API level >= 28 available attribute android:dialogCornerRadius . To support previous API versions need use

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

where dialog_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item >
        <shape >
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item
        android:left="16dp"
        android:right="16dp">
        <shape>
            <solid
                android:color="@color/white"/>
            <corners
                android:radius="8dp" />

            <padding
                android:left="16dp"
                android:right="16dp" />
        </shape>
    </item>
</layer-list>

For what is the layer list / the transparent shape? – Ixx Feb 20 '20 at 14:36 — Ixx, Feb 20 '20 at 14:36

score 3 · Answer 15 · answered Oct 31 '19 at 12:40

In Kotlin, I am using a class DoubleButtonDialog.Java with line window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT)) as important one

class DoubleButtonDialog(context: Context) : Dialog(context, R.style.DialogTheme) {

    private var cancelableDialog: Boolean = true
    private var titleDialog: String? = null
    private var messageDialog: String? = null
    private var leftButtonDialog: String = "Yes"
    //    private var rightButtonDialog: String? = null
    private var onClickListenerDialog: OnClickListener? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
        //requestWindowFeature(android.view.Window.FEATURE_NO_TITLE)
        setCancelable(cancelableDialog)
        setContentView(R.layout.dialog_double_button)
//        val btnNegative = findViewById<Button>(R.id.btnNegative)
//        btnNegative.visibility = View.GONE
//        if (rightButtonDialog != null) {
//            btnNegative.visibility = View.VISIBLE
//            btnNegative.text = rightButtonDialog
//            btnNegative.setOnClickListener {
//                dismiss()
//                onClickListenerDialog?.onClickCancel()
//            }
//        }
        val btnPositive = findViewById<Button>(R.id.btnPositive)
        btnPositive.text = leftButtonDialog
        btnPositive.setOnClickListener {
            onClickListenerDialog?.onClick()
            dismiss()
        }
        (findViewById<TextView>(R.id.title)).text = titleDialog
        (findViewById<TextView>(R.id.message)).text = messageDialog
        super.onCreate(savedInstanceState)
    }

    constructor(
        context: Context, cancelableDialog: Boolean, titleDialog: String?,
        messageDialog: String, leftButtonDialog: String, /*rightButtonDialog: String?,*/
        onClickListenerDialog: OnClickListener
    ) : this(context) {
        this.cancelableDialog = cancelableDialog
        this.titleDialog = titleDialog
        this.messageDialog = messageDialog
        this.leftButtonDialog = leftButtonDialog
//        this.rightButtonDialog = rightButtonDialog
        this.onClickListenerDialog = onClickListenerDialog
    }
}


interface OnClickListener {
    //    fun onClickCancel()
    fun onClick()
}

In layout, we can create a dialog_double_button.xml

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="@dimen/dimen_10"
        android:background="@drawable/bg_double_button"
        android:orientation="vertical"
        android:padding="@dimen/dimen_5">

        <TextView
            android:id="@+id/title"
            style="@style/TextViewStyle"
            android:layout_gravity="center_horizontal"
            android:layout_margin="@dimen/dimen_10"
            android:fontFamily="@font/campton_semi_bold"
            android:textColor="@color/red_dark4"
            android:textSize="@dimen/text_size_24"
            tools:text="@string/dial" />

        <TextView
            android:id="@+id/message"
            style="@style/TextViewStyle"
            android:layout_gravity="center_horizontal"
            android:layout_margin="@dimen/dimen_10"
            android:gravity="center"
            android:textColor="@color/semi_gray_2"
            tools:text="@string/diling_police_number" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/dimen_10"
            android:gravity="center"
        android:orientation="horizontal"
        android:padding="@dimen/dimen_5">

        <!--<Button
            android:id="@+id/btnNegative"
            style="@style/ButtonStyle"
            android:layout_width="0dp"
            android:layout_height="@dimen/dimen_40"
            android:layout_marginEnd="@dimen/dimen_10"
            android:layout_weight=".4"
            android:text="@string/cancel" />-->

        <Button
            android:id="@+id/btnPositive"
            style="@style/ButtonStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:backgroundTint="@color/red_dark4"
            android:fontFamily="@font/campton_semi_bold"
            android:padding="@dimen/dimen_10"
            android:text="@string/proceed"
            android:textAllCaps="false"
            android:textColor="@color/white"
            android:textSize="@dimen/text_size_20" />
    </LinearLayout>
</LinearLayout>

then use drawable.xml as

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid
        android:color="@color/white"/>
    <corners
        android:radius="@dimen/dimen_10" />
    <padding
        android:left="@dimen/dimen_10"
        android:top="@dimen/dimen_10"
        android:right="@dimen/dimen_10"
        android:bottom="@dimen/dimen_10" />
</shape>

score 1 · Answer 16 · answered Dec 16 '20 at 21:52

Create a xml in drawable ,say customd.xml.

then set it at background in your custom Dialog layout xml:

android:background="@drawable/customd"

finally in the java part for custom Dialog class you need to do this:

public class Customdialoque extends DialogFragment {

public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

    getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

    View view = inflater.inflate(R.layout.activity_customdialoque, container, false);

    return view;
}

score 0 · Answer 17 · answered Aug 27 '20 at 12:03

I implemented rounded dialog using CardView in the custom layout and setting its corner radius.

Here's my xml code.

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/bottomSheet"
android:layout_width="match_parent"
android:layout_margin="@dimen/padding_5dp"
app:cardCornerRadius="@dimen/dimen_20dp"
android:layout_height="wrap_content">

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/main_gradient_bg"
    android:paddingBottom="32dp">

    <TextView
        android:id="@+id/subdomain_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="@dimen/margin_32dp"
        android:layout_marginLeft="@dimen/margin_32dp"
        android:layout_marginTop="@dimen/margin_50dp"
        android:fontFamily="@font/nunito_sans"
        android:text="@string/enter_subdomain"
        android:textColor="@color/white"
        android:textSize="@dimen/size_18sp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent" />


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/dimen_45dp"
        app:layout_constraintLeft_toRightOf="@id/subdomain_label"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_baseline_info_24" />

    <EditText
        android:id="@+id/subdomain_edit_text_bottom_sheet"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="@dimen/dimen_20dp"
        android:layout_marginLeft="@dimen/dimen_20dp"
        android:layout_marginEnd="@dimen/dimen_20dp"
        android:layout_marginRight="@dimen/dimen_20dp"
        android:textColor="@color/white"
        android:theme="@style/EditTextTheme"
        app:layout_constraintTop_toBottomOf="@id/subdomain_label" />

    <Button
        android:id="@+id/proceed_btn"
        android:layout_width="@dimen/dimen_150dp"
        android:layout_height="@dimen/margin_50dp"
        android:layout_marginTop="@dimen/margin_30dp"
        android:background="@drawable/primary_btn_bg"
        android:text="@string/proceed"
        android:textAllCaps="false"
        android:textColor="@color/white"
        android:textSize="@dimen/size_18sp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/subdomain_edit_text_bottom_sheet" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>

After that, i called it in Kotlin as follows :-

    val builder = AlertDialog.Builder(mContext)
    val viewGroup: ViewGroup = findViewById(android.R.id.content)
    val dialogView: View = 
    LayoutInflater.from(mContext).inflate(R.layout.subdomain_bottom_sheet, 
    viewGroup, false)
    val alertDialog: AlertDialog = builder.create()
    alertDialog.setView(dialogView,0,0,0,0)
    alertDialog.show()
    val windowParam = WindowManager.LayoutParams()
    windowParam.copyFrom(alertDialog.window!!.attributes)
    windowParam.width = AppConstant.getDisplayMetricsWidth(mContext) - 100
    windowParam.height = WindowManager.LayoutParams.WRAP_CONTENT
    windowParam.gravity = Gravity.CENTER
    alertDialog.window!!.attributes = windowParam
    
   
    alertDialog.window!!.setBackgroundDrawable
    (ColorDrawable(Color.TRANSPARENT))

Where last line is very important. Missing that would cause a color(mostly white) to show behind the corners.

Ucdemir · Answer 18 · 2021-03-24T12:17:16.827

Here is a Basic Solution:

 <style name="Style_Dialog_Rounded_Corner" parent="Theme.AppCompat.Light.Dialog.Alert">
        <item name="android:windowBackground">@drawable/dialog_rounded_corner</item>
        <item name="android:windowMinWidthMinor">85%</item>
    </style>

in Drawable create shape:

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

Pass style in Builder Constructor

AlertDialog alert = new AlertDialog.Builder(MainActivity.this,R.style.Style_Dialog_Rounded_Corner).create();

How to make custom dialog with rounded corners in android

18 Answers18

Linked

Related