android - 将圆形彩色背景应用于 Material PopupMenu 组件的正确方法是什么？

Question

我正在尝试制作一个带有圆角和自定义字体的弹出菜单。我正在使用来自 material.io 的 Material 菜单。我想实现这样的目标:

到目前为止，我尝试的是使用 PopupMenu 并使用自定义背景可绘制对象添加样式参数:

在 question 中查看答案，我使用了 ContextThemeWrapper 以便我的样式实际生效。没有这个，样式更改将不起作用

    private fun showAddGoalsMenu(view: View) {
        val wrapper = ContextThemeWrapper(context, R.style.PopupMenu)
        val popupMenu = PopupMenu(wrapper, view)
        popupMenu.inflate(R.menu.menu_add_goals)

        ...
    }

从此material.io menu theming example ，我尝试设置属性popupMenuBackground在主应用程序样式中，还尝试设置 android:popupBackground以个人风格。但背景不适用:

从其他答案( question 1 ， question 2 ， question 3 )中，我发现了其他属性，例如 background , android:background , itemBackground , android:itemBackground .从这里，

background和 android:background仅适用于设置颜色。如果我将自定义可绘制对象设置为背景，它也会弄乱项目:

itemBackground和 android:itemBackground只为单个项目设置背景。因此，如果我应用圆形背景，结果如下所示:

我的样式代码目前看起来像这样。根据我到目前为止所阅读的内容，这应该可行。但是....叹息。我已经注释掉了我所做的所有实验。

    <style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorSecondary">@color/colorSecondary</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="bottomNavigationStyle">@style/Widget.App.BottomNavigationView</item>

        <!--<item name="textAppearanceLargePopupMenu">@style/TextAppearance.App.Subtitle1</item>-->
        <!--<item name="textAppearanceSmallPopupMenu">@style/TextAppearance.App.Subtitle1</item>-->
        <!--<item name="popupMenuBackground">@drawable/custom_popup_background</item>-->
        <item name="popupMenuStyle">@style/PopupMenu</item>
    </style>

    <style name="PopupMenu" parent="Widget.MaterialComponents.PopupMenu">
        <item name="android:dropDownHorizontalOffset">-4dp</item>
        <item name="android:dropDownVerticalOffset">4dp</item>
        <item name="android:popupBackground">@drawable/custom_popup_background</item>
        <!--<item name="android:itemBackground">@drawable/black_popup_background</item>-->
        <item name="popupMenuBackground">@drawable/custom_popup_background</item>
        <!--<item name="background">@color/colorPrimary</item>-->
        <!--<item name="android:background">@drawable/custom_popup_background</item>-->
        <item name="android:background">@color/colorPrimary</item>-->
<!--        <item name="itemBackground">@drawable/black_popup_background</item>-->
        <item name="textAppearanceLargePopupMenu">@style/TextAppearance.App.Subtitle1</item>
        <item name="textAppearanceSmallPopupMenu">@style/TextAppearance.App.Subtitle1</item>
    </style>


    <style name="TextAppearance.App.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
        <item name="fontFamily">@font/amaranth</item>
        <item name="android:fontFamily">@font/amaranth</item>
        <item name="android:textColor">#1E2D58</item>
    </style>

这是我的自定义背景可绘制

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/colorPrimary"/>
    <corners
        android:radius="16dp"/>
    <padding
        android:bottom="8dp"
        android:top="8dp"/>
</shape>

为了测试 itemBackground，我创建了一个 black_popup_background.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/colorSecondary"/>
    <corners
        android:radius="16dp"/>
    <padding
        android:bottom="8dp"
        android:top="8dp"/>
</shape>

我得到的输出是:

我不知道我做错了什么。提前感谢所有帮助!

Answer 1

对于以后遇到此问题的任何人。
我犯的错误是使用 android.widget.PopupMenu 在我的代码中而不是 androidx.appcompat.widget.PopupMenu .一旦我替换了这种用法，样式就起作用了。
最终，我的风格看起来和提到的一样 here .