Android Custom Dialog, no matter the width specified it stays the same

Question

I have a custom Dialog, which I inflate and use. Now I wanted to have rounded corners which proves to be rather difficult. And it seems that one of those hacks made it so my Dialog doesn't change size no matter if the width is WrapContent, 10dp, 20dp, 200dp or 300dp. It changes in the layout editor but when I actually launch the app it stays the same.

Editor

InApp

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:background="@drawable/dialog_background"
    android:gravity="center"
    android:orientation="vertical"
    android:padding="10dp">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="15dp"
        android:text="Do you want to reset progress?"
        android:textColor="@color/black"
        android:textSize="18sp" />

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

        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/cancel_button"
            style="@style/basicButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="10dp"
            android:backgroundTint="@color/delete_red"
            android:padding="10dp"
            android:text="Cancel"
            android:textColor="@color/white"
            android:textSize="20sp" />

        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/confirm_button"
            style="@style/basicButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="10dp"
            android:text="Yes"
            android:textSize="20sp" />
    <nearLayout>
</LinearLayout>nearLayout>
</LinearLayout>

And this is where I build it (note the links in the comments, I think that's what causes the problems, setting the background of the window).

    val builder = AlertDialog.Builder(requireContext())
    val dialogBinding = ResetProgressDialogBinding.inflate(layoutInflater)
    builder.setView(dialogBinding.root)
    val dialog = builder.create()

    dialog.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT)); // https://stackoverflow.com/questions/28937106/how-to-make-custom-dialog-with-rounded-corners-in-android
    dialogBinding.root.clipToOutline = true // https://issuetracker.google.com/issues/37036728

And my shape

<?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="10dp" />
    <padding
        android:left="0dp"
        android:top="0dp"
        android:right="0dp"
        android:bottom="0dp" />
</shape>

Yasin Ege · Answer 1 · 2021-03-25T17:56:22.567

I'm using PopupHelper class you can use this code:

public class PopUpHelper {

    static Dialog dialog;

    public static void showDialog(Activity activity, PINConfirmButtonClickListener action) {
        if (dialog != null && dialog.isShowing()) {
            boolean isShowing = dialog.isShowing();
            return;
        }
        dialog = new Dialog(activity, R.style.MyAlertDialogStyle);
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
        dialog.setContentView(R.layout.(your_dialog_layout);
        dialog.setCanceledOnTouchOutside(true);
        dialog.setCancelable(true);
        dialog.show();
          dialog.findViewById(R.id.cancel_button).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
         action.onPositiveClicked()
              "YOUR_ACTION_HERE"
            }
        });
        dialog.findViewById(R.id.cancel_button).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
 action.onNegative()
              "YOUR_ACTION_HERE"
            }
        });
        dialog.findViewById(R.id.close_dialog_rl).setOnClickListener(view -> action.onCloseButtonClicked(dialog));
        dialog.findViewById(R.id.resend_code_tv).setOnClickListener(view -> action.onResendCodeClicked());
    }
       public interface TwoButtonClickListener {
        void onPositiveClicked(Dialog dialog);

        void onNegativeClicked(Dialog dialog);
    }

}

MyDialogStyle: (Add to styles.xml)

<!-- Alert Dialog Style-->
    <style name="MyAlertDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
        <item name="android:windowNoTitle">true</item>
        <item name="android:windowBackground">@android:color/transparent</item>
        <!-- Used for the border radius -->
        <item name="android:bottomLeftRadius">5dp</item>
        <item name="android:bottomRightRadius">5dp</item>
        <item name="android:topRightRadius">5dp</item>
        <item name="android:topLeftRadius">5dp</item>
        <item name="android:autofilledHighlight" tools:targetApi="o">@color/transparent</item>
    </style>

and in activity calling Popup :

PopUpHelper.showDialog(this, new PopUpHelper.TwoButtonClickListener() {
            @Override
            public void onPositiveClicked(Dialog dialog) {
                dialog.dismiss();
            
                startHomeActivity();
            }

            @Override
            public void onNegativeClicked(Dialog dialog) {
                dialog.dismiss();
            }

         
        });

if background transparent not working set "android:background="@android:color/transparent" to dialog layout

Example my layout but you can delete fonts and some fields:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:app="http://schemas.android.com/apk/res-auto"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:layout_gravity="center"
              android:background="@android:color/transparent"
              android:gravity="center"
              android:orientation="vertical">

    <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center">

        <RelativeLayout
                android:id="@+id/relativeLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginHorizontal="12dp">

            <androidx.cardview.widget.CardView
                    android:id="@+id/card_view"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="32.5dp">

                <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="vertical"
                        android:paddingHorizontal="25dp"
                        android:paddingVertical="20dp">

                    <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_marginTop="70dp"
                            android:orientation="vertical"
                            android:paddingTop="15dp">

                        <TextView
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:fontFamily="@font/bold"
                                android:gravity="center"
                                android:lineSpacingExtra="4dp"
                                android:text="@string/add_to_cart"
                                android:textColor="@color/color_secondary"
                                android:textSize="18sp"/>

                        <TextView
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginTop="15dp"
                                android:fontFamily="@font/medium"
                                android:lineSpacingExtra="4dp"
                                android:gravity="center"
                                android:text="@string/product_added_to_cart"
                                android:textColor="@color/color_secondary_60"
                                android:textSize="14sp"/>

                    </LinearLayout>

                    <LinearLayout
                            android:layout_marginTop="40dp"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:orientation="vertical">

                        <TextView
                                android:id="@+id/action_button"
                                android:layout_width="match_parent"
                                android:layout_height="45dp"
                                android:background="@color/orange_light"
                                android:ellipsize="end"
                                android:fontFamily="@font/medium"
                                android:foreground="?selectableItemBackground"
                                android:gravity="center"
                                android:letterSpacing="0.05"
                                android:singleLine="true"
                                android:text="@string/add_to_cart"
                                android:textColor="@color/white"
                                android:textSize="16sp"/>
                        <TextView
                                android:layout_marginTop="10dp"
                                android:layout_gravity="center_horizontal"
                                android:id="@+id/cancel_button"
                                android:layout_width="wrap_content"
                                android:layout_height="45dp"
                                android:ellipsize="end"
                                android:fontFamily="@font/medium"
                                android:foreground="?selectableItemBackground"
                                android:gravity="center"
                                android:letterSpacing="0.05"
                                android:singleLine="true"
                                android:text="@string/cancel"
                                android:textColor="@color/color_secondary_60"
                                android:textSize="13sp"/>
                    </LinearLayout>


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

            <RelativeLayout
                    android:id="@+id/close_dialog_rl"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@id/card_view"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="22dp"
                    android:background="@drawable/shape_circle_white">

                <ImageView
                        android:layout_width="20dp"
                        android:layout_height="20dp"
                        android:layout_centerInParent="true"
                        android:src="@drawable/ic_close"
                        app:tint="@color/white"/>
            </RelativeLayout>
        </RelativeLayout>

   

        <ImageView
                android:id="@+id/confetti_v"
                android:layout_width="65dp"
                android:layout_height="65dp"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:background="@drawable/shape_circle_orange"
                android:padding="16dp"
                android:src="@drawable/ic_check_white"
                app:tint="@color/white"/>


    </RelativeLayout>
</LinearLayout>

Can you edit in your XML as well? My background is fully transparent. — Nikola-Milovic, Mar 25 '21 at 14:01
Thank you. I'll have to check it out further, I still get the same result, with the transparent background. — Nikola-Milovic, Mar 26 '21 at 15:16

Android Custom Dialog, no matter the width specified it stays the same

1 Answers1