如何在Android中实现指定样式的自定义OptionMenu

以下是完全自定义样式OptionMenu的无第三方依赖实现方案，可1:1还原你需要的设计效果：

1. 准备自定义布局资源 #

首先创建菜单的背景样式和布局文件：

• 菜单背景drawable（res/drawable/bg_option_menu.xml）：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#FFFFFF"/>
    <corners android:radius="8dp"/>
    <padding android:bottom="2dp"/>
</shape>

• 菜单布局文件（res/layout/layout_custom_option_menu.xml）：

<?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/bg_option_menu"
    android:elevation="8dp">
    <!-- 按需添加菜单项，支持任意自定义样式 -->
    <TextView
        android:id="@+id/menu_item1"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:paddingHorizontal="16dp"
        android:gravity="center_vertical"
        android:drawableStart="@drawable/ic_item1"
        android:drawablePadding="16dp"
        android:text="菜单项1"/>
    <View
        android:layout_width="match_parent"
        android:layout_height="0.5dp"
        android:background="#EEEEEE"
        android:layout_marginHorizontal="8dp"/>
    <TextView
        android:id="@+id/menu_item2"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:paddingHorizontal="16dp"
        android:gravity="center_vertical"
        android:drawableStart="@drawable/ic_item2"
        android:drawablePadding="16dp"
        android:text="菜单项2"/>
</LinearLayout>

2. Activity中加载并显示自定义菜单 #

通过拦截原生菜单点击事件，弹出自定义PopupWindow实现效果：

// Kotlin实现代码
override fun onCreateOptionsMenu(menu: Menu): Boolean {
    menuInflater.inflate(R.menu.base_menu, menu) // 仅保留右上角三点触发按钮即可
    return true
}

override fun onOptionsItemSelected(item: MenuItem): Boolean {
    if (item.itemId == R.id.menu_trigger) {
        showCustomMenu()
        return true
    }
    return super.onOptionsItemSelected(item)
}

private fun showCustomMenu() {
    val menuView = layoutInflater.inflate(R.layout.layout_custom_option_menu, null)
    val popupWindow = PopupWindow(
        menuView,
        ViewGroup.LayoutParams.WRAP_CONTENT,
        ViewGroup.LayoutParams.WRAP_CONTENT,
        true
    )
    // 定位到右上角触发按钮下方
    val triggerView = findViewById<View>(R.id.menu_trigger)
    popupWindow.showAsDropDown(triggerView, 0, 0)

    // 绑定菜单项点击事件
    menuView.findViewById<TextView>(R.id.menu_item1).setOnClickListener {
        // 处理菜单项1逻辑
        popupWindow.dismiss()
    }
    menuView.findViewById<TextView>(R.id.menu_item2).setOnClickListener {
        // 处理菜单项2逻辑
        popupWindow.dismiss()
    }
}

优化适配项 #

• 如需避免菜单弹出超出屏幕边界，可自行计算屏幕坐标调整showAsDropDown的x、y偏移值
• 可通过给PopupWindow设置animationStyle添加弹出/收起动画
• 菜单项的颜色、大小、图标、分割线样式均可完全自定义，不受原生OptionMenu限制

内容的提问来源于stack exchange，提问作者hardik koladiya