Create Custom Dialog in Android

Create Project

Create new project in Android Studio with steps as below:

Step 1: Input Project Name and Select Project Location

Step 2: Select SDK for Android App

Step 3: Select Default Activity for App

Step 4: Finish create project

Add Strings

Open res\values\strings.xml file and add new string as below:

<resources>
    <string name="app_name">Learn Android with Real Apps</string>
    <string name="show_custom_dialog">Show Custom Dialog</string>
    <string name="login">Login</string>
    <string name="cancel">Cancel</string>
    <string name="username">Username</string>
    <string name="password">Password</string>
    <string name="valid">Valid</string>
    <string name="invalid">InValid</string>
</resources>

Create Custom Dialog Layout

Create new XML Layout File named login_dialog_layout.xml in res\layout folder as below:

<?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:orientation="vertical">

    <EditText
        android:id="@+id/editTextUsername"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:hint="@string/username"
        android:inputType="textPersonName" />

    <EditText
        android:id="@+id/editTextPassword"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="10"
        android:hint="@string/password"
        android:inputType="textPassword" />

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

        <Button
            android:id="@+id/buttonLogin"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/login" />

        <Button
            android:id="@+id/buttonCancel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@android:string/cancel" />
    </LinearLayout>

</LinearLayout>

Main Activity Layout

Open res\layout\activity_main.xml file and create layout as below:

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/buttonShowCustomDialog"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/show_custom_dialog" />

</LinearLayout>

Main Activity Class

Add code to MainActivity.java in android.demo.learnandroidwithrealapps package as below:

package android.demo.learnandroidwithrealapps;

import android.os.Bundle;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    private Button buttonShowCustomDialog;

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

    private void initView() {
        buttonShowCustomDialog = findViewById(R.id.buttonShowCustomDialog);
        buttonShowCustomDialog.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                buttonShowCustomDialog_onClick(view);
            }
        });
    }

    private void buttonShowCustomDialog_onClick(View view) {
        AlertDialog.Builder builder = new AlertDialog.Builder(view.getContext());
        builder.setCancelable(false);
        builder.setTitle(R.string.login);
        final View dialogView = LayoutInflater.from(view.getContext()).inflate(R.layout.login_dialog_layout, null);
        builder.setView(dialogView);
        final AlertDialog alertDialog = builder.show();
        final EditText editTextUsername = dialogView.findViewById(R.id.editTextUsername);
        final EditText editTextPassword = dialogView.findViewById(R.id.editTextPassword);
        Button buttonLogin = dialogView.findViewById(R.id.buttonLogin);
        buttonLogin.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                String username = editTextUsername.getText().toString().trim();
                String password = editTextPassword.getText().toString().trim();
                if (username.equalsIgnoreCase("pmk") && password.equalsIgnoreCase("lab")) {
                    Toast.makeText(getApplicationContext(), R.string.valid, Toast.LENGTH_SHORT).show();
                } else {
                    Toast.makeText(getApplicationContext(), R.string.invalid, Toast.LENGTH_SHORT).show();
                }
                alertDialog.dismiss();
            }
        });
        Button buttonCancel = dialogView.findViewById(R.id.buttonCancel);
        buttonCancel.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                alertDialog.dismiss();
            }
        });

    }

}

Structure of Project

Run App

Load Main Activity

Show Custom Dialog When Click Button

Test with Invalid Account

Test with Valid Account