How to Implement Custom Dialog Maker in Android?
Last Updated :
15 Nov, 2021
In this article, we are going to make an application of Custom Dialog Maker in android studio. In this application, we can create dialogs of our own choice of style, type, and animation.
What is a dialog?
A dialog is a small window that prompts the user to make a decision, provide some additional information, and inform the user about some particular task.
Goals/Purposes of a dialog:
The following are the main purposes or goals of a dialog-
- To warn the user about any activity.
- To inform the user about any activity.
- To tell the user that it is an error or not.
- To tell the user that his/her desired action has been succeeded.
What we are going to build in this article?
In this application, we will provide the user, the facility to choose which kind of dialog he wants i.e. he/she can select the type, style, and animation of the desired dialog box. Note that we are going to implement this application using Java language. A sample video is given below to get an idea about what we are going to do in this article.
Step by Step Implementation
Step 1: Creating a new project
- Open a new project.
- We will be working on Empty Activity with language as Java. Leave all other options unchanged.
- You can change the name of the project at your convenience.
- There will be two default files named activity_main.xml and MainActivity.java.
If you don’t know how to create a new project in Android Studio then you can refer to How to Create/Start a New Project in Android Studio?
Step 2: Add dependency and JitPack Repository
Navigate to the Gradle Scripts > build.gradle(Module:app) and add the below dependency in the dependencies section.
implementation 'com.github.gabriel-TheCode:AestheticDialogs:1.3.5'
Add the JitPack repository to your build file. Add it to your root build.gradle at the end of repositories inside the allprojects{ } section.
allprojects {
repositories {
...
maven { url "https://jitpack.io" }
}
}
After adding this dependency sync your project and now we will move towards its implementation.
Step 3: Working with the activity_main.xml file
Here we will design the user interface of our application. We will be using the following components for their respective works:
- TextView: to display a message to the user to select the type, style, or animation.
- Spinner: to open a dropdown list for users to select the type, style, or animation.
- Button: to show the dialog box.
Use the following code in the activity_main.xml file.
XML
<?xml version="1.0" encoding="utf-8"?>
<!-- linear layout as parent layout-->
<LinearLayout
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"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp"
tools:context=".MainActivity">
<!-- to display the message "Select dialog style-->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Select Dialog style"
android:textSize="16sp"
android:textStyle="bold" />
<!-- to allow user to select dialog style-->
<Spinner
android:id="@+id/sp_style"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- to display the message "Select dialog type"-->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Select Dialog Type"
android:textSize="16sp"
android:textStyle="bold" />
<!-- to allow user to select dialog type-->
<Spinner
android:id="@+id/sp_type"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- to display the message "Select dialog animation"-->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Select Dialog Animation"
android:textSize="16sp"
android:textStyle="bold" />
<!-- to allow the user to select dialog animation-->
<Spinner
android:id="@+id/sp_animation"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- to perform the action of Showing dialog box-->
<Button
android:id="@+id/bt_show"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="Show Dialog" />
</LinearLayout>
After executing the above code design of the activity_main.xml file looks like this.
Step 4: Working with the MainActivity.java file
Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.
Java
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.Spinner;
import androidx.appcompat.app.AppCompatActivity;
import com.thecode.aestheticdialogs.AestheticDialog;
import com.thecode.aestheticdialogs.DialogAnimation;
import com.thecode.aestheticdialogs.DialogStyle;
import com.thecode.aestheticdialogs.DialogType;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
// Initialize variables
Spinner spStyle, spType, spAnimation;
Button btShow;
ArrayList<DialogStyle> styleList = new ArrayList<>();
ArrayList<DialogType> typeList = new ArrayList<>();
ArrayList<DialogAnimation> Animationlist = new ArrayList<>();
DialogStyle dialogStyle;
DialogAnimation dialogAnimation;
DialogType dialogType;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// assign variables
spStyle = findViewById(R.id.sp_style);
spType = findViewById(R.id.sp_type);
spAnimation = findViewById(R.id.sp_animation);
btShow = findViewById(R.id.bt_show);
// add dialog styles to arraylist
styleList.add(DialogStyle.FLASH);
styleList.add(DialogStyle.CONNECTIFY);
styleList.add(DialogStyle.TOASTER);
styleList.add(DialogStyle.EMOJI);
styleList.add(DialogStyle.EMOTION);
styleList.add(DialogStyle.DRAKE);
styleList.add(DialogStyle.RAINBOW);
styleList.add(DialogStyle.FLAT);
// set adapter to style spinner
spStyle.setAdapter(new ArrayAdapter<>(this, android.R.layout.simple_spinner_dropdown_item, styleList));
// add dialog types to arraylist
typeList.add(DialogType.ERROR);
typeList.add(DialogType.INFO);
typeList.add(DialogType.WARNING);
typeList.add(DialogType.SUCCESS);
// set adapter to type spinner
spType.setAdapter(new ArrayAdapter<>(this, android.R.layout.simple_spinner_dropdown_item, typeList));
// add dialog animations to arraylist
Animationlist.add(DialogAnimation.FADE);
Animationlist.add(DialogAnimation.CARD);
Animationlist.add(DialogAnimation.DEFAULT);
Animationlist.add(DialogAnimation.DIAGONAL);
Animationlist.add(DialogAnimation.IN_OUT);
Animationlist.add(DialogAnimation.SHRINK);
Animationlist.add(DialogAnimation.SLIDE_DOWN);
Animationlist.add(DialogAnimation.SLIDE_LEFT);
Animationlist.add(DialogAnimation.SLIDE_RIGHT);
Animationlist.add(DialogAnimation.SLIDE_UP);
Animationlist.add(DialogAnimation.SPIN);
Animationlist.add(DialogAnimation.SPLIT);
Animationlist.add(DialogAnimation.SWIPE_LEFT);
Animationlist.add(DialogAnimation.SWIPE_RIGHT);
Animationlist.add(DialogAnimation.WINDMILL);
Animationlist.add(DialogAnimation.ZOOM);
// set adapter to animation spinner
spAnimation.setAdapter(new ArrayAdapter<>(this, android.R.layout.simple_spinner_dropdown_item, Animationlist));
// to select style
spStyle.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) {
// get selected style
dialogStyle = styleList.get(i);
}
@Override
public void onNothingSelected(AdapterView<?> adapterView) {
}
});
// to select type
spType.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) {
// get selected style
dialogType = typeList.get(i);
}
@Override
public void onNothingSelected(AdapterView<?> adapterView) {
}
});
// to select animation
spAnimation.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) {
// get selected style
dialogAnimation = Animationlist.get(i);
}
@Override
public void onNothingSelected(AdapterView<?> adapterView) {
}
});
// to show dialog as output
btShow.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
// initialize dialog
AestheticDialog.Builder builder = new AestheticDialog.Builder(MainActivity.this, dialogStyle, dialogType);
// set title
builder.setTitle("Title");
// set message
builder.setMessage("Message");
// set animation
builder.setAnimation(dialogAnimation);
// show dialog
builder.show();
}
});
}
}
Congratulations! we have successfully made the application of Custom Dialog maker in android studio. Here is the final output of our application.
Output:
Similar Reads
How to Make a Custom Exit Dialog in Android?
In this tutorial, we are going to create a Custom Exit Dialog in Android. By default, android doesn't provide any exit dialog, but we can create it using the dialog class in java. But most of the developers and also the user don't like the default dialog box and also we can't do any modification in
5 min read
How to Implement Country Code Picker in Android?
Country Code Picker (CCP) is an android library that helps users to select country codes (country phone codes) for telephonic forms. CCP provided a UI component that helps the user to select country codes, country flags, and many more in an android spinner. It gives well-designed looks to forms on t
3 min read
How to Implement Custom Calendar in Android?
Nowadays in most of the apps, we see Calendar in most of the apps for displaying birth dates or for any appointment application. Displaying the date in the app with the help of the Calendar view gives a better user experience. In this article, we are going to make a custom calendar for our android a
4 min read
How to Implement Custom Searchable Spinner in Android?
Android Spinner is a view similar to the dropdown list which is used to select one option from the list of options. It provides an easy way to select one item from the list of items and it shows a dropdown list of all values when we click on it. The default value of the android spinner will be the c
5 min read
How to Implement Date Range Picker in Android?
Date Range Picker is a widely used feature in many popular Android apps and an essential component of Material Design. It allows users to select a range of dates such as a start and end date for various purposes including scheduling, filtering data, and setting time boundaries. Some Of The Real Life
4 min read
How to Implement View Binding Inside Dialog in Android?
In android, View binding is a feature that allows you to more easily write code that interacts with views. Once view binding is enabled in a module, it generates a binding class for each XML layout file present in that module. An instance of a binding class contains direct references to all views th
4 min read
How to Implement MultiSelect DropDown in Android?
In this article, we are going to see how we can make a MultiSelect DropDown in android studio and will select multiple items from a dropdown list. Advantages of MultiSelect DropDown. It is a good replacement for list boxes as it uses less space does the same work as a list box and gives a good look
4 min read
How to Implement TextWatcher in Android?
If an application contains a login form to be filled by the user, the login button should be disabled (meaning: it shouldn't be clickable). When the user enters the credentials of the form the button should be enabled to click for the user. So in this article, we are implementing a Text Watcher to t
3 min read
How to add Custom Spinner in Android?
Spinner is a widget that is used to select an item from a list of items. When the user tap on a spinner a drop-down menu is visible to the user. In this article, we will learn how to add custom spinner in the app. Steps of Implementing Custom SpinnerStep 1: Create a new layout for each item in Spinn
5 min read
Android Jetpack Compose - Implement Easy Rating Dialog
Many times in android applications we can get to see that they ask for users to rate their application and share their reviews about the application. In this article, we will take a look at How to implement an Easy Rating dialog in android applications using Jetpack Compose. Using the Easy Rating Di
4 min read