Android 弹框菜单系列之PopupMenu

菜单之前是用户点击系统的菜单键才展示出来的，后来这个键渐渐被移除，菜单变成了点击任意的view都可以展示。菜单非为3种：

　　1.Options menu and action bar  选项菜单和操作栏

　　2.Context menu and contextual action mode 上下文菜单和上下文动作模式

　　3.Popup menu  弹出式菜单

 

一.效果图：

 

这种的PopupMenu目前没有试过自定义布局式样，若项目中必须自定义布局的话，这个可能是有局限的

二.快速实现：

1.主函数代码：

import android.annotation.SuppressLint;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.view.menu.MenuPopupHelper;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.PopupMenu;
import android.widget.Toast;

import com.example.qd.douyinwu.R;

import java.lang.reflect.Field;

/**
 * popupMenu
 * OptionsMenu 菜单
 */
public class PopupMenu2Activity extends AppCompatActivity {
    //当前选择的menuItem的id
    private int checkedItemId = R.id.menu_setting_wifi;
    private Button popupMenu,btTest;
    private int y;
    private int x = 90;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_popupmenu2);
        popupMenu = findViewById(R.id.bt_popupmenu);
        btTest = findViewById(R.id.bt_test);
        popupMenu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showPopupMenu(v);
            }
        });

    }
    @SuppressLint("RestrictedApi")
    private void showPopupMenu(View view) {
        // 这里的view代表popupMenu需要依附的view
        PopupMenu popupMenu = new PopupMenu(PopupMenu2Activity.this, view);
        // 获取布局文件
        popupMenu.getMenuInflater().inflate(R.menu.sample_menu, popupMenu.getMenu());
        //设置选中
        popupMenu.getMenu().findItem(checkedItemId).setChecked(true);
        //使用反射。强制显示菜单图标
        try {
            Field field = popupMenu.getClass().getDeclaredField("mPopup");
            field.setAccessible(true);
            MenuPopupHelper mHelper = (MenuPopupHelper) field.get(popupMenu);
            mHelper.setForceShowIcon(true);
        } catch (Exception e) {
            e.printStackTrace();
        }

        //显示PopupMenu
        popupMenu.show();
        //popupMenu.show();//默认显示在view的下方，如果要控制具体显示位置，需要使用反射来实现。

//        try {
//            Field field = popupMenu.getClass().getDeclaredField("mPopup");
//            field.setAccessible(true);
//            MenuPopupHelper helper = (MenuPopupHelper) field.get(popupMenu);
//            y = y - view.getHeight();//如果y取的是触摸点的位置，可能需要作此处理，经测试android5.1的设备会弹窗在屏幕之外
//            helper.show(x, y);
//        } catch (NoSuchFieldException e) {
//            e.printStackTrace();
//        } catch (IllegalAccessException e) {
//            e.printStackTrace();
//        }
        // 通过上面这几行代码，就可以把控件显示出来了
        popupMenu.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                // 控件每一个item的点击事件
                switch (item.getItemId()) {
                    case R.id.next:
//                        checkedItemId = R.id.menu_setting_wifi;
                        Toast.makeText(PopupMenu2Activity.this, "next", Toast.LENGTH_SHORT).show();
                        break;

                    case R.id.add:
//                        checkedItemId = R.id.menu_setting_gps;
                        Toast.makeText(PopupMenu2Activity.this, "add", Toast.LENGTH_SHORT).show();
                        break;

                    case R.id.detail:
                        Toast.makeText(PopupMenu2Activity.this, "detail", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.menu_setting_wifi:
                        checkedItemId = R.id.menu_setting_wifi;
                        Toast.makeText(PopupMenu2Activity.this, "WIFI", Toast.LENGTH_SHORT).show();
                        break;

                    case R.id.menu_setting_gps:
                        checkedItemId = R.id.menu_setting_gps;
                        Toast.makeText(PopupMenu2Activity.this, "GPS", Toast.LENGTH_SHORT).show();
                        break;

                    case R.id.menu_setting_userIcon:
                        Toast.makeText(PopupMenu2Activity.this, "USER_ICON", Toast.LENGTH_SHORT).show();
                        break;
                }
                return true;
            }
        });
//        popupMenu.setOnDismissListener(new PopupMenu.OnDismissListener() {
//            @Override
//            public void onDismiss(PopupMenu menu) {
//                // 控件消失时的事件
//            }
//        });
//        popupMenu.show();

        switch (view.getId()) {
            case R.id.add:
                popupMenu.getMenu().findItem(R.id.del).setVisible(false);
                break;
            default:
                break;
        }
    }
//    有时候我们还需要根据不同的条件，显示或隐藏指定的 item，比如在点击第二个按钮的时候隐藏掉“删除歌曲”的选项，只需要添加几行代码：



}

2.主函数布局：

<LinearLayout 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:background="@color/colorPrimary"
    android:orientation="horizontal">
    <Button
        android:id="@+id/bt_popupmenu"
        android:text="弹窗"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />


    <Button
        android:id="@+id/bt_test"
        android:text="刷新"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

3.menu布局：

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/next"
        android:icon="@mipmap/ic_launcher"
        android:title="下一首播放"/>

    <item
        android:id="@+id/add"
        android:icon="@mipmap/ic_launcher"
        android:title="添加到歌单"/>

    <item
        android:id="@+id/detail"
        android:icon="@mipmap/ic_launcher"
        android:title="歌曲详情"/>

    <item
        android:id="@+id/del"
        android:icon="@mipmap/ic_launcher"
        android:title="删除歌曲"/>
    <!--当中，checkableBehavior有3个值可选：single,all,none，分别表示单选、复选、不可选-->
    <group android:checkableBehavior="single">
        <item
            android:id="@+id/menu_setting_wifi"
            android:title="使用WIFI"
            android:orderInCategory="80"
            android:icon="@drawable/ic_launcher"
            app:showAsAction="ifRoom" />

        <item
            android:id="@+id/menu_setting_gps"
            android:title="使用GPS"
            android:orderInCategory="90"
            android:icon="@drawable/ic_launcher"
            app:showAsAction="ifRoom" />
    </group>

    <group>
        <item
            android:id="@+id/menu_setting_userIcon"
            android:title="设置头像"
            android:icon="@drawable/ic_launcher"
            android:orderInCategory="91"
            app:showAsAction="never" />
    </group>
</menu>

4.1.自定义布局的式样：分割线、背景颜色、字体大小

4.2.设置清单文件中的theme:

 <activity android:name=".view.activity.popupmenu.PopupMenu2Activity" android:theme="@style/mainStyle"></activity>

4.3.theme:

<style name="mainStyle" parent="AppTheme">
        <item name="android:popupMenuStyle">@style/popmenuStyle</item>
        <item name="android:dropDownListViewStyle">@style/popmenuDivier</item>
        <item name="android:textAppearanceSmallPopupMenu">@style/popmeuText</item>
        <item name="android:textAppearanceLargePopupMenu">@style/popmeuText</item>
    </style>
    <!--popMenu的Style-->
    <style name="popmenuStyle" parent="@android:style/Widget.PopupMenu">
        <item name="android:popupBackground">@color/orange_500</item><!-- popMenu的背景色-->
    </style>
    <!--popmenu的字体颜色-->
    <style name="popmeuText">
        <item name="android:textColor">@color/white</item>
        <item name="android:textSize">20sp</item>
        <item name="android:layout_height">20dp</item>
        <item name="android:gravity">center</item>
    </style>
    <!--popMenu分割线的颜色-->
    <style name="popmenuDivier">
        <item name="android:divider">@color/colorAccent</item>
        <item name="android:dividerHeight">1sp</item>
    </style>

设置布局中的高度没有效果，有实现的话可以留言

 

5.相关案例：

https://github.com/li-xiaojun/XPopup

https://hndeveloper.github.io/2017/github-android-ui.html

https://github.com/razerdp/BasePopup

https://github.com/Yuhoon/AdaptionDialog