Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

dropdown list on top of actionbar

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

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}

res/menu/main.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.example.test.MainActivity" >

<item
    android:id="@+id/action_settings"
    android:orderInCategory="100"
    android:title="@string/action_settings"
    app:showAsAction="never"/>
</menu>
like image 492
ethio Avatar asked Nov 17 '14 18:11

ethio


4 Answers

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>
like image 162
Nikola Despotoski Avatar answered Sep 19 '22 08:09

Nikola Despotoski


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.

like image 32
Tuksn Avatar answered Sep 17 '22 08:09

Tuksn


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.

enter image description here

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

like image 30
Alex Lockwood Avatar answered Sep 20 '22 08:09

Alex Lockwood


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.

like image 45
Xaver Kapeller Avatar answered Sep 20 '22 08:09

Xaver Kapeller