Show Simple Pop-up Menu in Android

Previously, we see how to show a list view in a Modal popup :Show List View in Model pop-up on Button click in Android. The appearnce and feel there is very similar to what we are going to implement is this article

In this article we are going to implement pop-up menus on button click.

Android Popup Menu displays the menu below the anchor text if space is available otherwise above the anchor text. It disappears if you click outside the popup menu.

The android.widget.PopupMenu is the direct subclass of java.lang.Object class.

Pre-Requisites:

1.       Ellipse SDK

2.       Android SDK

3.       ADT plugin

Or Android Studio and a compatible version of JAVA SDK

Install and configure the above utilities.

Now create a new Android project namely “PopupMenu”.

Add Widgets to our GUI:

Now, we need to add views in our view groups, i.e. add widgets to our GUI. We just need a button widget for our app’s GUI

For this, navigate to res/Layout/main.xml from package explorer in Eclipse. Open main.xml

Add following code into it:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:paddingBottom="@dimen/activity_vertical_margin"

    android:paddingLeft="@dimen/activity_horizontal_margin"

    android:paddingRight="@dimen/activity_horizontal_margin"

    android:paddingTop="@dimen/activity_vertical_margin"

    tools:context=".MainActivity" >

    <Button 

        android:id="@+id/showpopup" 

        android:layout_width="wrap_content" 

        android:layout_height="wrap_content"  

        android:text="Show Popup" />

</RelativeLayout>

Add a Pop- up Menu Layout:

Now, we need to create our menu Layout. It contains three items as show below. It is created inside the res/menu directory. Name it popup_menu.xml

<?xml version="1.0" encoding="utf-8"?>

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

        <item 

        android:id="@+id/java" 

        android:title="Java"/> 

    <item 

        android:id="@+id/cplus" 

        android:title="C++"/> 

    <item 

        android:id="@+id/python" 

        android:title="Python"/> 

</menu>

Showing Pop-up menu on Button Click:

To add behavior to our app we need to show popup menu on button click

So we implement actions on button click by OnClickListener().

So our final code for  mainActivity class will look like this:

package com.example.popupmenu;

import android.os.Bundle;

import android.app.Activity;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

import android.view.View.OnClickListener;

import android.widget.Button;

import android.widget.PopupMenu;

import android.widget.Toast;

public class MainActivity extends Activity {

      Button showpop;

      protected void onCreate(Bundle savedInstanceState) {

            super.onCreate(savedInstanceState);

            setContentView(R.layout.activity_main);

            showpop = (Button) findViewById(R.id.showpopup);

            showpop.setOnClickListener(new OnClickListener() {

                  public void onClick(View v) {

                        // Create instance of PopupMenu

                        PopupMenu popup = new PopupMenu(MainActivity.this, showpop);

                        // Inflating the Popup using Xml file

                              popup.getMenuInflater().inflate(R.menu.popup_menu,popup_menu.getMenu();

                        // registering popup with OnMenuItemClickListener

                        popup.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {

                              @Override

                              public boolean onMenuItemClick(MenuItem item) {

                                    // Show selected item in a Toast

                                    Toast.makeText(MainActivity.this,

                                                item.getTitle() + " is Selected",

                                                Toast.LENGTH_SHORT).show();

                                    return true;

                              }

                        });

                        // showing popup menu

                        popup.show();

                  }

            });

      }

      public boolean onCreateOptionsMenu(Menu menu) {

            // Inflate the menu; this adds items to the action bar if it is present.

            getMenuInflater().inflate(R.menu.main, menu);

            return true;

      }

}

Running our application:

Our app will look like:

Now click on “Show Popup” Button, a popup menu is appeared consists of menu items

Selecting any item results a Toast message showing your selected item.

Next we will see how to implement search functionality in list view : Simple Search implementation in android

Thanks for reading this post.

Happy Coding!! J