Why is my overflow dropdown menu on top of the actionbar?

Question

By default isn\'t it supposed to be under the actionbar? So what am I doi

Answer 1

This is the new default with Material Design. Popup menus will be displayed originating from the Button which opened them.

This is done to increase the visual connection between the Button and the popup menu. Just look at Googles apps which already use Material Design, there the popup menus act in the same way.

Answer 2

This is default behaviour of AppCompat theme you are using. According to the Material Design guidelines, it is expected overflow menu to appear on top of it's anchor, the ActionBar.

You can force it to show below the action bar if by setting to your theme overlapAnchor to false

   <style name="OverflowMenu" parent="Widget.AppCompat.PopupMenu.Overflow" >
         <item name="overlapAnchor">false</item>
         <item name="dropDownVerticalOffset">?attr/actionBarSize</item>
    </style>

Answer 3

According to the Material Design specifications, the overflow menu should display on top of the action bar:

A menu is a temporary sheet of paper that always overlaps the app bar, rather than behaving as an extension of the app bar.

This is the default behavior for Android Lollipop applications as well as any applications that use the AppCompat v7 support library.

Answer 4

Finally this works for me:

<resources>
    <style name="AppBaseTheme" parent="Theme.AppCompat.Light" />

    <style name="AppTheme" parent="AppBaseTheme">
        <item name="actionOverflowMenuStyle">@style/OverflowMenu</item>
    </style>

    <style name="OverflowMenu" parent="Widget.AppCompat.PopupMenu.Overflow">
        <!-- Required for pre-Lollipop. -->
        <item name="overlapAnchor">false</item>

        <!-- Required for Lollipop. -->
        <item name="android:overlapAnchor">false</item>
    </style>

</resources>

Source: https://stackoverflow.com/a/27134045/3586815

Thanks to Nikola Despotoski for the hint.