Custom Dialog In Android

Introduction

A Dialog in Android is a small box that asks the user to choose, provide extra data, and receive instructions for a specific job. By default, Android shows its default dialog box, but sometimes it requires a custom layout dialog box.

So, here we learn about how to create a custom dialog box in Android.

Create a custom dialog box in Android

Step 1

Create a new project in the Android Studio and select an empty activity.

Custom Dialog In Android

Step 2

Give the project a name, select the save location folder, and click on the finish button.

Custom Dialog In Android

Step 3

Create the activity_main.xml file as shown below.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/lblHeader"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Custom Dialog Box Demo"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:textSize="25dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:textColor="#0000aa"/>

    <Button
        android:id="@+id/btnDialog"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Show Custom Dialog"
        android:layout_marginTop="20dp"
        android:textSize="15dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/lblHeader" />

</androidx.constraintlayout.widget.ConstraintLayout>

Step 4

Create the custom dialog box file with the name custom_dialog_resource.xml, as shown below.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    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">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        tools:ignore="MissingConstraints">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="70dp"
            android:orientation="vertical"
            android:background="#00AA00">

            <ImageView
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_marginTop="10dp"
                android:src="@drawable/ic_outline_check_circle_24"
                android:layout_gravity="center"/>
        </LinearLayout>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:text="Success"
            android:textSize="35dp"
            android:textColor="#990000"
            android:layout_gravity="center"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:text="Congratulation!\nYou have successfully generated custom dialog box"
            android:textSize="25dp"
            android:textColor="#000022"
            android:textAlignment="center"
            android:layout_gravity="center"/>

            <Button
                android:id="@+id/btnSubmit"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Submit"
                android:textSize="15dp"
                android:layout_marginTop="20dp"
                android:layout_marginRight="10dp"
                android:layout_marginLeft="10dp"
                android:layout_gravity="center"
                android:layout_marginBottom="20dp"/>
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Step 5

Declare button objects and dialog objects in the MainActivity.java class.

Button btnDialog;
Dialog  customDialog;

Step 6

Initialize a custom dialog, set its property, and add listeners to its component.

//Initialize Custom Dialog Box
customDialog = new Dialog(MainActivity.this);
customDialog.setContentView(R.layout.custom_dialog_resource);
        customDialog.getWindow().setLayout(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT);

Button btnSubmit = customDialog.findViewById(R.id.btnSubmit);
btnSubmit.setOnClickListener(new View.OnClickListener() {
     @Override
     public void onClick(View view) {
         Toast.makeText(MainActivity.this,"You Click On Submit Button",Toast.LENGTH_SHORT).show();
         customDialog.dismiss();
     }
});

Step 7

Add listeners to the "Show custom dialog box" button and add code for showing a custom dialog box.

//Initialize Custom Dialog Box Button and Write Code To Open Dialog Box
btnDialog = findViewById(R.id.btnDialog);
btnDialog.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
         customDialog.show();
    }
});

Final MainActivity.Java File

package com.uday.customdialogbox;

import androidx.appcompat.app.AppCompatActivity;

import android.app.Dialog;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    Button btnDialog;
    Dialog  customDialog;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        //Initialize Custom Dialog Box
        customDialog = new Dialog(MainActivity.this);
        customDialog.setContentView(R.layout.custom_dialog_resource);
        customDialog.getWindow().setLayout(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT);

        Button btnSubmit = customDialog.findViewById(R.id.btnSubmit);
        btnSubmit.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this,"You Click On Submit Button",Toast.LENGTH_SHORT).show();
                customDialog.dismiss();
            }
        });


        //Initialize Custom Dialog Box Button and Write Code To Open Dialog Box
        btnDialog = findViewById(R.id.btnDialog);
        btnDialog.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                customDialog.show();
            }
        });
    }
}

Step 8

Now run your app.

Custom Dialog In Android

Step 9

Click on the "Show Custom Dialog Box Button" and you see the following output.

Custom Dialog In Android

Step 10

Now, click the submit button to dismiss the custom dialogue box and see the toast message as shown below.

Custom Dialog In Android

Summary

So you see, it's very easy to create a Custom Dialog Box in Android with little coding.

In this article, we will learn how to create a Custom Dialog Box on Android.

Thank you. Enjoy Coding.