Using the PopupWindow class in Android apps
I need to display some data in a popup window in an Android app. After a brief search on the web I decided to go with the PopupWindow class, but I couldn’t find any good example of how to use it.
There seems to be a lot of questions out on the web about how to work with the PopupWindow, so I thought I should post an example showing how I solved it under Android 2.2 (Froyo).
Create a layout for your PopupWindow
Create an XML layout file that defines the PopupWindow UI just as you do for other UI’s like activities. The only thing to think about here is that the first container element that you define (LinearLayout, AbsoluteLayout etc) needs to have an id defined, as we need to reach it from code later on.
For reference this is how the layout for my PopupWindow is defined, it’s created in a file named popup_layout.xml. You can see the id on the LinearLayout element on row 2 (popup_element).
After this is done, it’s time to write some code.
Initiating and creating the PopupWindow
At first we need to initialize the layout, and for that we need to inflate it, then we use it to create our PopupWindow, after that all we need to do is show it.
private PopupWindow pw;
private void initiatePopupWindow() {
try {
//We need to get the instance of the LayoutInflater, use the context of this activity
LayoutInflater inflater = (LayoutInflater) ConfirmActivity.this
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
//Inflate the view from a predefined XML layout
View layout = inflater.inflate(R.layout.popup_layout,
(ViewGroup) findViewById(R.id.popup_element));
// create a 300px width and 470px height PopupWindow
pw = new PopupWindow(layout, 300, 470, true);
// display the popup in the center
pw.showAtLocation(layout, Gravity.CENTER, 0, 0);
mResultText = (TextView) layout.findViewById(R.id.server_status_text);
Button cancelButton = (Button) layout.findViewById(R.id.end_data_send_button);
makeBlack(cancelButton);
cancelButton.setOnClickListener(cancel_button_click_listener);
} catch (Exception e) {
e.printStackTrace();
}
}
private OnClickListener cancel_button_click_listener = new OnClickListener() {
public void onClick(View v) {
pw.dismiss();
}
};On row 8-9 you can see the inflater being called to create the layout. Take care when defining the parameters here, the first one is the reference to the layout xml file, the second parameter is the reference to the id of the element in that file that you want to use as root node for the created PopupWindow.
Then just call the initiatePopupWindow from whatever piece of code you need to trigger the PopupWindow from.
Referencing elements in the PopupWindow
If you want to reference elements in the PopupWindow that you have created, you need to use the layout that was used when creating that window. You can see how I store references to the result text for later use, and define the cancel button and set it’s OnClickListener on rows 15, 16 and 18.
Good luck and happy coding!
More ways to show information to users in Android
You can also use the AlertDialog window, check out this article for an example.
Awesome post on the PopupWindow class!
I’ve been looking at a lot of examples and how-to’s on the web and none explained it as good as your article.
For those needing a popup window I really recommend this post
Cheers,
Burt
Thx!
Yeah I had the same problem myself at first, no real good examples of the PopupWindow that explained the entire procedure.
/A
Short and Nice
Great example of Android’s PopupWindow class, well worth the read!
/Cheers
Thanks!
Nice writeup on the popup windows class!
Great of the popup window write!
Great post about popupwindow, thanks!
Yw
Thank you very much for your post….. it helped me a lot….
Glad to hear that, good luck!
Hi! I need your help. I try to create a popup window with a Text Edit inside them. But when a touch the Text Edit, the app cash. I think that is because i dont set the context correctly.
What does the exception say?
android.view.WindowManager$BadTokenException: Unable to add window — token android.view.ViewRoot$W@44767fc8 is not valid; is your activity running?
What does your view creation look like and what’s the name of your Activity?
See this post.
http://stackoverflow.com/questions/4829718/exception-when-focusing-a-edittext-in-a-popupwindow-running-on-device/5820571#5820571
My solution was create my own popup.
Reading that thread makes me belive it’s a bug in the framework.
Are you running on a tab as well?
No, i run in a Galaxy Europa.
you set popup window focus before showing that
If it’s a question then no, I didn’t do that.
Is it possible to hidden the layout under a popup window?
my problem is: I have an image in main activity and when I click on it, the popup is shown, but I can see some part of the image that is in background, can I hide that layout? if yes, how?
thanks
Have you tried setting the dim amount and blur behind flag?
I used that technique in this article about using AlertDialog: http://www.mobilemancer.com/2011/01/22/using-alertdialog-as-popup-notifier/
Hey,
Thanks for this awesome post, it realy helped me alot!
I’m trying to create a PopUp Window with a Spinner in it.
It Pops up fine, and every button works, but when I Click on the Spinner, the App forcecloses.
Is there anyway I can realize a Popup window including a Spinner?
Hi,
As far as I know there shouldn’t be a problem using a Spinner on a PopUp.
Sounds more like something might be wrong with the Spinner setup, check LogCat and see if you are getting an exception and what it says?
Thanks a lot Bro.
I went to many blogs and tried a lot of stuff but what I really need was in your post.
Glad to have helped!
Hi, nice example.
I would just add something i found usefull : make the view autosize.
layout.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
pw = new PopupWindow(layout, layout.getMeasuredWidth(), layout.getMeasuredHeight(), true);
Thanks for the comment, I’ll add to the code as soon as I get a few minutes spare
Happy coding!
Nice example. Thanks a lot.
You might also add this:
myPopup.setBackgroundDrawable(new BitmapDrawable());before showing the popup.
It allows the user to close the popup via backpress