Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong


Toolbar 中menu功能实现

公司设计如图所示的菜单栏,第一反应使用系统自带的menu 菜单功能实现

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

1:通过Android Studio 创建一个包含menu的activity就可得到如下默认效果

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

此时的 默认的toolbar  

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

2.此时我们需要设置弹出菜单的风格,并需添加到appTheme中,之后再添加到Toolbar的app:popupTheme中  此次可以参考:点击打开链接

<style name="OverflowMenuStyle"  parent="@style/Widget.AppCompat.PopupMenu.Overflow">
    <!-- 是否覆盖锚点,默认为true,即盖住Toolbar -->
    <item name="overlapAnchor">false</item>
    <item name="android:dropDownWidth">wrap_content</item>
    <item name="android:paddingRight">0dp</item>
    <!-- 弹出层背景颜色 -->
    <item name="android:popupBackground">@drawable/ic_menu_bg</item>
    <!--<item name="android:background">@drawable/ic_menu_bg</item>-->
    <!-- 弹出层垂直方向上的偏移,即在竖直方向上距离Toolbar的距离,值为负则会盖住Toolbar -->
    <item name="android:dropDownVerticalOffset">-7dp</item>
    <!-- 弹出层水平方向上的偏移,即距离屏幕左边的距离,负值会导致右边出现空隙 -->
    <item name="android:dropDownHorizontalOffset">0dp</item>
    <!-- 设置弹出菜单文字颜色 -->
    <item name="android:textColor">#0099CC</item>
    <!--<item name="android:dropDownListViewStyle">@style/AppDropDownListViewStyle</item>-->
</style>

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

此时的效果如下:

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

最后我们为OverflowMenuStyle 添加一个背景图片就可以实现设计想要的效果

<!-- 弹出层背景颜色 -->
<item name="android:popupBackground">@drawable/ic_menu_bg</item>
Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong


Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

二:用popwinds 实现上述功能:

  /**
     * 弹出自定义溢出菜单
     */
    public void popupOverflowMenu(View view) {
        // 显示溢出菜单的时候设置背景半透明
        setWindowAlpha(0.5f);
        // 获取状态栏高度
        Rect frame = new Rect();
        getWindow().getDecorView().getWindowVisibleDisplayFrame(frame);
        // 状态栏高度 frame.top
        int xOffset = frame.top +mToolbar.getHeight()+Dp2Dx(this, -12f); // 减去阴影宽度,适配UI
        int yOffset = Dp2Dx(this, 6f); // 设置x方向offset为5dp

        View popView = getLayoutInflater().inflate(R.layout.menu_popup, null);
        // popView即popupWindow布局
        PopupWindow popupWindow = new PopupWindow(popView, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT, true);
        // 必须设计BackgroundDrawable后setOutsideTouchable(true)才会有效。这里在XML中定义背景,所以这里为null
        popupWindow.setBackgroundDrawable(new ColorDrawable(0000000000));
        popupWindow.setFocusable(true);
        popupWindow.setOutsideTouchable(true); // 点击外部关闭
        popupWindow.setAnimationStyle(android.R.style.Animation_Dialog);
        // 设置Gravity,让它显示在右上角
        popupWindow.showAtLocation(view, Gravity.RIGHT | Gravity.TOP, yOffset, xOffset);
//        popupWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {
//
//            @Override
//            public void onDismiss() {
//                // popupWindow消失时,设置为全透明
//                setWindowAlpha(1f);
//            }
//        });
    }
效果图:

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

Android,安卓,toolbar,menu显示位置,及样式调整,及使用PopupWindow 实现menu下拉菜单gong

popwinds实现代码如上

感谢:http://m.blog.****.net/speverriver/article/details/77337778  作者


demo 下载