MrBool
You must be logged in to give feedback. Click here to login
[Close]

You must be logged to download.

Click here to login

[Close]

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

[Close]

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

How to Implement Popup Window in Android

In this article we will learn about the popup window and how to implement it in Android Applications.

[close]

You didn't like the quality of this content?

Would you like to comment what you didn't like?

Introduction:

Popup window is like a dialog box that gains complete focus when it appears on screen. Like the activity popup also has its own GUI which the android developer can design.

Popup appears in front of activity and gains focus. Popup are usually used to show some additional information or something user wants to know after an event takes place.

Objective:

  • To provide knowledge of how and where to use Popup Windows.
  • To provide knowledge of PopupWindow class.
  • Customizing the GUI of popup window.
  • Understanding of LayoutParams Class.

What is Popup Window:

Popup window is defined as a window that appears in front of your activity on the screen after certain event takes place or certain terms and conditions matched. This window is usually used to display some information and provide controls to perform operations. Popup window also have their own GUI which must be set in its content view.

Popup Window Class:

To display popup window in android, PopupWindow class is used that comes from the android.widget.PopupWindow package and the view of popup window is incorporated in it either through java coding at run time or by inflating layout in it. Popup Window must be called in an activity and it appears over the activity and gains the entire focus.

This PopupWindow class has following Methods:

void dismiss(): 

This method vanishes the popup window displaying.

void update(int widthPopup, int heightPopup): 

This method updates the dimensions of the popup window from current dimensions to dimensions specified in the arguments of this method.

void setAnimationStyle(int resourceIdforAnimation):

This method sets the animation style to display the popup window above the Activity ,i. e., how the popup window appears on the screen. It will take id of XML file stored in anim folder under res directory.

Boolean isFocusable() :

This method is returns true if the popup window is focusable else returns false.

Boolean isTouchable:

This method returns true if the user can perform touch operations on popup window else it returns false.

void setContentView(View anyView):

This method sets a particular view as the GUI of the popup window.

void showAsDropDown(View viewInActivity,int xOffset, int yOffset):

This method will display popup window on bottom left corner of the view specified in first argument with a specified offset distance on both axis specified by remaining two arguments.

void showAtLocation(View viewinActivity,Gravity gravitymode,int xOffset,int yOffset):

This method displays the popup on view specified in argument 1 with specified gravity and initial offset defined by remaining arguments.

void setHeight(int newHeight):

This method sets the new height of popup window in pixels.

void setWidth(int newWidth):

This method sets the new width of popup window in pixels.

void setBackgroundDrawable(int resourceIDDrawable):

This method sets the image as popup window background that has specified id in resource file.

int getWidth():

This method gets the width of popup window.

int getHeight():

This method gets the height of popup window.

View getContentView():

This method gets the view that is inflated as GUI of popup window.

Drawable getBackground():

This method gets the background image as drawable that is used as background of popup window.

int getAnimationStyle():

This method is used to get the animation style, i.e., the resource animation XML file that is used as appearing animation style of popup window.

LayoutParams Class:

LayoutParams class comes from the package android.view.viewgroup.LayoutParams package.LayoutParams class defines some constants to describe the dimension of various views.

This class includes following constants:

  • FILL_PARENT - Numeric value = -1
  • WRAP_CONTENT - Numeric value = -2
  • MATCH_PARENT - Numeric value = -1 (Introduced after api level 8)

This class represents fields like height and width of various views and all these constants are used by using class name. For e.g. :

LayoutParams.WRAP_CONTENT

Step Involved in making a project on Popup Window:

Step 1: Make a new android project PopupDemo in Eclipse and create a package named com.nkm.popup in it.

Note: name of project, package and files can be given according to the user choice. But make modification accordingly to remove errors, if any.

Step 2:

Listing 1: Create an XML file main.xml if not already created in layout folder and paste the following code:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="56dp"
        android:text="Popup Window will display on this Activity" />

    <Button
        android:id="@+id/popupbutton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="Show Popup" />

</RelativeLayout>

Explanation:

All the above code is self explainable and easy to understand using basic tags and attributes.

Step 3:

Listing 2: Make a Java file named PopupDemoActivity if not already created in com.nkm.thread package and paste the following code:

package com.nkm.popup;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup.LayoutParams;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.PopupWindow;
import android.widget.TextView;

public class PopupDemoActivity extends Activity implements OnClickListener {
	LinearLayout layoutOfPopup;
	PopupWindow popupMessage;
	Button popupButton, insidePopupButton;
	TextView popupText;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		init();
		popupInit();
	}

	public void init() {
		popupButton = (Button) findViewById(R.id.popupbutton);
		popupText = new TextView(this);
		insidePopupButton = new Button(this);
		layoutOfPopup = new LinearLayout(this);
		insidePopupButton.setText("OK");
		popupText.setText("This is Popup Window.press OK to dismiss         it.");
		popupText.setPadding(0, 0, 0, 20);
		layoutOfPopup.setOrientation(1);
		layoutOfPopup.addView(popupText);
		layoutOfPopup.addView(insidePopupButton);
	}

	public void popupInit() {
		popupButton.setOnClickListener(this);
		insidePopupButton.setOnClickListener(this);
		popupMessage = new PopupWindow(layoutOfPopup, LayoutParams.FILL_PARENT,
				LayoutParams.WRAP_CONTENT);
		popupMessage.setContentView(layoutOfPopup);
	}

	@Override
	public void onClick(View v) {

		if (v.getId() == R.id.popupbutton) {
			popupMessage.showAsDropDown(popupButton, 0, 0);
		}

		else {
			popupMessage.dismiss();
		}
	}
}

Explanation:

The above code will display a screen which shows a text written and a button which will show a popup window when clicked.

The popup window includes a text written along with a button, pressing that button will dismiss popup window.

Define Class:

public class PopupDemoActivity extends Activity implements OnClickListener

The above line describes that onClickListener is implemented for click events.

Listing 3: The init() method :

public void init() {
		popupButton = (Button) findViewById(R.id.popupbutton);
		popupText = new TextView(this);
		insidePopupButton = new Button(this);
		layoutOfPopup = new LinearLayout(this);
		insidePopupButton.setText("OK");
		popupText.setText("This is Popup Window.press OK to dismiss         it.");
		popupText.setPadding(0, 0, 0, 20);
		layoutOfPopup.setOrientation(1);
		layoutOfPopup.addView(popupText);
		layoutOfPopup.addView(insidePopupButton);
	}

The init() method is user defined method which is is used to define a dynamic layout having two views button and a text.

Here setOrientation method accepts 1 as argument which means orientation is vertical.

addView method is used to add TextView and Button inside the LinearLayout that acts as a container.

Listing 4: The popupInit() method :

public void popupInit() {
		popupButton.setOnClickListener(this);
		insidePopupButton.setOnClickListener(this);
		popupMessage = new PopupWindow(layoutOfPopup, LayoutParams.FILL_PARENT,
				LayoutParams.WRAP_CONTENT);
		popupMessage.setContentView(layoutOfPopup);
	}

In this method, the layout created is set as content in popup window and it’s height and width is set by LayoutParams class.

Listing 5: In this method, the buttons are registered with OnClickListener interface.

@Override
	public void onClick(View v) {

		if (v.getId() == R.id.popupbutton) {
			popupMessage.showAsDropDown(popupButton, 0, 0);
		}

		else {
			popupMessage.dismiss();
		}
	}

The above is the code for overridden method of onClickListener that includes if else condition that checks which button is pressed.

If condition specifies that the button of activity is clicked and the popup will be displayed. The statement in the if block specify this. showAsDropDown will show popup as dropdown at bottom of popupButton.

Else condition specifies that the button of popup window is clicked and it will dismiss or dispose the popup window. The statement popupMessage.dismiss() is used for this purpose.

Snapshots:

Screen 1

Figure 1: Screen 1

Screen 2

Figure 2: Screen 2

What is Covered?

  • How and where to use popup window.
  • Understanding of PopupWindow class.
  • Understanding of LayoutParams class.
  • Customizing the design of popup window.


Have more than 5 years experience about Java, .Net, C and C++.

What did you think of this post?
Services
Know how to keep MrBool Online
SUPPORT US
SUPPORT US
With your help, we can keep providing free content and helping you to be a better professional
support us
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually � in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits � in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login