Home > Researches, Tutorials > Creating and Displaying a Custom Dialog in Android

Creating and Displaying a Custom Dialog in Android

In this post I would like to describe the process of creating and displaying a custom dialog. Though the Android documentation describes pretty well the topic, I faced some problems implementing it, and I would like to share my findings.

The final output should look like this:

Android Custom Dialog

1. The first issue I have encountered was that I was getting a BadTokenException in the onCreateDialog() method where I was instantiating the Dialog: android.view.WindowManager$BadTokenException: Unable to add window — token null is not for an application, 

Context context=getApplicationContext();
Dialog dialog=new Dialog(context);

Well, though the Android documentation suggests to use getApplicationContext(); actually it turns out that this is not the proper way to do it and most likely it will throw an exception. The correct way is to use this, or "ActivityName".this instead of getApplicationContext(). For example:

Context context=MainActivity.this;
Dialog dialog=new Dialog(context);

 

2. The second issue I was facing was that I wanted to get rid off the standard dialog title.
Normally you would set the Dialog title with this:

dialog.setTitle("Dialog Title");

However, if you don't want to display a standard title for your dialog, not calling the above line most probably won't meet your expectations, because it will leave an empty space where the title should be.

Hopefully, this is an easy fix. Just call requestWindowFeature(Window.FEATURE_NO_TITLE); and you are done.

dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);

 

To sum up with a concrete working example, below I presented an implementation of a simple custom dialog.

custom_dialog.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="250dp"
   android:layout_height="match_parent"
   android:background="#8F1A3B"
   android:orientation="vertical" >

<TextView
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:layout_marginBottom="20dp"
   android:text="Custom Dialog"
   android:textSize="18dp" />

<Button
   android:id="@+id/restart"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:text="Restart Game" />

</LinearLayout>

 

MainActivity:


public class MainActivity extends Activity {

Dialog dialog;
int DIALOG_GAME_RESTART=100;

@Override
public void onCreate(Bundle savedInstanceState) {
   // ............
}

@Override
protected Dialog onCreateDialog(int id) {
   switch (id) {
   case DIALOG_GAME_RESTART:
     Context context=MainActivity.this;
     dialog=new Dialog(context);
     dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);

     dialog.setContentView(R.layout.custom_dialog);

     Button restart=(Button)dialog.findViewById(R.id.restart);

     restart.setOnClickListener(new OnClickListener() {
     @Override
     public void onClick(View v) {
        dialog.dismiss();

        //whatever code you want to execute on restart
     }
     });
   break;

   default: break;
   }
   return dialog;
}
}
About these ads
  1. April 16, 2012 at 9:00 pm

    this is good and simple to understand

  2. April 17, 2012 at 9:55 pm

    Reblogged this on terabytedude and commented:
    A very good tutorial.

  3. April 17, 2012 at 9:59 pm

    Nice, I like the way you cut down the code into smaller parts. Andy, you are my top liker on my blog, terabytedude.wordpress.tk, and I have decided to give you the Harry Potter Giveaway that’s happening on my blog. I’ll email you.

    • April 18, 2012 at 6:12 pm

      Wow! That sounds so cool, can’t wait to get it!

  4. Harinath
    April 18, 2012 at 1:32 am

    Hi,
    Which syntax highlighter are you using to write code into your post ? is it comes as plugin?
    I have WordPress.com free blog, how would i achieve the same as yours?
    Thanks

    • April 18, 2012 at 5:13 pm

      The syntax highlighter plugin is built in the wordpress.
      Use:
      [ sourcecode lang="java" ]
      //java code
      [ /sourcecode ]

      (Without spaces at the beginning and closing brackets)

  5. April 18, 2012 at 8:51 am

    thaks

  6. April 18, 2012 at 5:09 pm

    Very good tutorial & well written to be easily understandable. Thanks for sharing!

    • April 18, 2012 at 5:10 pm

      Thanks for appreciation Justin.

  7. April 19, 2012 at 1:26 pm

    Hi we like this site. Very well written. Love the code, //whatever code you want to execute on restart (the potential !!)

  8. cannyit
    April 19, 2012 at 8:07 pm

    this is amazing read, thank you !

  9. April 20, 2012 at 10:35 am

    Awasome view:)

    rahul@aapy

  10. April 21, 2012 at 3:46 pm

    Good work. I am designing a view engine on top of a .net wcf service. Will post it when it’s working for comments. This implementation might just make it into it

  11. youssef wagih
    April 22, 2012 at 12:06 pm

    when i open new dialog it makes the behind activity dark what can i do to make it as it is please answer me

    • April 22, 2012 at 2:54 pm

      That is because the Dialog takes the focus. If you really want to get rid of the transparent background behind the Dialog, I believe you should create your own custom dialog.
      Take a look over this Stack Overflow thread: http://stackoverflow.com/questions/3118601/how-can-i-change-the-background-of-android-alert-dialogs

      • youssef wagih
        May 6, 2012 at 4:26 pm

        can u please make a sample for that question i really need solution for that problem i want the background of the behind activity not to become dark i want it as it is but the focus will be with the dialog please make the sample :D

  12. April 22, 2012 at 6:07 pm

    Wow! :-)

  13. October 28, 2012 at 4:45 am

    thank you so much very good information and easily understandable. Thanks for sharing!

  1. March 28, 2013 at 6:30 pm
  2. April 23, 2013 at 4:02 pm

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 506 other followers

%d bloggers like this: