更改弹出菜单背景颜色

时间:2016-11-18 07:31:28

标签: android android-layout themes android-toolbar android-theme

  

注意:我搜索了一个小时,并尝试了已提供的所有解决方案   通过stackoverflow。

我正在研究主题叠加。我制作了一个示例应用程序,它会在单击操作栏图标时打开一个弹出菜单。这是我的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>

    </style>

    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>



    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Light">
        <item name="android:textColorPrimary">@color/colorAccent</item>
    </style>

    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Dark">
        <!-- added all to see which one will work.-->
        <item name="android:popupMenuStyle">@style/PopupMenu</item>
        <item name="android:itemBackground">@color/colorAccent</item>
        <item name="android:colorBackground">@color/colorAccent</item>

    </style>

    <style name="PopupMenu" parent="@android:style/Widget.PopupMenu">
        <item name="android:popupBackground">@color/colorAccent</item>
    </style>

</resources>

这是我的工具栏样式。

   <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay"/>

    </android.support.design.widget.AppBarLayout>

我已将popupTheme设置为styles.xml中的 @Override public boolean onOptionsItemSelected(MenuItem item) { if(item.getItemId() == R.id.standard_menu){ showPopupMenu(item); return true; } return super.onOptionsItemSelected(item); } private void showPopupMenu(MenuItem item) { PopupMenu p = new PopupMenu(this, findViewById(item.getItemId())); p.inflate(R.menu.pop_menu); p.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem item) { Toast.makeText(MainActivity.this, "clicked.", Toast.LENGTH_SHORT).show(); return true; } }); p.show(); } 。现在我要更改弹出菜单的背景颜色,该菜单目前为白色。

enter image description here

这是代码。

{{1}}

10 个答案:

答案 0 :(得分:23)

我对接受的答案不满意,因为它没有真正解释为什么没有应用OP自定义弹出式样式 - 不仅仅是背景,还有文字颜色之类的东西 - 所以我做了我的自己的实验。

重要的是要注意Toolbar(当它有菜单项时)创建的弹出窗口与使用PopupMenu自己显示的弹出窗口之间存在差异。这些由不同的主题属性控制。另请注意,有两个PopupMenu类:android.widget.PopupMenuandroid.support.v7.widget.PopupMenu

您明确显示的PopupMenu样式所需的主题属性是android:popupMenuStylepopupMenuStyle。您可以通过一些选项来正确应用自定义样式:

(1)在活动主题(或应用)中使用android:popupMenuStyle

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- if using android.widget.PopupMenu -->
    <item name="android:popupMenuStyle">@style/PopupMenu</item>
    <!-- if using android.support.v7.widget.PopupMenu -->
    <item name="popupMenuStyle">@style/PopupMenu</item>
</style/>

<style name="PopupMenu" parent="ThemeOverlay.AppCompat.Dark">
    <item name="android:popupBackground">@color/popupBackground</item>
</style>

PopupMenu popup = new PopupMenu(this, anchorView);

请注意,布局文件中不需要额外的内容。

(2)使用ContextThemeWrapper

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- nothing special -->
</style/>

<style name="CustomPopupTheme" parent="ThemeOverlay.AppCompat.Dark">
    <!-- if using android.widget.PopupMenu -->
    <item name="android:popupMenuStyle">@style/PopupMenu</item>
    <!-- if using android.support.v7.widget.PopupMenu -->
    <item name="popupMenuStyle">@style/PopupMenu</item>
</style>

<style name="PopupMenu" parent="ThemeOverlay.AppCompat.Dark">
    <item name="android:popupBackground">@color/popupBackground</item>
</style>

ContextThemeWrapper ctw = new ContextThemeWrapper(this, R.style.CustomPopupTheme);
PopupMenu popup = new PopupMenu(ctw, anchorView);

请注意,在构建R.style.PopupMenu时,这不会直接使用ContextThemeWrapper。这似乎有点迂回,但是如果你想让弹出主题与活动或应用主题分开(例如,可能只有一些弹出窗口需要你的特殊主题),它会很有用。

(3)使用AppBarLayout的上下文

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- nothing special -->
</style/>

<style name="AppBarOverlay" parent="ThemeOverlay.AppCompat.Light">
    <!-- if using android.widget.PopupMenu -->
    <item name="android:popupMenuStyle">@style/PopupMenu</item>
    <!-- if using android.support.v7.widget.PopupMenu -->
    <item name="popupMenuStyle">@style/PopupMenu</item>
</style>

<style name="PopupMenu" parent="ThemeOverlay.AppCompat.Dark">
    <item name="android:popupBackground">@color/popupBackground</item>
</style>

<style name="PopupOverlay" parent="ThemeOverlay.AppCompat.Dark">
    <!-- changes the background of the Toolbar's popup -->
    <item name="android:colorBackground">@color/popupBackground</item>
</style>


<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/PopupOverlay"/>

</android.support.design.widget.AppBarLayout>


AppBarLayout appBar = (AppBarLayout) findViewById(R.id.app_bar);
PopupMenu popup = new PopupMenu(appBar.getContext(), anchorView);

由于您已经拥有AppBar的主题叠加层,因此您可以使用它来保存弹出式主题参考。这也适用于工具栏的上下文,至少在给出当前布局的情况下,尽管注意app:popupTheme在这里实际上并不相关,因为它会影响Toolbar的弹出窗口,而不会影响PopupMenu。还要注意这与上面的选项2有多相似,这应该让您了解android:theme属性如何在引擎盖下工作;)

在我的实验中,android:itemBackground仅在我用android:colorBackground样式代替PopupOverlay时才有用。但是,最好使用android:colorBackground,因为这会改变弹出窗口的颜色,使圆角和可选项突出显示/纹理完整。

答案 1 :(得分:2)

使用&#34; popupMenuStyle&#34;对于支持v7库的PopupMenu,以及 使用&#34; android:popupMenuStyle&#34;对于常规的PopupMenu

答案 2 :(得分:2)

<style name="YOURSTYLE" parent="Widget.AppCompat.PopupMenu">
    <item name="android:textColor">@android:color/white</item>
    <item name="android:itemBackground">@android:color/holo_red_light</item>
</style>

Context wrapper = new ContextThemeWrapper(this, R.style.YOURSTYLE);
PopupMenu popup = new PopupMenu(wrapper, view);

可能会帮助你

答案 3 :(得分:1)

这对我有用

<item name="android:itemBackground">@color/primary</item>

将其插入主要样式 我希望这对你有用

答案 4 :(得分:1)

我是否请检查是否有人有问题,也可以将此样式添加到样式

 <style name="CustomPopupTheme" parent="ThemeOverlay.AppCompat.Dark">
    <!-- if using android.widget.PopupMenu -->
    <item name="android:popupMenuStyle">@style/PopupMenu</item>
    <!-- if using android.support.v7.widget.PopupMenu -->
    <item name="popupMenuStyle">@style/PopupMenu</item>
</style>

<style name="PopupMenu" parent="ThemeOverlay.AppCompat.Dark">
    <item name="android:popupBackground">@color/appGreenColor</item>
</style>

并且popmenu的代码是

 private void openPopMenuList(View view) {
    //custom background COlor view
    PopupMenu popup = new PopupMenu(new ContextThemeWrapper(getActivity(), R.style.CustomPopupTheme), view);
    try {
        // Reflection apis to enforce show icon
        Field[] fields = popup.getClass().getDeclaredFields();
        for (Field field : fields) {
            if (field.getName().equals( POPUP_CONSTANT )) {
                field.setAccessible( true );
                Object menuPopupHelper = field.get( popup );
                Class<?> classPopupHelper = Class.forName( menuPopupHelper.getClass().getName() );
                Method setForceIcons = classPopupHelper.getMethod( POPUP_FORCE_SHOW_ICON, boolean.class );
                setForceIcons.invoke( menuPopupHelper, true );
                break;
            }
        }
    } catch (Exception e) {
        e.printStackTrace();
    }
    popup.getMenuInflater().inflate( R.menu.pop_up_menu, popup.getMenu() );
    popup.setOnMenuItemClickListener( this );
    popup.show();


}

以下是弹出菜单项

<?xml version="1.0" encoding="utf-8"?>

<item
    android:id="@+id/share_popmenu"
    android:icon="@drawable/menu_share"
    android:title="@string/share_with_friends" />


<item
    android:id="@+id/askdelete_popmenu"
    android:icon="@drawable/menu_delete"
    android:title="Ask For Delete" />

答案 5 :(得分:1)

要删除在 AndroidX 中添加的边距:

Iconfiguration

答案 6 :(得分:0)

将popupMenu样式添加到您的AppTheme:

<style name="AppTheme" parent="android:Theme.Light">
    <item name="android:popupMenuStyle">@style/PopupMenu</item>
</style>

<style name="PopupMenu" parent="@android:style/Widget.PopupMenu">
    <item name="android:popupBackground">@android:color/white</item>
</style>

的manifest.xml:

 <application
    android:allowBackup="true"
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:theme="@style/AppTheme" >
.............
</application>

我希望它能奏效。

答案 7 :(得分:0)

尝试在PopupOverlay中使用colorPrimary,就像这样

<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" >
    <item name="colorPrimary">@color/blue_ivy</item>
</style>

答案 8 :(得分:0)

上述解决方案都不适用于我,所以这就是我修复它的方法:

首先为活动制作一个新主题,并且:

<style name="Theme.YourTheme" parent="Theme.AppCompat">
    <item name="android:itemBackground">@color/white</item>
    <item name="android:textColor">@color/black</item>
</style>
  1. 使项目背景为白色

    <item name="android:itemBackground">@color/white</item>
    
  2. 要使文字颜色变黑

    <item name="android:textColor">@color/black</item>
    
  3. 最后,通过Manifest将主题应用于您的Activity:

        <activity android:name=".YourActivity"
            android:theme="@style/Theme.YourTheme"/>
    

答案 9 :(得分:0)

在AppCompat工具栏中使用p​​opupTheme

 <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:popupTheme="@style/MyTheme"/>

样式:

  <style name="MyTheme" parent="ThemeOverlay.AppCompat.Light">
    <item name="android:colorBackground">@color/colorPrimary</item>
    <item name="android:textColor">@color/white</item>
</style>

希望它会起作用。