ToolBar 中 PopupMenu 问题

最新推荐文章于 2025-01-08 16:26:54 发布

原创最新推荐文章于 2025-01-08 16:26:54 发布 · 1k 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#ToolBar #PopupMenu

Android 专栏收录该内容

6 篇文章

订阅专栏

在Android开发中，使用ToolBar时遇到菜单项显示问题。当设置showAsAction为"never"，只显示文字，设为"always"则仅显示图标。通过反射方法，实现在菜单中同时显示图标和文字。然而，进一步的问题是PopupMenu会遮挡ToolBar。解决这个问题，需要修改应用的主题样式表，以调整PopupMenu的显示位置和效果。

ToolBar 不仅继承了 ActionBar 的所有功能，而且灵活性很高

问题
在使用ToolBar时，虽然在menu.xml文件的 item 中设置了 icon ，但是当设置 showAsAction= “never” 时，默认只显示文字的 title，而不会显示图标 icon，而设置 showAsAction= “always”, 又只能显示图标！这让人很抓阄！

鱼和熊掌不可兼得

解决办法
那有没有办法让菜单中既显示图标又显示文字呢？ —— 反射

可以在 Activity 中重写 onMenuOpened() 方法，通过反射使 icon 和 title 同时可见。

    /*
    *利用反射把 PopupMenu 中的图标显示出来
     */
    @Override
    public boolean onMenuOpened(int featureId, Menu menu) {
        if (menu != null) {
            if (menu.getClass().getSimpleName().equalsIgnoreCase("MenuBuilder")) {
                try {
                    Method method = menu.getClass().getDeclaredMethod("setOptionalIconsVisible", Boolean.TYPE);
                    method.setAccessible(true);
                    method.invoke(menu, true);
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
        }
        return super.onMenuOpened(featureId, menu);
    }

结果：

这里写图片描述

新问题：PopupMenu 挡住了 ToolBar
解决办法——修改样式表 styles.xml

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <!--沉浸式-->
        <item name="android:fitsSystemWindows">true</item>

        <item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item>
    </style>

    <!--自定义 popup 样式-->
    <style name="OverflowMenuStyle" parent="@style/Widget.AppCompat.PopupMenu.Overflow">
        <!-- 是否覆盖锚点，默认为true，即盖住Toolbar -->
        <item name="overlapAnchor">false</item>
        <!-- 弹出层背景颜色 -->
        <item name="android:popupBackground">@color/lightBlue</item>
        <!-- 弹出层垂直方向上的偏移，即在竖直方向上距离Toolbar的距离，值为负则会盖住Toolbar -->
        <item name="android:dropDownVerticalOffset">5dp</item>
        <!-- 弹出层水平方向上的偏移，即距离屏幕左边的距离，负值会导致右边出现空隙 -->
        <item name="android:dropDownHorizontalOffset">-2dp</item>
    </style>

</resources>

效果：

这里写图片描述