Show Alert Dialog in Android

AlertDialogs are pop ups used to prompt a user about an action to be taken. An AlertDialog may also be used for other actions such as providing a list of options to choose from or can be customized to have a user provide unique details such as their login information or application settings.

Steps

Understanding AlertDialogs

  1. Understand the basic structure of an AlertDialog. An AlertDialog is when the Android app uses the Android system to put up important information for a user to read.[1] An AlertDialog can also be used to warn or ask the user to change an important setting. It will contain three components of the dialog box.
    • A title is optional but can be useful to put in a simple message or question. This can also contain an icon
    • The content area which can display a message, list or other custom layout functions.
    • Action buttons that are used for the user to send a response to the AlertDialog box. Can be a positive button, a negative button or a neutral button. You can only have one of each type and up to three buttons on a given alert dialog.[2]
  2. Understand what a class is. A class is a template that allows you to create other objects that have their own properties and behaviors. The AlertDialog class is a subclass of the Dialog class that features its own unique properties of being able to display up to three buttons in addition to a standard Dialog prompt.
  3. Decide on the purpose of the AlertDialog. What is the purpose of the AlertDialog box? What are the options going to be for the user? Is it possible that the user would ignore this process otherwise? Write down what the user will be prompted for and note their choices and what they do. If the writing seems unclear for the user, they may not understand the purpose of the AlertDialog box.
  4. Write and illustrate the AlertDialog. Draw what you want the AlertDialog box to look like. Write down the list the options you would like to implement and their resulting actions. Think carefully about what the user is being prompted for and ensure the writing does not create ambiguity.
  5. Download and Install Android SDK. A software development kit or SDK is used to develop software in a specialized environment for creating programs and applications. You can download SDK direct from the Android developer website.[3]
  6. Create a new project. Even if you have an existing project, creating a project can be ideal if you want to create a testing environment before adding code to your main project. From the menu bar click on File>New>New Project… and follow the prompts to create a new application.

Coding an AlertDialog Prompt

  1. Create a trigger for the AlertDialog box. The AlertDialog will need to be brought up by an action performed by the user. You can edit the main layout of the app under the “activity_main.xml” file to provide a button to test the AlertDialog with. There are two ways to create a button. Switch between design and coding methods by clicking on either Design or Text which are located at the bottom of the main window pane to switch between the different modes.
  • The Android SDK allows you to edit your layout such as the main front end which can be found in the project hierarchy under the Layout folder by using a drag and drop interface to create a button.
  • You can also create a button in XML code yourself by editing the XML document. Note the line indicating the onClick action is used to execute the AlertDialog box when the button is clicked on.
  • Import the AlertDialog class to access the API. This will be needed in order to access the class to create the AlertDialog prompt. The AlertDialog’s class provides the ability to create the Dialog box on screen, set it’s options, display titles and show contents within the Dialog window. To import the class, open the “MainActivity.java” file. Scroll to the top of the file and place this among the other classes being imported to the project.
    • This class will be useful for your entire application. Be sure to add it to the top of your code hierarchy.
  • Identify a button object. A button object help identify a push-button widget as seen in the XML code.[4] In your main java code, “MainActivity.java” identify and initialize a button object in the beginning of your main method, which is the main class of your app.
  • Listen for button activity. Using an OnClickListener, you will be able to anticipate when the user taps on the button to initiate an action. An OnClickListener is performed by listening for user input when they click on a corresponding button. We will use the listener to open our AlertDialog prompt.
  • Code the components of the AlertDialog. Within the onClick function, you will need to create an AlertDialog object and provide it with a title, message and button types to use for your prompt.
    • Create the alert dialog box object and set the builder to refer to the new object and create the box.

  • Use a setter function to create a title. A setter function allows you to provide a variable to an object. This is ideal to avoid using global variables that can cause performance issues. A title is entirely optional, but you can set one to appear at the top of the AlertDialog window.
  • Use a setter function to set a message. Enter a message to describe what you want the user to answer.
  • Use setter functions to set button properties. Provide buttons for the user to use. You can use a combination of a positive button, a negative button and a neutral button. You can use any combination of the three types but can only use one of each for up to three buttons. Use the onClick functions to provide an action when the user clicks on one of the three buttons at the bottom of the AlertDialog prompt.
  • Use a setter function to activate the physical cancel button. You can provide a cancel function to the back key on the Android device itself without tapping one of the buttons as well. If it is set to false, the back button on the Android device is ignored.[5]
  • Create the dialog box. Use this to create the AlertDialog object. This will need to be done before showing the AlertDialog on screen.
  • Show the dialog box. Once the object is created, use this action to show the AlertDialog on screen.
  • Coding a List AlertDialog

    1. Create an array. You can use one of three different types of lists you can use. Instead of using the setMessage function, use a list if you want to provide multiple choice answers. Your list will need to have an array created independently to list the different available options. The list will use an array to display the different available options.
    2. Create a list AlertDialog. Use setItems to provide a list of options to choose from. This will appear as a list of radio buttons to check. The function will require an array of options to choose from and an onClickListener to represent the user’s input.
    3. Create a list that features multiple choice. Use setMultiChoiceItems if you want the user to be able to select several options. Their options will be shown in checkboxes when used.
    4. Create a list that only permits a persistent single choice. Use setSingleChoiceItems if you want the user’s singular choice to be persistent. Their options appear with radio buttons which appear as circles with dots inside of a selected choice.

    Creating a Custom AlertDialog

    1. Create a custom layout. A custom AlertDialog allows you to create a layout featuring it’s own parameters and can obtain information that can be used to obtain a user’s login information, configuration settings and more. You can create a new layout that will be created in XML coding format. Some Android SDK provide the ability to use a drag-and-drop function to easily create a layout that will auto-convert into XML for you. From the menu bar at the top of the window, click on File>New>XML>Layout XML File. Provide a layout file name then click on Finish. Your new layout will appear in the main window pane.
    2. Add in widgets or other components to the layout. You can add in components using one of two methods. You can open the layout file from looking in the project hierarchy shown on the left hand side. Then open the following folder paths: “<AppName>>app>src>main>res>layout”
    3. Create a new Java Class. A new class will allow you to separate the code for your unique alert layout. Click on File>New>Java Class. Type in a name for your new Java class then click on OK. For this example, we will call this example class “CustomDialogExample.”
    4. Import the Dialog Fragment. The Dialog Fragment allows for maximum compatibility with the different versions of Android OS. import android.support.v4.app.DialogFragment;
      • Make sure the main class method extends to the DialogFragment.
    5. Create a layout inflater object and a view object. A Layout Inflater instantiates a layout XML file into view objects.[6] A View object is the basic structure for user interface components in a rectangular screen space and draws objects and widgets on screen.[7]
    6. Create the custom dialog layout. We will need for it to be public so that it can be accessed elsewhere in the application and it will return a Dialog object. It will take in a Bundle object
    7. Inflate the layout from the custom XML layout. With the LayoutInflater and View objects created, inflate the layout and obtain the custom layout onto the View object from within the onCreateDialog function.
    8. Build the custom AlertDialog. In the onCreateDialog function, use the AlertDialog builder to create the layout.
    • You may wish to add in a button to close the AlertDialog.

  • Return the custom AlertDialog. Because we are not in the main focus of the application, we will end the onCreateDialog function by returning with our new AlertDialog.
  • Call for the custom AlertDialog from the main method. You will need to call upon your function from elsewhere, such as the main method of your application. For this example, we will call this public function customAlertDialogExample which will take in a View object.
  • Tips

    • The SDK will note if something cannot be invoked indicated by red text. Clicking on the text will have the SDK prompt you to import the corresponding library to add to your project. Hold Alt+ Enter to add the library to your project.

    Sources and Citation