Overflow menu的样式
- Overflow menu显示位置
在Holo Theme时代,overflow menu会显示在原生ActionBar的下方,而在API>=21,结合了Toolbar使用的overflow menu则会覆盖在Toolbar上显示。如果依然想要实现类似Holo主题的效果,不重叠,overflow在Toolbar下方,可以使用如下方式:
在styles文件中的AppTheme中增加
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!------------->
<item name="actionOverflowMenuStyle">@style/OverflowMenu</item>
<!------------->
</style>
<style name="OverflowMenu" parent="Widget.AppCompat.PopupMenu.Overflow">
<item name="overlapAnchor">false</item>
</style>
为了在API >= 21的设备上也能生效,需要在工程res下的values-v21文件夹中增加同名styles文件,在其中定义:
<style name="OverflowMenu" parent="Widget.AppCompat.PopupMenu.Overflow">
<item name="android:overlapAnchor">false</item>
</style>
还有另外一种情况,就是Activity使用了这个AppTheme,同时Activity内的Toolbar单独使用了popupTheme属性,像这样:
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true"
app:popupTheme="@style/ToolbarPopupMenu"/>
这个时候AppTheme中关于Overflow menu的样式定义会被popupTheme覆盖掉,没有了效果。解决办法就是在ToolbarPopupMenu中增加OverflowMenu:
<style name="ToolbarPopupMenu" parent="Base.ThemeOverlay.AppCompat.ActionBar">
<item name="actionOverflowMenuStyle">@style/OverflowMenu</item>
</style>
- Overflow menu的字体颜色及背景
实现给Toolbar的溢出菜单设置字体颜色及背景,Toolbar增加属性
app:popupTheme="@style/ToolbarPopupMenu"
属性具体内容:
<style name="ToolbarPopupMenu" parent="Base.ThemeOverlay.AppCompat.ActionBar">
<item name="android:textColorPrimary">#ffffff</item>
<item name="android:background">@color/primary</item>
</style>
Menu Item
- actionLayout
可以给Toolbar上显示的Menu定义一个简单的布局,只要menu的item添加以下属性即可
app:actionLayout="@layout/action_layout"
以这种方式定义了menu的图标之后,在Activity#onOptionsItemSelected()中无法再响应其点击事件,解决办法是在Activity#onCreateOptionsMenu()中获取到menu,给这个menu设置点击事件:
public boolean onCreateOptionsMenu(Menu menu){
getMenuInflater().inflate(R.menu.menu_action, menu);
View view = menu.getItem(0).getActionView();
view.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
}
});
return true;
}