How to create a custom AlertDialog in Android Studio?

Please Share On:

You are reading my article, which means you are an android developer and want to create your own custom AlertDialog box.

You might be thinking that this is difficult coding. Don’t worry. I am here to help you. You just follow my procedure, you will end up designing a very beautiful custom AlertDialog box as below.

Step 1:

First, you need to design an XML file. Let design an XML file agreement_dialog.xml. It has

  1. Textview (for title) – Agreement
  2. Textview inside Scrollview. If your message is longer than your device height, you can scroll down to see all texts.
  3. 2 buttons: one for “Accept” and one for “Reject”

Now see an XML source code to design.

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

    <TextView
        android:id="@+id/dialog_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:gravity="center_horizontal"
        android:textSize="30sp"
        android:textStyle="bold"
        android:textColor="@color/white"
        android:background="@color/black"
        android:text="@string/dialog_title"/>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/dialog_title">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/relativeLayout"
            android:background="@color/background"
            android:padding="10dp">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/agreementlayout"
                android:layout_gravity="center"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/agreement1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/agreement"
                    android:textColor="@color/black"
                    android:textSize="25sp"/>

            </LinearLayout>


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/buttonlayout"
                android:layout_marginTop="10dp"
                android:layout_gravity="center"
                android:orientation="horizontal"
                android:layout_below="@+id/agreementlayout">

                <Button
                    style="?android:attr/actionButtonStyle"
                    android:id="@+id/button_accept"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_weight="0.50"
                    android:textColor="@color/white"
                    android:textSize="30sp"
                    android:background="@color/green"
                    android:text="@string/accept"
                    android:textStyle="bold|italic"/>

                <Button
                    style="?android:attr/actionButtonStyle"
                    android:id="@+id/button_reject"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_weight="0.50"
                    android:textColor="@color/white"
                    android:textSize="30sp"
                    android:background="@color/watermelonRed"
                    android:text="@string/reject"
                    android:textStyle="bold|italic"/>

            </LinearLayout>
        </RelativeLayout>
    </ScrollView>
</RelativeLayout>

In the above agreement_dialog.xml file, you may have noticed that the text and colors are not written directly. They are defined under strings.xml and colors.xml files and provide the reference.

Now, let work on your strings.xml

</resources>
    <string name="dialog_title">Agreement</string>
    <string name="agreement">Write Your Agreement Here </string>
    <string name="accept">Accept</string>
    <string name="reject">Reject</string>
</resources>

Now colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>  
    <color name="background">#CED6E0</color>
    <color name="white">#ffffff</color>
    <color name="black">#000000</color>
    <color name="green">#006622</color>
    <color name="watermelonRed">#EB3B5A</color>
</resources>


Step 2:

Create a button on your activity.xml Whenever the button is clicked, an AlertDialogue button should open.

Here is a design for your button XML file.

<?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="match_parent"
    android:gravity="center"
    android:id="@+id/alertdialog"
    android:orientation="vertical">
  
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/openalertdialog"
        android:text="@string/open_alertdialog"
     />
</LinearLayout>

Now, add one more string in your strings.xml file.

<string name="open_alertdialog">Show AlertDialog</string>


Step 3:

Open custom AlertDialog on clicked on the activity button.

 openalertdialog.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //Toast.makeText(Activity.this, "Collect clicked", Toast.LENGTH_SHORT).show();
                final AlertDialog.Builder builder = new AlertDialog.Builder(Activity.this);

                // set the custom layout
                final View customLayout = getLayoutInflater().inflate(R.layout.agreement_dialog, null);
                builder.setView(customLayout);

                //set button accept and reject onclicklistener
                btnaccept = customLayout.findViewById(R.id.button_accept);
                btnreject = customLayout.findViewById(R.id.button_reject);

                btnaccept.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        //If accept, go to accept activity
                        Intent intent_accept = new Intent(Activity.this, Accept.class);
                        startActivity(intent_accept); 
                    }
                });

                btnreject.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                         //If reject, go to reject activity
                        Intent intent_reject = new Intent(Activity.this, Reject.class);
                        startActivity(intent_reject); 
                    }
                });

                AlertDialog alert = builder.create();
                alert.show();
        });


Output:

That’s it. Thank you for reading my article.



You may interest in the following topics:

Where does my database store in Android Studio?

Please Share On:

This article explains to you where your project database store in android studio and how can you open your project database for testing purposes. It sounds hard, but when you follow my procedure, you will quickly learn to find out your android studio’s project database and can open it. You can figure out easily, whether your database is created or not, database table, and the columns and data are there or not. You need to find out things before you proceed ahead with your database project.

Let’s go step by step.

Step 1:

Run your android project either in real device or emulator, whichever you feel comfortable and keep working on.

Wait until the android virtual device runs properly.

Step 2:

Look at the bottom right corner of your android studio workspace. You will able to see “Device File Explore“.



Step 3:

Click on it and it will expand towards your workspace.

Device File Explorer Expand

Step 4:

Navigate to data -> data and expand it.



Step 5:

Open your recent android studio project which database you are looking.

android project database

Step 6:

Expand the database folder, you will able to see your database if created successfully while running an android emulator.

Step 7:

Right-click on your database and save your database file in your required location.

save android database



You may interest on the following topics:

How to add user registration data into the Firebase database?

Please Share On:

In this tutorial, I am going to show you how to add user registration data into the firebase database. Make sure you follow all my process and leave a comment below, if I did not explain in details.

Step 1: Connect Firebase

First of all, you need to connect your Android project to the firebase and add the required dependencies. If you don’t know how can you connect your project to a firebase, read this tutorial first which shows a firebase connection process.

How to connect Firebase?

Step 2: Connect Firebase Database

Click on the Tools -> Firebase to connect Firebase database like Firebase Authentication.

It will open the Firebase tab like the below image. Click on Realtime Database -> Get Started with Realtime Database -> Add Database. Follow the process to complete.

Firebase Tab

Now, you can open your Firebase console. Click on Realtime Database.

Realtime Database

You will see an empty database with the root node and null value.

Click on rules, you need to change the Firebase database rules and allow only authenticated users to read and write data. So, replace the old Firebase rules with these new rules.

{
  "rules": {
    "users": {
      "$userId": {
        // grants write access to the owner of this user account
        // whose uid must exactly match the key ($userId)
        ".read": "auth != null && $userId === auth.uid",
        ".write": "auth != null && $userId === auth.uid",
      
      }
    }
  }
}


Step 3: Create User.java class

Now, lets go to the coding part. You have already created an authenticated registration form from step 1 tutorial. Now, this time we are going to add that data to the Firebase Database.

First, create a separate User.java class and generate getter and setter of the data, and create constructors. See a code below User.java.

package com.elsebazaar.bottlecollections;

public class User {
    public String name;
    public String email;


    public String password;

    public User(){
    }

    public User(String name, String email, String password){
        this.name = name;
        this.email = email;
        this.password = password;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }


}


Step 4: Add code to Register.java

This below code is used to add data to the Firebase

 FirebaseDatabase firebaseDatabase = FirebaseDatabase.getInstance();
 DatabaseReference databaseReference = firebaseDatabase.getReference();//databasereference

String uid = currentUser.getUid();
DatabaseReference userRef = databaseReference.child("users");//Create child node reference
userRef.child(uid).setValue(user);//Insert value to child node

Here is a complete code using during registration. The data should only add to the Firebase database after authentication success and user clicked the register button. So, the above code is added inside the register button onClicked method.

package com.elsebazaar.bottlecollections;

import android.content.Intent;
import android.graphics.Color;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ProgressBar;
import android.widget.TextView;

import androidx.annotation.NonNull;

import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.android.material.snackbar.Snackbar;
import com.google.firebase.auth.AuthResult;
import com.google.firebase.auth.FirebaseAuth;
import com.google.firebase.auth.FirebaseUser;
import com.google.firebase.database.DatabaseReference;
import com.google.firebase.database.FirebaseDatabase;

public class Register extends MainActivity {

    private FirebaseDatabase firebaseDatabase;
    private DatabaseReference databaseReference;
    private FirebaseAuth mAuth;
    private User user;

    ProgressBar progressBar;
    EditText mName, mEmail, mPassword, mConfirmPassword;

    Button btnregister;
    TextView txtalreadyamember;
    Snackbar snackbar;
    String emailPattern = "[a-zA-Z0-9._-]+@[a-z]+\\.+[a-z]+";

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

        progressBar = findViewById(R.id.progressBar);

        mName = findViewById(R.id.ettxtName);
        mEmail = findViewById(R.id.ettxtEmail);
        mPassword = findViewById(R.id.ettxtPassword);
        mConfirmPassword = findViewById(R.id.ettxtConfirmPassword);
        btnregister = findViewById(R.id.btnRegister);
        txtalreadyamember = findViewById(R.id.txtAlreadyAMember);

        mAuth = FirebaseAuth.getInstance();

        //initListeners();
        btnregister.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String name = mName.getText().toString().trim();
                String email = mEmail.getText().toString().trim();
                String password = mPassword.getText().toString().trim();
                String confirmpassword = mConfirmPassword.getText().toString().trim();

                //check whether name is empty or not
                if(TextUtils.isEmpty(name)){
                    mName.setError("Name is required");
                    return;
                }

                //check whether email address is empty or not
                if(TextUtils.isEmpty(email)){
                    mEmail.setError("Email Address is required");
                    return;
                }

                //check email address pattern is correct or not
                //if (isEmailValid(email))

                if (!email.matches(emailPattern)){
                    mEmail.setError("Email Address is invalid");
                    return;
                }

                //check whether password is empty or not
                if(TextUtils.isEmpty(password)){
                    mPassword.setError(" Password is required");
                    return;
                }

                //check whether password is less than 6 characters?
                if(password.length() < 6){
                    mPassword.setError("Password must be >= 6 characters");
                    return;
                }

                //check whether password and confirm password are match or not
                if(!password.equals(confirmpassword)){
                    mConfirmPassword.setError("Password does not match");
                    return;
                }

                //Make progress bar visible
                progressBar.setVisibility(View.VISIBLE);

                //User Method call
                user = new User (name, email, password);

                //create user by calling registerUser function
                registerUser(email, password);

                //Call function to empty All EditText
                emptyInputEditText();
            }
        });
    }

    private void registerUser(String email, String password) {
        //Register the user in firebase
        mAuth.createUserWithEmailAndPassword(email,password).addOnCompleteListener(new OnCompleteListener<AuthResult>() {
            @Override
            public void onComplete(@NonNull Task<AuthResult> task) {
                if (task.isSuccessful()){

                    FirebaseUser user = mAuth.getCurrentUser();
                    updateUI(user);

                    //display snackbar with green background
                    View view = findViewById(android.R.id.content);
                    String message = "Account Created Successfully";
                    int duration = Snackbar.LENGTH_LONG;

                    snackbar = Snackbar.make(view, message, duration)
                            .setAction("Action", null);
                    View sbView = snackbar.getView();
                    sbView.setBackgroundColor(Color.GREEN);
                    snackbar.show();

                    //Toast.makeText(Register.this,"Account Created",Toast.LENGTH_SHORT).show();
                    startActivity(new Intent(getApplicationContext(), Home.class));

                }
                else{
                    //display snackbar with red background
                    View view = findViewById(android.R.id.content);
                    String message = "Email ID already exits";
                    int duration = Snackbar.LENGTH_LONG;

                    snackbar = Snackbar.make(view, message, duration)
                            .setAction("Action", null);
                    View sbView = snackbar.getView();
                    sbView.setBackgroundColor(Color.RED);
                    snackbar.show();

                    //Toast.makeText(Register.this,"Error Occured" + task.getException(),Toast.LENGTH_SHORT).show();*/
                   // updateUI(null);
                    progressBar.setVisibility(View.INVISIBLE);
                }
            }
        });
    }


    /**
     * This method is to empty all input edit text
     */
    private void emptyInputEditText() {
        mName.setText(null);
        mEmail.setText(null);
        mPassword.setText(null);
        mConfirmPassword.setText(null);
    }

    public void onStart(){
        super.onStart();
        //check if user is signed in and update UI accordingly
        FirebaseUser currentUser = mAuth.getCurrentUser();
        updateUI(currentUser);
    }


    private void updateUI(FirebaseUser currentUser) {
        if (user != null) {
            firebaseDatabase = FirebaseDatabase.getInstance();
            databaseReference = firebaseDatabase.getReference();//databasereference

            String uid = currentUser.getUid();
            DatabaseReference userRef = databaseReference.child("users");//Create child node reference
            userRef.child(uid).setValue(user);//Insert value to child node
        }
    }

    public void enabled(View view) {
        Intent intent = new Intent(Register.this, MainActivity.class);
        startActivity(intent);
        finish();
    }
}

That's it. Run your program and see the result.



You may interest on the following topics:

Copyright @2023. All Right Reserved.


Social media & sharing icons powered by UltimatelySocial