1 開始使用
compile 'com.android.support:appcompat-v7:25.3.1'
- 去掉默認(rèn)的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作為自定義標(biāo)題 樣式統(tǒng)一
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：不顯示在主界面代承，只出現(xiàn)在更多中
//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="設(shè)置"
android:icon="@drawable/setting"
android:orderInCategory="4"
app:showAsAction="never" />
</menu>
- 自定義的ActionView 點(diǎn)擊效果 與普通的menuItem一致
style="@style/Widget.AppCompat.ActionButton"
自定義菜單：http://blog.csdn.net/richiezhu/article/details/52228251
方法1
- 設(shè)置菜單
@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;
}
設(shè)置監(jiān)聽
@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
- 設(shè)置菜單
toolbar.inflateMenu(R.menu.base_toolbar_menu);
設(shè)置監(jiān)聽
toolbar.setOnMenuItemClickListener
- 動態(tài)改變menu item顯示或隱藏
toolbar.getMenu().findItem(R.id.menu_refresh).setVisible(false);
4 常用方法
setSupportActionBar(toolbar);`
getSupportActionBar().setLogo(R.mipmap.ic_launcher);
getSupportActionBar().setHomeButtonEnabled(true); //設(shè)置返回鍵可用
// 顯示標(biāo)題和子標(biāo)題, 對應(yīng)ActionBar.DISPLAY_SHOW_TITLE
getSupportActionBar().setDisplayShowTitleEnabled(true);
// 顯示應(yīng)用的Logo 左上角圖標(biāo)icon
getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setDisplayUseLogoEnabled(true);
//使左上角圖標(biāo)是否顯示，對應(yīng)id為android.R.id.home，對應(yīng)ActionBar.DISPLAY_SHOW_HOME
getSupportActionBar().setDisplayShowHomeEnabled(true);
// 給左上角圖標(biāo)的左邊加上一個(gè)返回的圖標(biāo)耗式，決定左上角圖標(biāo)的左側(cè)是否有向左的小箭頭, true 有小箭頭排苍，并且圖標(biāo)可以點(diǎn)擊
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
//setNavigationIcon 需要放在 setSupportActionBar 之后才會生效
toolbar.setNavigationIcon(R.mipmap.ic_drawer_home);//設(shè)置導(dǎo)航欄圖標(biāo)
toolbar.setLogo(R.mipmap.ic_launcher);//設(shè)置app logo
toolbar.setTitle("Title");//設(shè)置主標(biāo)題
toolbar.setSubtitle("Subtitle");//設(shè)置子標(biāo)題
toolbar.inflateMenu(R.menu.base_toolbar_menu);//設(shè)置右上角的填充菜單
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>
- 改變主界面上的菜單文字樣式、更多菜單的按鈕圖標(biāo)
<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);
- 監(jiān)聽返回按鈕1
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "返回", Toast.LENGTH_SHORT).show();
}
});
- 監(jiān)聽返回按鈕2
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
//
return true;
}
return false;
}
7 自定義左側(cè)按鈕和中間文字
<?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="地區(qū)"
/>
</LinearLayout>
<!--toolbar 默認(rèn)不顯示 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的使用 http://www.reibang.com/p/12c4c8348a1a
- Material Design 之 Toolbar 開發(fā)實(shí)踐總結(jié) http://www.reibang.com/p/e2ae6aaff696
