Android Alert Dialog using Kotlin With Examples

In this tutorial, we’ll be discussing Alert Dialogs and implement them in our Android Application using Kotlin.

Alert Dialogs

Alert Dialog is a window that pops up on the screen. They generally show some information and ask for a user action.

There are three core components that build an Alert Dialog.

  • Title Text
  • Message Text
  • Buttons – There are three types of buttons: Positive, Negative, and Neutral

To create an AlertDialog we use the AlertDialog.Builder inner class.

We pass the context inside the constructor. Optionally, we can pass another parameter, the alert dialog style.

Alert Dialog Methods

Some of the methods that can be used on an AlertDialog.

  • setTitle
  • setMessage
  • setIcon
  • setCustomTitle – Here you can pass a custom view that’ll be put in place of the title part in the alert dialog.
  • setPositiveButton – We pass the string name, as well as Button, clicked callback method here.
  • setView – used to add a custom view inside the alert dialog.
  • setList – used to set an array of strings which would be displayed in the form of a List.
  • setMultiChoiceList – again we can set an array but this time we can select multiple items from the List thanks to CheckBox.
  • setPositiveButtonIcon – set an icon alongside the Button
  • show() – used to display the AlertDialog
  • setDismissListener – Inside this, you can set the logic to be triggered when the alert dialog is dismissed.
  • setShowListener – set the logic to be triggered when the alert dialog is dismissed.
  • setCancelable – requires a boolean value. By default all alert dialogs are cancelable on button click or touch outside. If this method is set to false, you need to explicitly cancel the dialog using dialog.cancel() method.

Alert Dialog Kotlin Code

To use AlertDialog in your Android Studio project, import the following class.

Following Kotlin code is used to create a simple alert dialog.

The builder.show() displays the Alert Dialog on the screen.

Inside the setPositiveButton function, we pass the Button text along with a Kotlin function that’s triggered when that button is clicked. The function is a part of the DialogInterface.OnClickListener() interface.

The function type is (DialogInterface, Int) -> Unit. DialogInterface is an instance of the Dialog and Int is the id of the button that is clicked.

In the above code, we’ve represented this function as a Higher Order Kotlin function. The dialog and which represents the two arguments.

We can improve the function by passing _ if the arguments aren’t used.

The functions would look like these:

Alternatively, we can also display the Dialog through the AlertDialog class instance.

Replace builder.show() with:

Instead of defining the button click listener functions for each of the buttons, we can define the higher-order functions separately as well.

Now set this val property inside the setPositiveButton Kotlin function as:

The latter makes the code look much concise.

Following is a screenshot from our Activity class with the above function applied for each of the Buttons.

androidly-basic-alert-dialog-kotlin-code

You can pass a null instead of the function if you don’t intend to keep any action on the button click.

Kotlin has still more power to improve the readability of the above code.

Simple Alert Dialog Kotlin code

Using the with function, we can enhance the readability of the Kotlin code to create an Alert Dialog.

In the next section we’ll be creating our Android Application where we will implement the following features in our AlertDialog.

  • Simple Alert Dialog
  • Alert Dialog With Icon and Button Customisation
  • Alert Dialog With List
  • Alert Dialog With MultiChoice List
  • Alert Dialog With Style
  • Alert Dialog With Custom Style
  • Alert Dialog With EditText

Android Studio Project Structure

androidly-basic-alert-dialog-project-structure-e1532029320309

1. XML Layout Code

The code for the activity_main.xml layout is given below.

For each of the buttons we’ve set an android:onClick attribute with the function name. These Kotlin functions would be triggered in the MainActivity.kt class. We’ll discuss each of them one at a time.

2. Kotlin Main Activity Code

We’ve already created the first Alert Dialog above. Let’s see how the MainActivity.kt looks with it.

3. Alert Dialog With Icons and Customisation

Using the getButton, we can retrieve any of the Buttons by setting their respective constant.
Once the Button is retrieved, we can customise it as done above.

4. Alert Dialog With Items

Inside the setItems we pass the Kotlin Array.
The which argument represents the index of the element clicked in the List.

5. Alert Dialog With MultiChoice List

In the above code, we save the choices in an array list of integers and retrieve them again to show them in the Toast message.

6. Alert Dialog With Style

If you don’t use ContextThemeWrapper, the Alert Dialog would be displayed on the full screen.

7. Alert Dialog With Custom Style

Add the following code in the styles.xml file:

Following is the Kotlin function:

8. Alert Dialog With Button Centered

9. Alert Dialog With Edit Text

The code for the custom layout alert_dialog_with_edittext.xml is given below:

The output of the above application is given below:

android alert dialog demo output

By admin

Leave a Reply

%d bloggers like this: