How to Add an Icon Inside an AlertDialog in Android?

Last Updated : 22 Jun, 2025

In this tutorial, you will learn how to display an Icon inside a custom AlertDialog in an Android app using Kotlin. While the default AlertDialog offers basic styling, customizing its layout allows you to add icons, colors, and other UI components to enhance the user experience.

Step By Step Implementation

Step 1: Create a New Project

To create a new project in the Android Studio, please refer to How to Create/Start a New Project in Android Studio?

Note: Select Kotlin as the programming language.

Step 2: Creating a layout for Alert Dialog

Navigate to the app > res > layout, create a file named dialog_layout.xml and add the below code to that file. Below is the code for the dialog_layout.xml file. It represents the UI of our Alert Dialog, it contains an ImageView for displaying the Icon, one TextView to display the message and one cancel button to dismiss the alert dialog. Also, create a new drawable resource file named ic_alert.xml and add the following code.

dialog_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<!--LinearLayout-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="20dp"
    android:gravity="center"
    android:orientation="horizontal">
  
    <!--ImageView-->
    <ImageView
        android:id="@+id/dialog_icon"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:src="@drawable/ic_alert" />
  
    <!--TextView-->
    <TextView
        android:textStyle="bold"
        android:textColor="@color/black"
        android:gravity="center"
        android:padding="10dp"
        android:textSize="18dp"
        android:id="@+id/tv_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="msg" />

</LinearLayout>

ic_alert.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="960"
    android:viewportHeight="960">
  <path
      android:pathData="m40,840 l440,-760 440,760L40,840ZM178,760h604L480,240 178,760ZM480,720q17,0 28.5,-11.5T520,680q0,-17 -11.5,-28.5T480,640q-17,0 -28.5,11.5T440,680q0,17 11.5,28.5T480,720ZM440,600h80v-200h-80v200ZM480,500Z"
      android:fillColor="#e8eaed"/>
</vector>

Step 3: Working with activity_main.xml

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. This xml file represents our app UI, our UI contains one button by clicking it the Alert dialog is opened.

activity_main.xml:

XML

<?xml version="1.0" encoding="utf-8"?>
<!--LinearLayout-->
<LinearLayout 
    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"
    android:orientation="vertical"
    android:gravity="center"
    tools:context=".MainActivity">
  
    <!--Button-->
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Open Dialog with Icon"
        android:id="@+id/openDialog"/>
  
</LinearLayout>

Step 4: Working with the MainActivity.kt file

Go to the MainActivity.kt and follow the below code. Below is the code for the MainActivity.kt. Comments are added inside the code to understand the code in more detail. This activity contains the main logic to create an Alert dialog and add an Icon inside the Alert Dialog.

MainActivity.kt:

Kotlin

package org.geeksforgeeks.demo

import android.annotation.SuppressLint
import android.content.Context
import android.os.Bundle
import android.view.LayoutInflater
import android.widget.Button
import android.widget.ImageView
import android.widget.TextView
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)
        val openDialogButton: Button = findViewById(R.id.openDialog)
        openDialogButton.setOnClickListener {
            showDialogwithIcon(this@MainActivity)
        }
    }

    @SuppressLint("MissingInflatedId")
    // Open the Dialog With an Alert Icon
    fun showDialogwithIcon(context: Context) {
        val builder = AlertDialog.Builder(context)
        val inflater = LayoutInflater.from(context)
        val dialogView = inflater.inflate(R.layout.dialog_layout, null)

        // Find the ImageView and set the icon
        val iconImage: ImageView = dialogView.findViewById(R.id.dialog_icon)
        iconImage.setImageResource(R.drawable.ic_alert)

        // Find the TextView and set the message
        val message: TextView = dialogView.findViewById(R.id.tv_message)
        message.text = "This is an Alert Dialog With an Icon."

        // Set the custom layout to the dialog
        builder.setView(dialogView)

        // Add a negative button to cancel the dialog
        builder.setNegativeButton("Cancel") { dialog, _ ->
            dialog.dismiss()
        }

        // Show the dialog
        val dialog: AlertDialog = builder.create()
        dialog.show()
    }
}