47

I'm unable to see how adding a popup menu from the title is accomplished like is shown in many of the material design examples. Any help would be much appreciated.

Toolbar Popup From Title

Matt Wear
  • 1,211
  • 2
  • 15
  • 24
  • I think it potentially could be setMenu, but I don't see it in the documentation yet. http://cl.ly/image/303N3G0o1z1V documentation I'm viewing: http://developer.android.com/reference/android/support/v7/widget/Toolbar.html – Matt Wear Oct 22 '14 at 15:34

2 Answers2

97

You're going to need to add a Spinner to the Toolbar:

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

    <Spinner
            android:id="@+id/spinner_nav"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

</android.support.v7.widget.Toolbar>

You will then need to disable the default title:

Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayShowTitleEnabled(false);

You can then retrieve and setup the Spinner as needed in your Activity/Fragment.

Chris Banes
  • 31,763
  • 16
  • 59
  • 50
  • 1
    Could you please have a look at my question http://stackoverflow.com/questions/26755878/how-can-i-fix-the-spinner-style-for-android-4-x-placed-on-top-of-the-toolbar ? – Damian Petla Nov 05 '14 at 11:26
  • 4
    Can we put the spinner on the right side of the Toolbar ? And how to set the default text/value of the spinner ? – Khairil Ushan Nov 06 '14 at 07:31
  • 1
    I also added spinner to toolbar, but dropdown items are colored dark, while overflow menu is colored white. – bajicdusko Nov 09 '14 at 19:50
  • 5
    helionprime you must use getSupportActionBar().getThemedContext() with SpinnerAdapter.createFromResource(context, ...) – ljbade Nov 23 '14 at 06:56
  • ...I used this and it noted to set the android:minSdkVersion to 21. Does that mean if a user has not upgraded to API 21, Android 5.0, then they cannot use the app? What do we do then? – Sauron Dec 13 '14 at 18:26
  • 1
    No, you have to use the support library to provide compatibility. – Robert Estivill Dec 16 '14 at 12:44
  • There were some changes in API 22 with AppCompat library - now whe using Factory2 with inflater there seems to be some theming inside the Toolbar itself which is colliding with your coloring. Not sure if using Factory(1) is the only way to disallow this? – milosmns May 20 '15 at 13:15
  • 5.1 doesn't displays the down arrow head !! android:dropDownVerticalOffset="-52dp" for Kitkat and below android:dropDownVerticalOffset="0dp" for LollyPop also failed – LOG_TAG Jul 15 '15 at 08:52
  • @ljbade how to deal with that if Toolbar is being used in the fragment? – Shajeel Afzal Sep 14 '15 at 19:24
1

I came across this question while I was trying to find a solution to prevent the popup to overlay the spinner and I would like to leave here an alternative solution to this question as its possible to add the spinner to the toolbar using the menu.xml as well

activity_main.xml

<LinearLayout 
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:orientation="vertical">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorAccent" />

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

 <!-- Other layout widgets -->

</LinearLayout>

menu_main.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<item
    android:id="@+id/spinner"
    android:title="Spinning"
    app:actionViewClass="android.widget.Spinner"
    app:showAsAction="always" />

<!-- Other items -->

</menu>

Your Activity

It will be necessary to override the onCreateOptionMenu() method, then use getMenuInflater() to inflate the menu file created earlier.

You will also need to get the Spinner item and set an adapter to it as you would normally do.

   @Override
public boolean onCreateOptionsMenu(Menu menu) {

    getMenuInflater().inflate(R.menu.menu_main, menu);

    //Get Spinner item from menu

    MenuItem spinnerMenuItem = menu.findItem(R.id.spinner);
    final Spinner spinner = (Spinner) MenuItemCompat.getActionView(spinnerMenuItem);

    //Set adapter whichever way you prefer (from the resource or manually)

    final ArrayAdapter<CharSequence> spinnerAdapter = ArrayAdapter
            .createFromResource(this, R.array.items_array, android.R.layout.simple_spinner_dropdown_item);
    spinnerAdapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
    spinner.setAdapter(spinnerAdapter);

    return true;

}

Style.xml

Finally, if you want to customize your spinner

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:spinnerStyle">@style/spinner_style</item>
</style>

<style name="spinner_style" parent="Widget.AppCompat.Spinner">
    <item name="android:dropDownVerticalOffset">40dip</item>
    <!--<item name="android:dropDownHorizontalOffset">0dip</item>-->
    <item name="overlapAnchor">false</item>

    <!--Other customizations-->

</style>

Ruan_Lopes
  • 1,381
  • 13
  • 18