Android应用中如何在导航抽屉内实现Popup菜单（覆盖文字保留图标）

1. 调整导航抽屉菜单项布局 #

先自定义导航抽屉的列表项布局，把图标和文字区域分离，确保Popup菜单能精准覆盖文字部分：

<!-- res/layout/nav_drawer_item.xml -->
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="16dp">

    <!-- 图标区域，Popup不会覆盖这里 -->
    <ImageView
        android:id="@+id/nav_icon"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:layout_marginEnd="16dp"/>

    <!-- 文字区域，Popup将覆盖此区域 -->
    <TextView
        android:id="@+id/nav_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:textSize="16sp"/>
</LinearLayout>

然后在NavigationView中引用这个布局：

<com.google.android.material.navigation.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:menu="@menu/nav_menu"
    app:itemLayout="@layout/nav_drawer_item"/>

2. 自定义Popup菜单样式 #

创建自定义样式，让Popup菜单的宽度匹配文字区域，背景和导航抽屉协调：

<!-- res/values/styles.xml -->
<style name="NavPopupMenu" parent="@style/Widget.MaterialComponents.PopupMenu">
    <item name="android:background">@drawable/popup_background</item>
    <item name="android:popupElevation">0dp</item>
    <item name="android:dropDownWidth">wrap_content</item>
</style>

<!-- res/drawable/popup_background.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/nav_drawer_background"/>
    <stroke android:width="1dp" android:color="@color/divider_color"/>
</shape>

3. 实现点击弹出Popup菜单的逻辑 #

在Activity/Fragment中处理NavigationView的菜单项点击事件，定位到文字View的位置显示Popup：

// 获取NavigationView
val navView = findViewById<NavigationView>(R.id.nav_view)

navView.setNavigationItemSelectedListener { menuItem ->
    // 获取当前点击项的视图
    val itemView = navView.menu.findItem(menuItem.itemId).actionView ?: menuItem.actionView
    val textView = itemView.findViewById<TextView>(R.id.nav_text)

    // 创建Popup菜单，绑定到文字View
    val popupMenu = PopupMenu(this, textView, Gravity.START)
    popupMenu.menuInflater.inflate(R.menu/popup_menu_options, popupMenu.menu)
    // 应用自定义样式
    popupMenu.setStyle(R.style.NavPopupMenu)

    // 处理Popup菜单点击事件
    popupMenu.setOnMenuItemClickListener { popupItem ->
        when(popupItem.itemId) {
            R.id.popup_option1 -> {
                // 执行选项1逻辑
                true
            }
            R.id.popup_option2 -> {
                // 执行选项2逻辑
                true
            }
            else -> false
        }
    }

    // 显示Popup菜单
    popupMenu.show()
    // 阻止导航抽屉关闭（可选，根据需求调整）
    false
}

对应的Popup菜单选项：

<!-- res/menu/popup_menu_options.xml -->
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/popup_option1"
        android:title="选项1"/>
    <item
        android:id="@+id/popup_option2"
        android:title="选项2"/>
    <item
        android:id="@+id/popup_option3"
        android:title="选项3"/>
</menu>

关键注意点 #

• 确保Popup菜单的锚点是文字TextView，这样弹出时会精准覆盖文字区域，保留图标可见
• 自定义Popup样式时，背景色尽量和导航抽屉背景一致，提升视觉连贯性
• 如果需要Popup菜单宽度和文字区域完全匹配，可以通过代码动态设置Popup的宽度：

popupMenu.setOnShowListener {
    val popupWindow = popupMenu.popupWindow
    popupWindow.width = textView.width
}

内容的提问来源于stack exchange，提问作者Mateusz Kubita