What is Custom Alert Dialog Box?
The custom dialog uses DIALOG to create a custom alert or pop-up in Android Studio. A dialog box will appear above the current window, which defines its contents in it.
Both Alert Dialog and Custom Alert Dialog display a small window to make a decision.
Sometimes with AlertDialog, we need to gather user input or adapt the dialogue to meet our needs. As a result, we construct our own AlertDialogs/ Custom alert Dialog. This article will demonstrate how to customize AlertDialogs and use their input.
Content:
Preview: Custom Alert Dialog Box
File: MainActivity.kt
File: activity_main.xml
File: custom_item.xml
Preview
<– Alert Dialog Box
File: MainActivity.kt
–> In MainActivity.kt file initilize variable and implement setonclicklistener and called a CustomDialogBox() function inside CustomDialogBox() create a alert dialog box and implements alert dialog methods.
package com.sagar.customdialogboxinandroid import android.os.Bundle import android.view.View import android.widget.Button import android.widget.EditText import android.widget.Toast import androidx.appcompat.app.AlertDialog import androidx.appcompat.app.AppCompatActivity class MainActivity : AppCompatActivity() { override fun onCreate( savedInstanceState: Bundle? ) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) findViewById<Button>(R.id.button).setOnClickListener { CustomDialogBox() } } fun CustomDialogBox() { val builder= AlertDialog.Builder(this) builder.setTitle("Name") val customLayout: View = layoutInflater .inflate( R.layout.custom_item, null ) builder.setView(customLayout) builder .setPositiveButton( "OK" ) { dialog, which -> val editText: EditText = customLayout .findViewById( R.id.edit_txt ) sendmessage( editText .text .toString() ) } .setNegativeButton("Cancel"){ dialog, which -> Toast.makeText( this, "Cancel", Toast.LENGTH_SHORT ) .show() } val dialog: AlertDialog = builder.create() dialog.show() } private fun sendmessage(MSG: String) { Toast.makeText( this, MSG, Toast.LENGTH_SHORT ) .show() } }
File: activity_main.xml
–> activity_main.xml file contains a textview and button inside a ConstraintLayout.When you click the button, the AlertDialog box appears.
<?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:background="@color/teal_200" android:layout_height="match_parent" tools:context=".MainActivity"> <TextView android:id="@+id/textView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="124dp" android:fontFamily="sans-serif-black" android:text="Custom Dialog Box" android:textColor="@color/black" android:textAlignment="center" android:textSize="30sp" android:textStyle="bold" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" android:gravity="center_horizontal" /> <Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="104dp" android:text="Show Dialog Box" android:backgroundTint="@color/black" android:textColor="@color/teal_200" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
File: custom_item.xml
–> Make a custom layout.xml XML file. In custom layout.xml, add the following code. This code adds a textView and edittext to the alert dialog box.
<?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" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/teal_200"> <TextView android:id="@+id/textView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="124dp" android:fontFamily="sans-serif-black" android:text="Developers Dome" android:textColor="@color/black" android:textSize="30sp" android:textStyle="bold" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> <EditText android:id="@+id/edit_txt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="276dp" android:background="@color/black" android:ems="10" android:gravity="center_horizontal" android:hint=" Enter Name" android:inputType="textPersonName" android:textAlignment="center" android:textColor="@color/white" android:textSize="30sp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
- We hope that this guide will assist you in quickly creating a simple Alert dialog/ Custom alert dialog box in Android . If you have any problems, please post them in the comments section and we will gladly assist you.
Pingback: Material Dialogs in Android with Example - Developers Dome