Pop-up window series: Dialog custom layout UI example

• I still remember that as an Android development intern a few years ago, the first function I developed was the check-in pop-up window. At present, DialogFragment is used in pop-up windows, but there is always a question in my mind, why can't I directly rewrite Dialog? I practiced it myself and found that it is not troublesome to use Dialog.
• Looking at the design draft and the effect of the Demo, the Demo only realized part of the time.

• The main pit:

  • Dialog comes with a title bar, which needs to be removed.

  • Dialog comes with a pop-up window with rounded corners, and a custom rounded background floats on top of the built-in background. Also need to be cleared.

Main code:

• MainActivity

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        BaseDialog dialog = new BaseDialog(MainActivity.this,R.layout.my_dialog);
        dialog.show();
    }
}

• BaseDialog

public class BaseDialog extends Dialog {
    View view;
    public BaseDialog(Context context, int layoutId) {
        super(context);
        view = View.inflate(context, layoutId, null);
    }



    @Override
    protected void onCreate(Bundle savedInstanceState) {
        getWindow().requestFeature(Window.FEATURE_NO_TITLE);//去除标题
        super.onCreate(savedInstanceState);
        if (view != null) {
            setContentView(view);
        }
    }

    @Override
    protected void onStart() {
        super.onStart();
        getWindow().setBackgroundDrawableResource(android.R.color.transparent); //去除自带的背景
    }
}

Pop-up window layout file: my_dialog.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:background="#000000">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        >

        <RelativeLayout
            android:id="@+id/rl"
            android:layout_width="313dp"
            android:layout_height="213dp"
            android:layout_centerHorizontal="true"
            android:background="@drawable/dialog_bg">

        </RelativeLayout>

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/rl"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="41dp"
            android:src="@drawable/close" />
    </RelativeLayout>


</RelativeLayout>

Rounded corner background file: dialog_bg.xml in the drawable folder:

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

Thanks to the following bloggers: The
common way to cut rounded corners in Android
solves the problem of rounded corner dialog black (white) background