How to show fancy pop up window. Fast and easy

Here is probably the quickest way to show pop up dialog. I created my own window, but you can easily adjust it to your needs.

First, add these libraries to your app build gradle:

build.gradle(Module:app)
implementation 'com.android.support:cardview-v7:26.1.0'
implementation 'com.rengwuxian.materialedittext:library:2.1.4'

Next, create a xml file for pop up window and define its layout:

dialog_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    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_margin="8dp"
    android:elevation="4dp">

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

        <com.rengwuxian.materialedittext.MaterialEditText
            android:id="@+id/edtNewUserName"
            android:hint="Username"
            android:textColorHint="@color/colorPrimary"
            android:textColor="@color/colorPrimaryDark"
            android:textSize="24sp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:met_baseColor="@color/colorPrimary"
            app:met_floatingLabel="highlight"
            app:met_primaryColor="@color/colorPrimary"
            app:met_singleLineEllipsis="true"/>

        <com.rengwuxian.materialedittext.MaterialEditText
            android:id="@+id/edtNewPassword"
            android:hint="Password"
            android:textColorHint="@color/colorPrimary"
            android:textColor="@color/colorPrimaryDark"
            android:textSize="24sp"
            android:inputType="textPassword"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:met_baseColor="@color/colorPrimary"
            app:met_floatingLabel="highlight"
            app:met_primaryColor="@color/colorPrimary"
            app:met_singleLineEllipsis="true"/>


        <com.rengwuxian.materialedittext.MaterialEditText
            android:id="@+id/edtNewEmail"
            android:hint="Email"
            android:textColorHint="@color/colorPrimary"
            android:textColor="@color/colorPrimaryDark"
            android:textSize="24sp"
            android:inputType="textEmailAddress"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:met_baseColor="@color/colorPrimary"
            app:met_floatingLabel="highlight"
            app:met_primaryColor="@color/colorPrimary"
            app:met_singleLineEllipsis="true"/>

    </LinearLayout>

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

Next, create a button  for showing the dialog in activity’s layout:

activity_main.xml
<android.support.constraint.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="pdf.tutorials.virtuoza.virtuozatutorials.MainActivity">

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

        <Button
            android:id="@+id/btn_send"
            android:text="SHOW DIALOG"
            android:layout_marginTop="50dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

    </LinearLayout>

</android.support.constraint.ConstraintLayout>

Last, but not least, program the button’s on click listener to show the dialog after it is clicked:

MainActivity.java
package pdf.tutorials.virtuoza.virtuozatutorials;

import android.content.DialogInterface;

import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

import com.rengwuxian.materialedittext.MaterialEditText;

public class MainActivity extends AppCompatActivity {

    Button button;

    MaterialEditText edtNewUser, edtNewPassword, edtNewEmail;

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

        button= (Button)findViewById(R.id.btn_send);

        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showSignUpDialog();
            }
        });

    }

    private void showSignUpDialog() {
        AlertDialog.Builder alertDialog= new AlertDialog.Builder(MainActivity.this);
        alertDialog.setTitle("Sign up");
        alertDialog.setMessage("Please fill in full information");

        LayoutInflater inflater = this.getLayoutInflater();
        View view = inflater.inflate(R.layout.sign_up_layout,null);

        edtNewUser= (MaterialEditText)view.findViewById(R.id.edtNewUserName);
        edtNewPassword= (MaterialEditText)view.findViewById(R.id.edtNewPassword);
        edtNewEmail= (MaterialEditText)view.findViewById(R.id.edtNewEmail);

        alertDialog.setView(view);
        alertDialog.setIcon(R.drawable.ic_acc);

        alertDialog.setNegativeButton("CANCEL", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialogInterface, int i) {
                dialogInterface.dismiss();
                Toast.makeText(MainActivity.this,"Cancel",Toast.LENGTH_SHORT).show();
            }
        });

        alertDialog.setPositiveButton("CONTINUE", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(final DialogInterface dialogInterface, int i) {
                Toast.makeText(MainActivity.this,"Continue",Toast.LENGTH_SHORT).show();
            }
        });
        alertDialog.show();
    }
}

And that’s it. This is very easy way to show pop up dialog which you can modify accordingly to your necessities.

Share with your friends