Android custom menus use PopupWindow to implement various menu Effects

With the continuous development of android mobile phones, menus can be implemented on android phones in a variety of ways, and different developers can achieve different effects. To call menus on android phones, there are also a variety of ways to call menus. Here we will list three types of menu calling methods:

1. Use the "more" button on the ActionBar to call the menu (the level-2 menu directory is defined in the "file" project ),

2. Custom button call menu,

3. Call the menu by pressing the "menu" button on the mobile phone. Some mobile phones may not have this button. Two menu lists are displayed in the figure. One is the custom menu list, one is the list of menus added using the System Menu. In the onMenuOpened () method, set the corresponding return value (true/false) to control whether to open the menu list,

The above three types of menus are shown as my summary methods. Of course, there are many other methods that can be implemented. The specific implementation effect depends on the specific needs.

Next let's take a look at how to implement it. First, define the menu list layout file res/menu/main. xml on an ActionBar. If this file or folder is not available, you can create it yourself.

<Menu xmlns: android = "http://schemas.android.com/apk/res/android"> <item android: id = "@ + id/action_settings" android: orderInCategory = "100" android: showAsAction = "always" android: icon = "@ drawable/ic_menu_overflow"> <menu> <item android: id = "@ + id/action_edit" android: showAsAction = "always" android: icon = "@ drawable/ic_edit" android: title = "@ string/edit_text"/> <item android: id = "@ + id/action_file" android: show AsAction = "always" android: icon = "@ drawable/ic_menu_file" android: title = "@ string/file"> <! -- File Level 2 Directory --> <menu> <item android: id = "@ + id/action_share" android: showAsAction = "always" android: icon = "@ drawable/ic_menu_assist_holo_light" android: title = "@ string/share"/> <item android: id = "@ + id/action_favorite" android: showAsAction = "always" android: icon = "@ drawable/ic_menu_star_holo_light" android: title = "@ string/favorite"/> </menu> </item> <item android: id = "@ + id/action_about" android: showAsAction = "always" android: icon = "@ drawable/ic_menu_about" android: title = "@ string/about"/> </menu> </item> </menu>

The first Item is used to place the entry on the ActionBar, through which the menu bar we define can be called;

Attribute introduction:

• ShowAsAction: sets the menu display mode in the ActionBar.
• Icon: icon on item
• Title: Text Information
  

Then we need to customize a drop-down menu layout File

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="vertical"    android:background="@drawable/bitmap_book_read_chapterlist_repeat" >    <TextView         android:id="@+id/textview_edit"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:drawableLeft="@drawable/ic_edit"        android:text="@string/edit_text"        android:gravity="center_vertical"        android:textColor="#ff0000"/>    <TextView         android:id="@+id/textview_file"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:drawableLeft="@drawable/ic_menu_file"        android:text="@string/file"        android:gravity="center_vertical"        android:textColor="#ff0000"/>    <TextView         android:id="@+id/textview_about"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:drawableLeft="@drawable/ic_menu_about"        android:text="@string/about"        android:gravity="center_vertical"        android:textColor="#ff0000"/></LinearLayout>

The layout file briefly introduces the content, sets a background for the entire view, defines three textviews to display the menu content, and implements three button click events in the java code.

Then, I implemented a progressive animation effect on the custom drop-down menu, and the code is very simple.

Progressively add the animation popup_window_enter.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android">    <translate android:fromYDelta="100%p" android:toYDelta="0" android:duration="1000"/>    <alpha android:fromAlpha="0" android:toAlpha="1.0" android:duration="1000"/></set>

Out-of-box animation popup_window_exit.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android">    <translate android:fromXDelta="0" android:toXDelta="100%p" android:duration="1000"/>    <alpha android:fromAlpha="1.0" android:toAlpha="0" android:duration="1000"/></set>

The following introduces the topic. How to Implement the entire menu effect in the Code MainActivity. java

Package com. example. menutype; import android. app. actionBar. layoutParams; import android. app. activity; import android. content. context; import android. OS. bundle; import android. view. gravity; import android. view. layoutInflater; import android. view. menu; import android. view. menuItem; import android. view. view; import android. view. view. onClickListener; import android. widget. button; import android. widget. popupWindow; Import android. widget. popupWindow. onDismissListener; import android. widget. textView; import android. widget. toast;/***** @ author tr * @ time 2014-3-10 * @ description custom menu, drop-down menu style, add animation effect, override onMenuOpened () method, custom "menu" shortcut menu */public class MainActivity extends Activity implements OnClickListener {private static Toast mToast; private static Context mContext; private PopupWindow popupWindow; private Button bt N_popupwindow; private View mPopupWindowView; @ Overrideprotected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. activity_main); mContext = this; btn_popupwindow = (Button) findViewById (R. id. btn_popupwindow); btn_popupener extends setonclicklistener (this); initPopupWindow () ;}@ Overridepublic boolean onCreateOptionsMenu (Menu menu) {/** more buttons on actionBar */getMenuI Nflater (). inflate (R. menu. main, menu);/** click menu to bring up the four parameters of the menu * // *** add () method, which are: ** 1, group, if it is not grouped, write Menu. NONE, ** 2, Id, which is very important. Android determines different menus based on this Id. ** 3. Order, the menu is now determined by the size of this parameter ** 4. Text, text displayed in the menu */menu. add (Menu. NONE, Menu. FIRST + 1, 1, getResource (R. string. edit_text )). setIcon (R. drawable. ic_edit); // setIcon () method is used to set the menu icon. Here, the built-in icons are used. resources starting with R are provided by the system. The resources we provide ourselves are menus starting with R. add (Menu. NONE, Menu. FIRST + 2, 2, getResource (R. string. file )). setIcon (R. drawable. ic_menu_file); menu. add (Menu. NONE, Menu. FIRST + 3, 3, getResource (R. string. about )). setIcon (R. drawable. ic_menu_about); return true;}/** call */@ Overridepublic boolean onMenuOpened (int featureId, Menu menu) when the Menu is opened) {// TODO Auto-generated method stubshowToast ("menu open:" + featureId); // click "menu" to open if (featureId = 0) {showPopupWindow ();} retur N super. onMenuOpened (featureId, menu); // if true is returned, the System menu/return false is displayed;}/** call */@ Overridepublic void onOptionsMenuClosed (menu Menu) when the menu is closed) {// TODO Auto-generated method stubsuper. onOptionsMenuClosed (menu); showToast ("menu closed") ;}@ Overridepublic boolean onOptionsItemSelected (MenuItem item) {// TODO Auto-generated method stubswitch (item. getItemId () {case Menu. FIRST + 1: case R. id. action_edit: showT Oast (getResource (R. string. edit_text); break; case Menu. FIRST + 2: case R. id. action_file: showToast (getResource (R. string. file); break; case R. id. action_favorite: showToast (getResource (R. string. favorite); break; case R. id. action_share: showToast (getResource (R. string. share); break; case Menu. FIRST + 3: case R. id. action_about: showToast (getResource (R. string. about); break;} return super. onOptionsItemSelected (item) ;}@ Overridepublic void onClick (View v) {switch (v. getId () {case R. id. btn_popupwindow: showPopupWindow (); break; case R. id. textview_about: showToast (getResource (R. string. about); popupWindow. dismiss (); break; case R. id. textview_edit: showToast (getResource (R. string. edit_text); popupWindow. dismiss (); break; case R. id. textview_file: showToast (getResource (R. string. file); popupWindow. dismiss (); break;}/** display popupwi Ndow */private void showPopupWindow () {if (! PopupWindow. isShowing () {popupWindow. showAsDropDown (btn_popupwindow, btn_popup1_getlayoutparams (). width/2, 0);} else {popupWindow. dismiss () ;}}/*** initialize popupwindow */private void initPopupWindow () {initPopupWindowView (); // initialize popupwindow and bind the display view, set the width/height of the view to popupWindow = new PopupWindow (mPopupWindowView, LayoutParams. WRAP_CONTENT, LayoutParams. WRAP_CONTENT); popupWindow. setFocusable (true); popupWindow. setOutsideTouchable (true); // you can click Back to disappear without affecting your background, to close the form popupWindow. setBackgroundDrawable (getResources (). getDrawable (R. drawable. bitmap_book_read_chapterlist_repeat); // The Background cannot be set to null. dismiss will become invalid // popupWindow. setBackgroundDrawable (null); // you can specify the gradient and animation effect. // popupWindow. setAnimationStyle (R. style. popupwindow); popupWindow. update (); // popupWindow is triggered when dismiss is called. setOutsideTouchable (true) is set. popupWindow is triggered when you click the back button outside of view. setOnDismissListener (new OnDismissListener () {@ Overridepublic void onDismiss () {// TODO Auto-generated method stub // showToast ("Close popupwindow ");}});} /*** initialize popupwindowView and listen to the textview click event in the view */private void initPopupWindowView () {mPopupWindowView = LayoutInflater. from (mContext ). inflate (R. layout. popupwindowmenu, null); TextView textview_edit = (TextView) mPopupWindowView. findViewById (R. id. textview_edit); textview_edit.setOnClickListener (this); TextView textview_file = (TextView) mPopupWindowView. findViewById (R. id. textview_file); textview_file.setOnClickListener (this); TextView textview_about = (TextView) mPopupWindowView. findViewById (R. id. textview_about); textview_about.setOnClickListener (this);}/** get string. xml resource */public String getResource (int id) {return getResources (). getString (id);}/** Toast Singleton mode */public static Toast getInstance () {if (mToast = null) {mToast = Toast. makeText (mContext, "", Toast. LENGTH_LONG); mToast. setGravity (Gravity. CENTER, 0, 0);} return mToast;}/** display toast */public void showToast (String str) {Toast toast = getInstance (); toast. setText (str); toast. show ();}}

Source code, click to download