Change popup menu style - not working

Question

I'm trying to apply style to Android popup menu. Menu is shown on button click. In my example I want to set black menu background.

So, my menu layout:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:title="Item 1"
        android:id="@+id/menu1">
    </item>

    <item
        android:title="Item 2"
        android:id="@+id/menu2">
    </item>

</menu>

Next, my activity layout:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.michal.popupmenu.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:onClick="btnClick"
        android:nestedScrollingEnabled="true"/>
</RelativeLayout>

Code to show menu on button click:

public class MainActivity extends AppCompatActivity
{

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    public void btnClick(View view)
    {
        showMenu(view);

    }


    public void showMenu(View v)
    {
        PopupMenu popup = new PopupMenu(this, v);
        popup.inflate(R.menu.popup_menu);
        popup.show();
    }
}

Styles xmle was generated automatically. I have only added menu style to set black menu background, here it is:

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

</style>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="popupMenuStyle">@style/PopupMenu</item>
</style>

But still menu background is white and it should be black. Any ideas what's wrong?

[edit] According to comments, updated code:

<resources>

    <style name="PopupMenu" parent="@style/Widget.AppCompat.Light.PopupMenu">
        <item name="android:popupBackground">#FF4081</item>
    </style>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>



</resources>

Main activity:

public void showMenu(View v)
    {
        Context wrapper = new ContextThemeWrapper(getApplicationContext(), R.style.PopupMenu);
        PopupMenu popup = new PopupMenu(wrapper, v);

        // This activity implements OnMenuItemClickListener
        //popup.setOnMenuItemClickListener((PopupMenu.OnMenuItemClickListener) this);
        popup.inflate(R.menu.popup_menu);
        popup.show();
    }

Result is not what I expect

Menu background is still black, not a color I want to set.

Solution 1

I also tried the solution mentioned above, but my popupmenu color has not changed, so I ended up doing as follows:

1.Created a custom drawable with required color as follows:

popup_color_drawable.xml

<?xml version="1.0" encoding="utf-8"?>
  <selector
      xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_pressed="true">
     <color
         android:color="@color/colorPrimary"/>
      </item>
      <item>
          <color
              android:color="#655611"/>
      </item>
  </selector>

Added state_pressed to get select effect

2.In my styles.xml, added following code:

<style name="MyPopupMenu" parent="Widget.AppCompat.PopupMenu">
    <item name="android:itemBackground">@drawable/popup_color_drawable</item>
</style>

I am using Theme.AppCompat.Light.DarkActionBar as my base theme for app.

3.Then in my activity

public void showpopup(View view){
    Context wrapper = new ContextThemeWrapper(this, R.style.MyPopupMenu);
    PopupMenu popup = new PopupMenu(wrapper, view);
    popup.inflate(R.menu.popup_menu);
    popup.show();
}

Following is the result I got by using this code

Hopes this helps you.

Solution 2

you should try this:

 public void showMenu(View v)
    {
        Context wrapper = new ContextThemeWrapper(getContext(), R.style.PopupMenu);
        PopupMenu popup = new PopupMenu(wrapper, v);
        popup.inflate(R.menu.popup_menu);
        popup.show();
    }

Solution 3

In the original question all you needed to do was change:

<item name="android:popupBackground">#FF4081</item>

to:

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

Comments

[user1209216]

In my case, getApplicationContext() and it works. Why can't I declare style directly in xml?

[Sagar Chavada]

bcz its inflated view.. you cant declare style to inflated view. and also its menu's xml file. i tried so many time, and i failed.. so i did this, and its work..

[user1209216]

One edit... it does not work. Now menu background is always black and text is always white. Not values I set.

[Sagar Chavada]

what do you meant.. Now menu background is always black and text is always white, this is what you want right..? and also you can change text color

[user1209216]

In my styles.xml I set background color to red. But with your code I'm getting always menu background black and menu text white, no matter what color I set. But - I have gateContext undefined, so I used getApplicationContext instead.

[user1209216]

To clarify, I want custom color I set in styles.xml, not only black

[Sagar Chavada]

bcz i have fragment so i use getContext(), and you have activity so you can use getApplicationContext().

[Sagar Chavada]

remove this line to your AppTheme: <item name="popupMenuStyle">@style/PopupMenu</item>

[Sagar Chavada]

@android:color/black use instead of @color/whateverColor.

[user1209216]

Question updated. Why still menu background is black?

[user1209216]

How co change text background and text color with this soultion? If I set color to transparent, I'm getting text background not transparent.

[Ichigo Kurosaki]

you can change the textcolor by mentioning <item name="android:textColor">#ff0000</item> in MyPopupMenu

[user1209216]

It works... however it looks bad when menu item is selected (by tap and hold on it), because menu item color is changed and text background is not. Is there any solution for it?

[Ichigo Kurosaki]

Instead of changing background property, use itemBackground, I have updated my answer

[user1209216]

Thanks, it worked. However, I can't set lower opacity to make menu transparent, is there any solution for it?