Coding Android Custom Dialogs the easy way

  • Written by  Clive

Dialog tutorials. Doing it your way: Custom dialogs

Custom dialog iconYou can use your own layout in an Alert Dialog.

 Android custom dialog

Here’s an example of a Custom Dialog

Creating the Custom Dialog

Create an Alert Dialog as before.

Create the custom layout

The layout will determine the look of the dialog.

Create your layout xml file and save it in the res>layout folder. We’ll need it when we create the dialog.

Create the fragment

  • Import the support library’s dialog fragment class
  • Create an interface to communicate back to the host activity
  • Include the necessary code in the fragment’s onAttach() method to make sure that the host activity implements the interface

The interface

Here’s the code for the interface.

It contains calls to two of the host activity’s methods:

  • onOkay() is called when the user presses the Okay button
  • onCancel() is called when the user presses the Cancel button

Note the following:

  • onOkay(String contactDetails) – we use a String parameter to pass the contact details back to the host activity

Custom Dialogs interface code

The interface communicates back to the host activity

Create the custom dialog

Here’s the code for creating the custom dialog.

Note the following:

  • Use AlertDialog.Builder to build the dialog
  • LayoutInflater –creates the layout for the dialog. It uses our layout
  • setView() – sets the view to display in the dialog
  • inflate() – inflates the layout resource file (the first parameter). The second parameter is a parent view into which we could inflate our layout. We don’t use a parent view so we pass null
  • Positive button – activated when the user presses Okay. This is where you would have code to read the user’s input and pass it on to the host activity via the interface. We pass on some dummy details
  • Negative button – pressed when the user wants to cancel the dialog. This calls the fragment’s onCancel() method as well as the host activity’s onCancel() method via the interface

Building Android cutom dialog

The Custom Dialog’s host activity

As in the previous Alert Dialog:

  • Import the support library’s FragmentActivity class
  • Implement the list fragment’s interface
  • Include the 2 methods
    • onOkay()
    • onCancel()
  • show() the dialog

Showing the custom dialog

Here’s the code for showing the dialog:

show() Android custom dialog 

Calling show() displays the dialog and adds the fragment, identified by the tag “CustomDialogFragment”, to the fragment manager (which we get by calling getSupportFragmentManager())

Taking action: Pressing the custom dialog action buttons

Here are the methods that are called when either of the dialog buttons is pressed:

Host activity methods

Custom dialog Okay button Toast message

The Toast message showing the dummy details we returned to the host activity

Pressing the custom dialog’s Okay button sends the user’s contact details back to the host via the fragment interface. We then display it in a Toast message.

Custom dialog Cancel button Toast

This Toast message displays when the custom dialog is cancelled

Pressing the custom dialog’s Cancel button cancels the dialog and calls the activity’s onCancel() method. We then display an appropriate Toast message.

That’s it. You’ve just created a custom dialog!

I hope you found this tutorial helpful.

Here are the links to all the tutorials in this series on Android Dialogs;

This project was created using Android Studio. You can download the project files here File download icon

Are you using Eclipse or another IDE? Here's how you can use this project's Android Studio files.