Android custom alert dialog | Custom dialog android studio kotlin | Android Studio Tutorial

Devendra Chavan
2 min readJan 11, 2023

--

Hello Guys, welcome to my #codingwithdev​ channel In This tutorial we will learn how to create a custom dialog/alert box in android studio using kotlin.

Please 👍𝐋𝐢𝐤𝐞 ,👤𝗦𝗵𝗲𝗮𝗿,✎𝐂𝐨𝐦𝐦𝐞𝐧𝐭 And ☝𝐒ᴜʙ𝐒ʀɪʙᴇ My 𝗬𝗢𝗨𝗧𝗨𝗕𝗘 Channel

STEP 1 : Create new Android Studio Project.

STEP 2: Here’s the activity_main.xml layout

<?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:layout_height="match_parent"
tools:context=".MainActivity">

<Button
android:id="@+id/btnLogOut"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Log out"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

STEP 3: Here’s the layout_custom_dailog.xml layout

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.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_marginHorizontal="20dp"
app:cardBackgroundColor="@color/white"
app:cardCornerRadius="20dp">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:padding="20dp">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="App Name"
android:textColor="@color/purple_700"
android:textSize="18sp"
android:textStyle="bold" />

<TextView
android:id="@+id/tvMessage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:text="message"
android:textColor="@color/black"
android:textSize="16sp"
android:textStyle="bold" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:orientation="horizontal">

<Button
android:id="@+id/btnYes"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:text="Yes"
android:textAllCaps="false"
android:textColor="@color/white"
android:textSize="14sp" />

<Button
android:id="@+id/btnNo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:backgroundTint="#A4A4A4"
android:text="No"
android:textAllCaps="false"
android:textColor="@color/white"
android:textSize="14sp" />

</LinearLayout>

</LinearLayout>
</androidx.cardview.widget.CardView>

STEP 4: Here’s the MainActivity.kt Activity


import android.app.Dialog
import android.graphics.Color
import android.graphics.drawable.ColorDrawable
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.Window
import android.widget.Button
import android.widget.TextView
import android.widget.Toast

class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)

val btnLogOut: Button = findViewById(R.id.btnLogOut)

btnLogOut.setOnClickListener {
val message: String? = "Are you sure you want to log out"
showCustomDialogBox(message)
}
}

private fun showCustomDialogBox(message: String?) {
val dialog = Dialog(this)
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE)
dialog.setCancelable(false)
dialog.setContentView(R.layout.layout_custom_dailog)
dialog.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))

val tvMessage: TextView = dialog.findViewById(R.id.tvMessage)
val btnYes: Button = dialog.findViewById(R.id.btnYes)
val btnNo: Button = dialog.findViewById(R.id.btnNo)

tvMessage.text = message

btnYes.setOnClickListener {
Toast.makeText(this, "click on Yes", Toast.LENGTH_LONG).show()
}

btnNo.setOnClickListener {
dialog.dismiss()
}
dialog.show()
}
}
//That it
// All code is done let's run the app

STEP 5 : And finally run the App and See the output

Show More Tutorials And Feel free to SUBSCRIBE to my YOUTUBE channel Thank You :-)

--

--

Devendra Chavan
Devendra Chavan

Written by Devendra Chavan

Android Mobile Application Developer

No responses yet