Android

Alert DialogBox in Android

Dialog Boxes are mainly used for showing some information to the user. This information may be related to a specific task or to an error or it may be some kind of general information.

Now we move to the codie part of this article.

First of all we create an XML file for our project. We are using two Activities in this project. Our first activity is activity_main.xml.

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:paddingBottom="@dimen/activity_vertical_margin"  
  6.     android:paddingLeft="@dimen/activity_horizontal_margin"  
  7.     android:paddingRight="@dimen/activity_horizontal_margin"  
  8.     android:paddingTop="@dimen/activity_vertical_margin"  
  9.     tools:context=".MainActivity" >  
  10.   
  11.     <TextView  
  12.         android:id="@+id/textView1"  
  13.         android:layout_width="wrap_content"  
  14.         android:layout_height="wrap_content"  
  15.         android:text="@string/hello_world" />  
  16.   
  17.     <Button  
  18.         android:id="@+id/button1"  
  19.         android:layout_width="wrap_content"  
  20.         android:layout_height="wrap_content"  
  21.         android:layout_below="@+id/textView1"  
  22.         android:layout_centerHorizontal="true"  
  23.         android:layout_marginTop="64dp"  
  24.         android:text="@string/button1" />  
  25.   
  26.     <Button  
  27.         android:id="@+id/button2"  
  28.         android:layout_width="wrap_content"  
  29.         android:layout_height="wrap_content"  
  30.         android:layout_alignLeft="@+id/button1"  
  31.         android:layout_below="@+id/button1"  
  32.         android:layout_marginTop="28dp"  
  33.         android:text="@string/button2" />  
  34.   
  35.     <Button  
  36.         android:id="@+id/button3"  
  37.         android:layout_width="wrap_content"  
  38.         android:layout_height="wrap_content"  
  39.         android:layout_alignLeft="@+id/button2"  
  40.         android:layout_below="@+id/button2"  
  41.         android:layout_marginTop="30dp"  
  42.         android:text="@string/button3" />  
  43.   
  44. </RelativeLayout>  
Graphical Layout of Activity

Graphical Layout of Activity

In the preceding code we use a Relative Layout. In this Layout we use a TextView. In this TextView we will show some text in the activity. We also use 3 buttons in this activity. Using these 3 buttons we will show 3 types of Alert Dialog Boxes. On click of the “Alert Type 1“ button we will show a simple Dialog Box with a single option. On the click of the “Alert Type 2” button we will show a dialog box that have two options. Finally on the click of “Alert Type 3” we will show a dialog box that contains a ListView. This ListView is present in the menu_detail_fragment activity. Now we move to our second activity.

menu_detail_fragment.xml
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:orientation="vertical"  
  4.     android:layout_width="match_parent"  
  5.     android:gravity="center"  
  6.     android:background="#5ba4e5"  
  7.     android:layout_height="match_parent">  
  8.      <ListView  
  9.         android:id="@+id/listView1"  
  10.         android:layout_width="match_parent"  
  11.         android:layout_height="wrap_content"  
  12.       android:layout_marginTop="25dp" >  
  13.     </ListView>  
  14.   
  15. </LinearLayout>  
Graphical Layout

Graphical Layout

In this ListView we will insert some data and show this ListView using a dialog box.

Now we move to the source code of this project.

The following  is the source code:
  1. public class MainActivity extends Activity {  
  2.   
  3.     Button B1, B2, B3;  
  4.     ArrayAdapter < String > adapter;@Override  
  5.     protected void onCreate(Bundle savedInstanceState) {  
  6.         super.onCreate(savedInstanceState);  
  7.         setContentView(R.layout.activity_main);  
  8.   
  9.         B1 = (Button) findViewById(R.id.button1);  
  10.         B2 = (Button) findViewById(R.id.button2);  
  11.         B3 = (Button) findViewById(R.id.button3);  
  12.   
  13.   
  14.   
  15.         B1.setOnClickListener(new View.OnClickListener() {  
  16.   
  17.             @Override  
  18.             public void onClick(View arg0) {  
  19.                 // TODO Auto-generated method stub  
  20.   
  21.                 final AlertDialog alertDialog = new AlertDialog.Builder(MainActivity.this).create();  
  22.                 alertDialog.setTitle("Alert Dialog");  
  23.                 alertDialog.setMessage("Welcome to My Device");  
  24.                 alertDialog.setIcon(R.drawable.icon_smile);  
  25.   
  26.                 alertDialog.setButton("OK", new DialogInterface.OnClickListener() {  
  27.                     public void onClick(DialogInterface dialog, int which) {  
  28.   
  29.                         Toast.makeText(getApplicationContext(), "You clicked on OK", Toast.LENGTH_SHORT).show();  
  30.   
  31.                     }  
  32.                 });  
  33.   
  34.                 alertDialog.show();  
  35.   
  36.             }  
  37.         });  
  38.   
  39.         B2.setOnClickListener(new View.OnClickListener() {  
  40.   
  41.             @Override  
  42.             public void onClick(View arg0) {  
  43.                 // TODO Auto-generated method stub  
  44.                 //alertDialog.setButton2(text, listener)  
  45.                 AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);  
  46.                 alertDialog.setTitle("Alert Dialog");  
  47.                 alertDialog.setMessage("Welcome to DZone");  
  48.                 alertDialog.setIcon(R.drawable.icon_smile);  
  49.   
  50.                 alertDialog.setPositiveButton("YES", new DialogInterface.OnClickListener() {  
  51.                     public void onClick(DialogInterface dialog, int which) {  
  52.                         Toast.makeText(getApplicationContext(), "You clicked on YES", Toast.LENGTH_SHORT).show();  
  53.                     }  
  54.                 });  
  55.   
  56.                 alertDialog.setNegativeButton("NO", new DialogInterface.OnClickListener() {  
  57.                     public void onClick(DialogInterface dialog, int which) {  
  58.                         Toast.makeText(getApplicationContext(), "You clicked on NO", Toast.LENGTH_SHORT).show();  
  59.                     }  
  60.                 });  
  61.   
  62.                 alertDialog.show();  
  63.             }  
  64.         });  
  65.   
  66.         B3.setOnClickListener(new View.OnClickListener() {  
  67.   
  68.             @Override  
  69.             public void onClick(View arg0) {  
  70.                 // TODO Auto-generated method stub  
  71.                 AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);  
  72.                 alertDialog.setTitle("Alert Dialog");  
  73.                 alertDialog.setMessage("Welcome to My Device");  
  74.                 alertDialog.setIcon(R.drawable.icon_smile);  
  75.   
  76.   
  77.                 final String names[] = {  
  78.                     "Item1", "Item2", "Item3", "Item4"  
  79.                 };  
  80.                 // AlertDialog.Builder alertDialog2 = new AlertDialog.Builder(MainActivity.this);  
  81.                 LayoutInflater inflater = getLayoutInflater();  
  82.                 View convertView = (View) inflater.inflate(R.layout.menu_detail_fragment, null);  
  83.                 alertDialog.setView(convertView);  
  84.                 alertDialog.setTitle("List");  
  85.                 ListView lv = (ListView) convertView.findViewById(R.id.listView1);  
  86.                 adapter = new ArrayAdapter < String > (MainActivity.this, android.R.layout.simple_list_item_1, names);  
  87.                 lv.setAdapter(adapter);  
  88.                 alertDialog.show();  
  89.   
  90.                 lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {  
  91.   
  92.                     @Override  
  93.                     public void onItemClick(AdapterView <? > parent, View view,  
  94.                     int position, long id) {  
  95.                         Toast.makeText(MainActivity.this, "You Clicked at " + names[+position], Toast.LENGTH_SHORT).show();  
  96.   
  97.                     }  
  98.                 });  
  99.             }  
  100.         });  
  101.   
  102.     }  
  103.   
  104.   
  105. }  
Now I will explain the preceding code in the following code sections for a better understanding.

Code Section 1
  1. B1.setOnClickListener(new View.OnClickListener() {  
  2.   
  3.     @Override  
  4.     public void onClick(View arg0) {  
  5.         // TODO Auto-generated method stub  
  6.   
  7.         final AlertDialog alertDialog = new AlertDialog.Builder(MainActivity.this).create();  
  8.         alertDialog.setTitle("Alert Dialog");  
  9.         alertDialog.setMessage("Welcome to My Device");  
  10.         alertDialog.setIcon(R.drawable.icon_smile);  
  11.   
  12.         alertDialog.setButton("OK", new DialogInterface.OnClickListener() {  
  13.             public void onClick(DialogInterface dialog, int which) {  
  14.   
  15.                 Toast.makeText(getApplicationContext(), "You clicked on OK", Toast.LENGTH_SHORT).show();  
  16.   
  17.             }  
  18.         });  
  19.   
  20.         alertDialog.show();  
  21.   
  22.     }  
  23. });  
In the preceding code we set an OnClick event for the “Alert Type 1” button. This event will occur when a user clicks on the “Alert Type 1” button. In the preceding code we create an object of AlertDialog class using the Builder method. Then we set the title, message and Icon for the Alert Dialog Box. Using the setButton method we set the type of button that will be shown in the dialog box. We also set an OnClick event for this button. When a person clicks on the “OK” button we will show some text using the Toast.makeText method.

We can see that setButton is not showing in a proper way (crossed by a line). The reason is that the setButton method only works in older versions of an Android device. In the new version of Android devices we use another method instead of setButton.

When a person clicks on the “Alert Type 1” button, the following action will be performed.

clock ok

Alert Type 1

Code Section 2
  1. B2.setOnClickListener(new View.OnClickListener() {  
  2.   
  3.     @Override  
  4.     public void onClick(View arg0) {  
  5.         // TODO Auto-generated method stub  
  6.         //alertDialog.setButton2(text, listener)  
  7.         AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);  
  8.         alertDialog.setTitle("Alert Dialog");  
  9.         alertDialog.setMessage("Welcome to DZone");  
  10.         alertDialog.setIcon(R.drawable.icon_smile);  
  11.   
  12.         alertDialog.setPositiveButton("YES", new DialogInterface.OnClickListener() {  
  13.             public void onClick(DialogInterface dialog, int which) {  
  14.                 Toast.makeText(getApplicationContext(), "You clicked on YES", Toast.LENGTH_SHORT).show();  
  15.             }  
  16.         });  
  17.   
  18.         alertDialog.setNegativeButton("NO", new DialogInterface.OnClickListener() {  
  19.             public void onClick(DialogInterface dialog, int which) {  
  20.                 Toast.makeText(getApplicationContext(), "You clicked on NO", Toast.LENGTH_SHORT).show();  
  21.             }  
  22.         });  
  23.   
  24.         alertDialog.show();  
  25.     }  
  26. });  
This code will work the same as I explained in the previous code. Instead of a single button we use two buttons (Yes and No) and create an OnClick event for each button. Instead of the setButton method we use the setPositiveButton method for showing the “Yes” option and the setNegativeButton method for showing the “No” option in the dialog box.

alter dialog

setNegativeButton

Code Section 3
  1. B3.setOnClickListener(new View.OnClickListener() {  
  2.   
  3.     @Override  
  4.     public void onClick(View arg0) {  
  5.         // TODO Auto-generated method stub  
  6.         AlertDialog.Builder alertDialog = new AlertDialog.Builder(MainActivity.this);  
  7.         alertDialog.setTitle("Alert Dialog");  
  8.         alertDialog.setMessage("Welcome to My Device");  
  9.         alertDialog.setIcon(R.drawable.icon_smile);  
  10.   
  11.   
  12.         final String names[] = {  
  13.             "Item1", "Item2", "Item3", "Item4"  
  14.         };  
  15.         // AlertDialog.Builder alertDialog2 = new AlertDialog.Builder(MainActivity.this);  
  16.         LayoutInflater inflater = getLayoutInflater();  
  17.         View convertView = (View) inflater.inflate(R.layout.menu_detail_fragment, null);  
  18.         alertDialog.setView(convertView);  
  19.         alertDialog.setTitle("List");  
  20.         ListView lv = (ListView) convertView.findViewById(R.id.listView1);  
  21.         adapter = new ArrayAdapter < String > (MainActivity.this, android.R.layout.simple_list_item_1, names);  
  22.         lv.setAdapter(adapter);  
  23.         alertDialog.show();  
  24.   
  25.         lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {  
  26.   
  27.             @Override  
  28.             public void onItemClick(AdapterView <? > parent, View view,  
  29.             int position, long id) {  
  30.                 Toast.makeText(MainActivity.this, "You Clicked at " + names[+position], Toast.LENGTH_SHORT).show();  
  31.   
  32.             }  
  33.         });  
  34.     }  
  35. });  
In the preceding code we will show a ListView using a Dialog Box when someone clicks on the “Alter Type 3” button. In the preceding code we create array of string type and insert some data into this array. Using the inflate method of the getLayoutInflater class we get a reference for a menu_detail_fragment layout and insert it into a View type object. Then we get the reference of ListView into the lv object of ListView and bind the string array to a ListView using ArrayAdapter. Finally we create an OnClick event for ListView. Using this method we show the name of list item, on which a user will click. Assume we click on item number three of the ListView then the output will be the following:

list item

list

 

Up Next
    Ebook Download
    View all
    Learn
    View all
    Get Started

    You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.

    Become a sharper developer and jumpstart your career.

    Basic

    $0

    $

    . 00

    monthly

    For Basic members:

    • Standard Profile
    • Access learning courses
    • Access free e-books
    • 1x point
    Premium

    $20

    $

    . 00

    monthly

    For Premium members:

    • Earn 2x reward points
    • Premium profile with Verified check
    • Premium Avatar with status update
    • Learning courses
    • Unlimited Certifications and badges on profile
    • Unlimited Book downloads
    • Access to Premium content
    • Online Training
    • Unlimited PDF conversions and downloads
    • Professional Resume Writing
    • Interview Preparations Guide
    • 25 messages per month
    • 1 "Kodzu" avatar, basic
    Elite

    $45

    $

    . 00

    monthly

    For Elite members:

    • Bundle E-books
    • Access to all Learn Series
    • Unlimited Apply Jobs