Change popup menu style - not working

user1209216 picture user1209216 · Sep 2, 2016 · Viewed 9.7k times · Source

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

result

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

Answer

Ichigo Kurosaki picture Ichigo Kurosaki · Sep 2, 2016

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 enter image description here

Hopes this helps you.