1 开始使用
compile 'com.android.support:appcompat-v7:25.3.1'
- 去掉默认的Actionbar
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
- 继承AppCompatActivity的可以直接使用
setSupportActionBar(mToolBar);`
- 基本配置
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
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="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?actionBarSize"
/>
2 常用属性
android:elevation="4dp"
app:navigationIcon="@drawable/icon_back"
app:titleTextAppearance="@style/Toolbar.TitleText"
//TextView作为自定义标题 样式统一
android:textAppearance="@style/TextAppearance.Widget.AppCompat.Toolbar.Title"
//定义样式
<style name="ClassicAppBarThemeOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="ClassicPopupThemeOverlay" parent="ThemeOverlay.AppCompat.Light" />
//使用 注意：换样式用android:theme=”” 不用style=”“
android:theme="@style/ClassicAppBarThemeOverlay"
app:popupTheme="@style/ClassicPopupThemeOverlay"
3 菜单
- 使用menu定义弹出菜单
//showAsAction
//always：显示在主界面上
//never：不显示在主界面，只出现在更多中
//ifRoom：有位置才显示，否则折叠到更多
<?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/share"
android:title="分享"
android:icon="@drawable/share"
android:orderInCategory="3"
app:showAsAction="ifRoom" />
<item
android:id="@+id/cacle"
android:title="收藏"
android:orderInCategory="1"
app:showAsAction="never" />
<item
android:id="@+id/setting"
android:title="设置"
android:icon="@drawable/setting"
android:orderInCategory="4"
app:showAsAction="never" />
</menu>
- 自定义的ActionView 点击效果 与普通的menuItem一致
style="@style/Widget.AppCompat.ActionButton"
自定义菜单：http://blog.csdn.net/richiezhu/article/details/52228251
方法1
- 设置菜单
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_main,menu);
return true;
}
设置监听
@Override
protected boolean onOptionsItemSelected(MenuItem item) {
Intent intent;
switch (item.getItemId()) {
case R.id.action_favorite:
// User chose the "Favorite" action, mark the current item
// as a favorite...
return true;
case R.id.action_favorite:
// User chose the "Favorite" action, mark the current item
// as a favorite...
return true;
default:
// If we got here, the user's action was not recognized.
// Invoke the superclass to handle it.
return super.onOptionsItemSelected(item);
}
}
方法2
- 设置菜单
toolbar.inflateMenu(R.menu.base_toolbar_menu);
设置监听
toolbar.setOnMenuItemClickListener
- 动态改变menu item显示或隐藏
toolbar.getMenu().findItem(R.id.menu_refresh).setVisible(false);
4 常用方法
setSupportActionBar(toolbar);`
getSupportActionBar().setLogo(R.mipmap.ic_launcher);
getSupportActionBar().setHomeButtonEnabled(true); //设置返回键可用
// 显示标题和子标题, 对应ActionBar.DISPLAY_SHOW_TITLE
getSupportActionBar().setDisplayShowTitleEnabled(true);
// 显示应用的Logo 左上角图标icon
getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setDisplayUseLogoEnabled(true);
//使左上角图标是否显示，对应id为android.R.id.home，对应ActionBar.DISPLAY_SHOW_HOME
getSupportActionBar().setDisplayShowHomeEnabled(true);
// 给左上角图标的左边加上一个返回的图标，决定左上角图标的左侧是否有向左的小箭头, true 有小箭头，并且图标可以点击
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
//setNavigationIcon 需要放在 setSupportActionBar 之后才会生效
toolbar.setNavigationIcon(R.mipmap.ic_drawer_home);//设置导航栏图标
toolbar.setLogo(R.mipmap.ic_launcher);//设置app logo
toolbar.setTitle("Title");//设置主标题
toolbar.setSubtitle("Subtitle");//设置子标题
toolbar.inflateMenu(R.menu.base_toolbar_menu);//设置右上角的填充菜单
toolbar.setOnMenuItemClickListener
//
toolbar.setTitleTextColor
toolbar.setTitleTextAppearance
//
toolbar.setSubtitleTextColor
toolbar.setSubtitleTextAppearance
//
toolbar.setTitleMargin
toolbar.setPopupTheme
toolbar.setOverflowIcon
5 更改样式
- 改变弹出菜单文字样式
- android:textColorPrimary
- android:colorBackground
//写在Toolbar主题下
<item name="android:textColor">@android:color/white</item>
<item name="android:textSize">25dp</item>
- 改变主界面上的菜单文字样式、更多菜单的按钮图标
<item name="actionMenuTextColor">@android:color/white</item>
<item name="android:textSize">25dp</item>
<style name="ToolbarTheme" parent="Theme.AppCompat.Light">
<item name="actionOverflowButtonStyle">@style/MyActionOverflowButton</item>
</style>
<style name="MyActionOverflowButton2" parent="android:style/Widget.Holo.Light.ActionButton.Overflow">
<item name="android:src">@mipmap/ic_menu_more_overflow</item>
</style>
<style name="MyActionOverflowButton" parent="Widget.AppCompat.ActionButton.Overflow">
<item name="android:src">@drawable/abc_ic_menu_moreoverflow_mtrl_alpha</item>
</style>
6 返回按钮
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
- 监听返回按钮1
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "返回", Toast.LENGTH_SHORT).show();
}
});
- 监听返回按钮2
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
//
return true;
}
return false;
}
7 自定义左侧按钮和中间文字
<?xml version="1.0" encoding="utf-8"?>
<!--
app:title="title"
-->
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/id_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:visibility="gone"
app:popupTheme="@style/ThemeOverlay.AppCompat"
>
<LinearLayout
android:id="@+id/id_ll_toolbar_left"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
>
<ImageView
android:id="@+id/id_toolbar_left_iv"
android:layout_width="24dp"
android:layout_height="24dp"
/>
<TextView
android:id="@+id/id_toolbar_left_tv"
android:textAppearance="@style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle"
android:textColor="@color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:text="地区"
/>
</LinearLayout>
<!--toolbar 默认不显示 android:visibility="gone" 定义了app:title="XXX" 就行 无需再配置自身文字-->
<TextView
android:id="@+id/id_toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:lines="1"
android:textAppearance="@style/TextAppearance.Widget.AppCompat.Toolbar.Title"
android:visibility="gone"
/>
</android.support.v7.widget.Toolbar>
7 参考文档
- Toolbar的使用 //www.greatytc.com/p/12c4c8348a1a
- Material Design 之 Toolbar 开发实践总结 //www.greatytc.com/p/e2ae6aaff696
