I am trying to understand how to implement a SearchView in Android in my toolbar. The problem is that depending on the configurations I choose I get different interface results.
This is the layout of my Activity:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="fill_parent"
tools:context="com.construct.v2.activities.teams.ActivityTeams"
android:background="#ffffff"
android:id="#+id/relativeLayout">
<include android:id="#+id/toolbar" layout="#layout/toolbar_shadow"/>
<ListView
android:id="#+id/listview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/toolbar" />
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
app:tabMode="fixed"
app:tabGravity="fill"
app:tabIndicatorColor="#125688"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</RelativeLayout>
This is my toolbar_shadow layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/PopupMenuStyle"
android:id="#+id/my_awesome_toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
app:titleTextColor="#android:color/black"
android:layout_alignParentTop="true"
android:gravity="right"
android:elevation="5dp">
<TextView
android:id="#+id/delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/s_text_size"
android:padding="#dimen/small_margin"
android:layout_gravity="right|end"
android:layout_marginEnd="#dimen/s_margin"
android:textColor="#000000"
android:text="#string/edit"/>
</android.support.v7.widget.Toolbar>
And this is the layout file for my search item:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="#+id/search"
android:title="#string/search"
app:icon="#drawable/ic_search_black_24dp"
android:icon="#drawable/ic_search_black_24dp"
app:showAsAction="collapseActionView|ifRoom"
app:actionViewClass="android.support.v7.widget.SearchView" />
</menu>
With this configuration I get this output:
But if I click on the magnifying glass I get this:
If I start typing I get this:
So I thought that it was because I have this configuration app:showAsAction="collapseActionView|ifRoom" but I tried to change to always but i got this output:
The magnifying glass disappears. But if I click on the place where it is supposed to be I get this output:
Which is the correct output I am looking for, but I don't know why the magnifying glass is not showing.
This is the part in my activity where I initialize the searchview:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_search_team, menu);
SearchManager searchManager = (SearchManager)
getSystemService(Context.SEARCH_SERVICE);
searchMenuItem = menu.findItem(R.id.search);
searchView = (SearchView) searchMenuItem.getActionView();
ImageView searchClose = (ImageView) searchView.findViewById(android.support.v7.appcompat.R.id.search_close_btn);
searchClose.setImageResource(R.drawable.ic_action_cancel_black);
for (TextView textView : findChildrenByClass(searchView, TextView.class)) {
textView.setTextColor(Color.BLACK);
textView.setHintTextColor(Color.BLACK);
}
searchView.setSearchableInfo(searchManager.
getSearchableInfo(getComponentName()));
searchView.setSubmitButtonEnabled(true);
searchView.setOnQueryTextListener(this);
return true;
}
And this is how I initialize my toolbar:
#Override
protected void initToolbar() {
toolbar = (Toolbar) findViewById(R.id.toolbar);
if(toolbar!=null) {
if (user_type == 1) {
toolbar.setTitle(R.string.collaborators_title);
} else if (user_type == 2) {
toolbar.setTitle(R.string.admin_title);
}
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
toolbar.setNavigationIcon(R.drawable.ic_action_back_black);
//getSupportActionBar().setDisplayHomeAsUpEnabled(true);
//toolbar.setTitle("Teste");
//toolbar.setTitleTextColor(Color.parseColor("#000000"));
//final TextView edit = (TextView) findViewById(R.id.delete);
//edit.setText(" ");
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
onBackPressed();
}
});
}
}
Since I can't see the rest of the code where you implement the functionality for the x button, I'm just gonna take a stab at it. Add a listener for when the user leaves the search view to go back to the view with the magnifying glass. In that listener add this line:
<Your activity>.findViewById(R.id.search).setVisibility(View.VISIBLE);
It could be possible that the searchview automatically set the view to invisible, but you never reset the visibility for the user.
Edit:
app:icon="#drawable/ic_search_black_24dp"
android:icon="#drawable/ic_search_black_24dp"
there is difference between app: prefix and android: prefix. With appcompat-v7 library you can use android: prefix and remove app:icon line .
app:showAsAction="collapseActionView|ifRoom"
Change this line to
app:showAsAction="always|collapseActionView"
In searchview if we select only always as showasAction then back arrow is not visible.
Check the theme and styles of your app because a I had had the same problem that you and it made me crazy.
I found the solution changing the theme and styles.
If you are using Toolbar I assume that your main theme is
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
For the AppBarLayout use this
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark" />
For the Toolbar use this
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
Note that one is Dark and the other is Light. You can exchange both if it adjust better to your main theme
Use the suggest from Zohra Khan
Change this line to
app:showAsAction="always|collapseActionView" In searchview if we select only always as showasAction then back arrow is not visible.
If it's not clear, take a look to this example from where I took this ideas
Hope this helps you
Related
I have an activity in which I have added a Navigation Drawer with a custom Toolbar. This my activity layout:
<androidx.drawerlayout.widget.DrawerLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:id="#+id/toolbar" />
<fragment
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
app:defaultNavHost="true"
app:navGraph="#navigation/nav_graph" />
</LinearLayout>
//NavigationView
</androidx.drawerlayout.widget.DrawerLayout>
In the activity I have also added a custom menu:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="#+id/sign_out"
android:title="Sign-out"
android:orderInCategory="100"
app:showAsAction="never"/>
</menu>
In this moment I have the burger icon and the three dots, which is what I want.
The problem arrives I try to add a search functionality in the fragment. This is how my fragment layout file looks like:
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.SearchView
android:id="#+id/search_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:iconifiedByDefault="false"
android:layout_centerHorizontal="true" />
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Instead of adding the SearchView to the actual Toolbar it creates another one. So I get two Toolbars. The problem is that I don't want to inflate the SerachView via a menu file in the fragment, I need to have it my layout file. How to have a single ToolBar that contains all three views (burger icon, the three dots and SearchView)?
This is what I have:
And this is what I want to achieve:
SOLVED:
I solved this by removing the Toolbar from the activity and set separate toolbar in each fragment.
You can have the below approach to achieve it:
Keep the Search item as always hidden in menu.xml
(In your activity)
override fun onCreateOptionsMenu(menu: Menu?): Boolean {
menuInflater.inflate(R.menu.<your menu name>, menu)
menu?.findItem(R.id.<search item id>)?.isVisible = false
val visibleFragment = supportFragmentManager.getCurrentNavigationFragment() //This is an extension function, which will return the current visible fragment
visibleFragment?.let {
if (it is SearchFragment) {
menu?.findItem((R.id.search))?.isVisible = true
}
}
return super.onCreateOptionsMenu(menu)
}
Refer menu.xml for full code
Change the visibility of the "search item" when your "SearchFragment" is visible. This can be achieved by using the listener approach. When the SearchFragment is visible send a callback to activity and call "invalidateOptionsMenu()"
To get the current visible fragment in Navigation graph, you can create an extension function as below:
fun FragmentManager.getCurrentNavigationFragment(): Fragment? =
primaryNavigationFragment?.childFragmentManager?.fragments?.first()
In your SearchFragment, initialize the listener in onAttach method.
Send action to MainActivity by using listener fron onViewCreated.
I have pushed the full code on Github for your reference.
https://github.com/parmeshtoyou/StackOverFlowActionBar
Updated action bar in Search Fragment
In your menu add the search item as follows:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="#+id/sign_out"
android:title="Sign-out"
android:orderInCategory="100"
app:showAsAction="never"/>
<item
android:id="#+id/action_search"
android:icon="#drawable/ic_search"
android:title="#string/search_label"
app:actionViewClass="androidx.appcompat.widget.SearchView"
app:showAsAction="always|collapseActionView" />
</menu>
Then edit your onCreateOptionsMenu as follows to add the search item (kotlin code):
val menuInflater = menuInflater
menuInflater.inflate(R.menu.<your_toolbar_menu_name>, menu)
val searchItem = menu.findItem(R.id.action_search)
val searchManager =
this#YourActivityName.getSystemService(Context.SEARCH_SERVICE) as SearchManager
var searchView: SearchView? = null
if (searchItem != null) {
searchView = searchItem.actionView as SearchView
}
searchView?.setSearchableInfo(searchManager.getSearchableInfo(this#YourActivityName.componentName))
return super.onCreateOptionsMenu(menu)
I guess that you want this search to only appear when your Fragment is visible. To do that you should check if the fragment is visible or only run above code when the fragment transaction is done. Do ask if anything is not particularly clear.
I have to show back icon, Logo and text (Next) in Toolbar. Next is right aligned. I tried placing text via menu. I have set logo and back button to toolbar.
toolbar.setLogo(R.mipmap.logo);
toolbar.setNavigationIcon(R.mipmap.back);
Also, I have inflated following menu in onCreateOptionsMenu
Menu inflated:
<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"
>
<item
android:id="#+id/action_next"
android:title="#string/next"
app:showAsAction="always" />
Text Menu is not visible at all. if I put icon in menu item, it gets displayed.
I have used android.support.v7.widget.Toolbar.
Edited:
I solved it. In case someone else gets struck with such issue.
Please add
<item name="android:actionMenuTextColor">#color/blue</item>
in styles. Menu itemw as getting selected on click but was not visible, means it was showing white text color on white toolbar. Setting menuText color solved my problem.
Android Documentation explains that the withText option for showAsAction will
Also include the title text (defined by android:title) with the action item.
Since that is what you want, code the following.
<item
android:id="#+id/action_next"
android:title="#string/next"
app:showAsAction="always|withText" />
You can do something like this:
First, remove default title in your Activity:
getSupportActionBar().setDisplayShowTitleEnabled(false);
Then, your toolbar layout can be like this:
<LinearLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/material_blue"
android:elevation="5dp"
android:minHeight="?attr/actionBarSize" >
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:gravity="end"
android:text="#string/app_name"
android:textColor="#android:color/white" />
</android.support.v7.widget.Toolbar>
</LinearLayout>
And, in your activity handle the click event:
toolbarTop.findViewById(R.id.toolbar_title).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Log.d(TAG,"Clicked");
}
});
Try Changing to support widget. This worked for me
app:actionViewClass="android.support.v7.widget.SearchView"
This what it looked after the change
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<item android:id="#+id/search"
android:title="#string/search_title"
android:icon="#drawable/ic_search"
app:showAsAction="always|withText"
app:actionViewClass="android.support.v7.widget.SearchView"
tools:context=".AppHome.HomeActivity"/>
</menu>
If you are getting an empty action with no text but blank space in it,
it might happen if you have created your own tool bar in the layout and have also used the Action bar in your theme's parent.
If you are creating your own toolbar then use parent="Theme.MaterialComponents.DayNight.NoActionBar" in your themes, both normal and night themes.
It's happening because of the style used in your layout.
To solve this, define a new style and use it in your layout.
<style name="ToolBarStyle" parent="ThemeOverlay.MaterialComponents.Dark.ActionBar">
<item name="android:itemBackground">#fff</item> // background color of the menus
<item name="android:textColor">#000</item>// text color of the menus
</style>
Use it like this in your layout
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:theme="#style/ToolBarStyle"
app:popupTheme="#style/ThemeOverlay.MaterialComponents.Light"
android:background="#color/primary_pink"
android:minHeight="?attr/actionBarSize"
android:elevation="4dp"
/>
I have actually a problem with my Searchview on the Support AppCompat v7 lib 24.0.0.
The SearchView is not shown up no text and input text (look screenshot)
The searchquery work perfect.
Thats my menu
<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=".MainActivity">
<item
android:title="#string/search"
android:id="#+id/action_search"
android:icon="#drawable/ic_search_24dp"
app:showAsAction="ifRoom|collapseActionView"
app:actionViewClass="android.support.v7.widget.SearchView"/>
</menu>
And here my onCreateOptionsMenu;
menu.clear();
inflater.inflate(R.menu.menu_search, menu);
MenuItem searchItem = menu.findItem(R.id.action_search);
searchView = (SearchView) MenuItemCompat.getActionView(searchItem);
searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
#Override
public boolean onQueryTextSubmit(String query) {
//Perform the final search
return false;
}
#Override
public boolean onQueryTextChange(String newText) {
//Text has changed, apply filtering?
return false;
}
});
I hope someone can help me. :)
Sebastian
i have this problem too, i've changed Toolbar height to absolute value instead of wrap_content and problem solved. i don't know why but i think this issue is related to CoordinatorLayout and height of toolbar, something breaks the SearchView height. if i use LinearLayout instead of CoordinatorLayout and AppBarLayout it works.
menu.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/action_search"
android:icon="#drawable/ic_search_white_24dp"
android:orderInCategory="100"
android:title="#string/action_search"
app:actionViewClass="android.support.v7.widget.SearchView"
app:showAsAction="always|collapseActionView" />
</menu>
layout.xml
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="#dimen/toolbar_height"
android:paddingTop="#dimen/toolbar_top_padding"
android:background="?attr/colorPrimary"
app:title="#string/drawer_item_publisher_customization"
app:layout_scrollFlags="scroll|enterAlways|snap"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
app:tabGravity="fill"
style="#style/DefaultTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
toolbar_height value:
<dimen name="toolbar_height">75dp</dimen>
Before absolute height value (layout_height:"wrap_content"):
After absolute height value (layout_height:"75dp"):
if you are using theme: .NoActionBar
set this in your onCreate()
setSupportActionBar(toolbar);
This is very odd. I'm using build tools 25.0.1 and support lib 25.1.0. For me the accepted answer was not necessary, but the way the menu item was defined needs a small change. I need it like so:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/search"
android:title="#string/search_title"
android:icon="#drawable/ic_search_24dp"
app:showAsAction="always|collapseActionView"
app:actionViewClass="android.widget.SearchView"/>
Where app:showAsAction is the key. Lint underlines this as red and tells me:
Should use android:showAsAction when using the appcompat library.
However if I have it set to android:showAsAction then the search view simply does not appear. Go figure.
Make sure you have add AppCompat library to your project. Is your activity was extended "AppCompatActivity"?
And also showAsAction shoud be: showAsAction="always|collapseActionView"
Hope this help!
None of the answers worked for me. I realized my case was a bit different. I omitted this line inside the fragment's onViewCreated()
setHasOptionsMenu(true)
Worked for me
I'm trying to use Toolbar as an action bar, and I follow the Chris Banes guide:
https://chris.banes.me/2014/10/17/appcompat-v21/
Now following that setup I've an empty Toolbar, it seems that the getMenuInflater().inflate() doesn't work.
In my activity I've:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menuhome, menu);
[...]
and in onCreate():
Toolbar toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar);
setSupportActionBar(toolbar);
And this is my layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:allmytv="http://schemas.android.com/apk/res-auto"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
android:id="#+id/linearlayoutmain"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<android.support.v7.widget.Toolbar
xmlns:allmytv="http://schemas.android.com/apk/res-auto"
android:id="#+id/my_awesome_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary" />
<com.astuetz.PagerSlidingTabStrip
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="48dip"
allmytv:pstsIndicatorColor="#f57c1d" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
</android.support.v4.view.ViewPager>
</LinearLayout>
Where I'm wrong?
Inorder to use toolbar as actionbar you need to set the attribute windowActionBar as false.
Include the following in styles.xml
<style name="AppCompatTheme" parent="#style/Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="colorPrimary">#4285F6</item>
</style>
In manifest.xml under tag use the above theme
android:theme="#style/AppCompatTheme"
I have used toolbar to inflate the menu:
toolbar.inflateMenu(R.menu.your_toolbar_menu);
This was absolutely a very specific issue.
The issue was that I have a splashscreen setted with :
setContentView(R.layout.splashhome);
Toolbar was empty because I call setSupportActionBar(toolbar) when the splashscreen was active.
Moving the setSupportActionBar(toolbar) to the right place fixed it!
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.
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.
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>