本篇文章僅為個人學(xué)習(xí)記錄跪解;
Toolbar是android.support.v7包中的卑雁,所以需要導(dǎo)入appcompat-v7包码邻;
在使用Toolbar時兽肤,需要隱藏掉原來的ActionBar套腹,直接在主題中修改:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> </style>
或者
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
1、創(chuàng)建布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.sl.mydemo.MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent" //背景
/>
</LinearLayout>
2资铡、設(shè)置屬性
mToolbar = findViewById(R.id.toolbar);
mToolbar.setTitle("測試標(biāo)題"); //設(shè)置標(biāo)題 布局app:title
mToolbar.setSubtitle("測試子標(biāo)題"); //設(shè)置子標(biāo)題 布局 app:subTitle
mToolbar.setLogo(R.mipmap.ic_launcher); //設(shè)置圖標(biāo) 布局 app:logo
//設(shè)置標(biāo)題和子標(biāo)題顏色
mToolbar.setTitleTextColor(Color.parseColor("#FFFFFF")); //設(shè)置標(biāo)題顏色 布局 app:titleTextColor
mToolbar.setSubtitleTextColor(Color.parseColor("#FFFFFF")); //設(shè)置子標(biāo)題顏色 布局 app:subTitleTextColor
//修改主標(biāo)題的外觀电禀、顏色
mToolbar.setTitleTextAppearance(this,R.style.Theme_Toolbar_Base_Title); // 布局:app:titleTextAppearance
mToolbar.setPopupTheme(R.style.PopupMenu); //溢出菜單彈窗設(shè)置 布局 app:popupTheme
mToolbar.setSubtitleTextAppearance(this,R.style.Theme_Toolbar_Base_Title); //布局:app:subTitleTextAppearance
//設(shè)置導(dǎo)航圖標(biāo)要在setSupportActionBar后
setSupportActionBar(mToolbar);
mToolbar.setNavigationIcon(android.R.drawable.ic_menu_myplaces); //設(shè)置導(dǎo)航圖標(biāo)
// getSupportActionBar().setDisplayHomeAsUpEnabled(true) ; //左側(cè)按鈕
3、使用到的樣式
<!-- 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>
<item name="android:textColorSecondary">#FFFFFF</item> <!--菜單右上角更多圖標(biāo)的顏色-->
</style>
<!--Toolbar 標(biāo)題字體大小顏色-->
<style name="Theme.Toolbar.Base.Title" parent="@style/TextAppearance.Widget.AppCompat.Toolbar.Title">
<item name="android:textSize">20dp</item>
<item name="android:textColor">#FFFFFF</item>
</style>
<!--Toolbar 標(biāo)題字體大小顏色-->
<style name="Theme.Toolbar.Base.SubTitle" parent="@style/TextAppearance.Widget.AppCompat.Toolbar.Title">
<item name="android:textSize">14dp</item>
<item name="android:textColor">#FFFFFF</item>
</style>
<!--溢出菜單顏色笤休、背景尖飞、顯示位置-->
<style name="PopupMenu" parent="ThemeOverlay.AppCompat.Light">
<item name="android:colorBackground">@color/colorAccent</item>
<item name="android:textColor">#FFFFFF</item>
<item name="overlapAnchor">false</item>
</style>
4、添加菜單
定義res/menu/menu.main.xml文件
<?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"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".MainActivity">
<item android:id="@+id/action_search"
android:title="搜索"
android:icon="@android:drawable/ic_menu_search"
app:showAsAction="ifRoom"/>
<item android:id="@+id/action_notifications"
android:title="通知"
android:icon="@android:drawable/ic_notification_overlay"
app:showAsAction="ifRoom"/>
<item android:id="@+id/action_setting"
android:title="設(shè)置"
android:icon="@android:drawable/ic_menu_more"
app:showAsAction="never"/>
<!--app:showAsAction="if/never",app是自定義命名空間店雅,因為Actiivyt是繼承AppCompatActivity政基,是support
v7包中的,不是原生的闹啦,所以不能使用android:showAction否則會報錯沮明。ifRoom表示有空間則顯示,never表
示從不顯示窍奋,而是會通過overFlowwindow顯示-->
</menu>
將menu布局添加到toolbar中:
//重寫此方法荐健,將菜單加載進(jìn)ToolBar酱畅,如果沒有Toolbar,菜單是加載不出來滴
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main,menu);
return true;
}
5、點擊事件
左側(cè)按鈕點擊事件
設(shè)置導(dǎo)航圖標(biāo):mToolbar.setNavigationIcon(android.R.drawable.ic_menu_myplaces);
原生顯示左側(cè)返回按鈕圖標(biāo):getSupportActionBar().setDisplayHomeAsUpEnabled(true) ;
點擊事件江场,在setSupportActionBar(mToolBar)后:
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()){
case android.R.id.home:
Snackbar.make(mToolbar,"左側(cè)按鈕",Snackbar.LENGTH_SHORT).show();
break;
}
return true;
}
菜單點擊事件:
//為菜單添加點擊事件,需要在setSupportActionBar之后
mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.action_search:
Snackbar.make(mToolbar,"搜索",Snackbar.LENGTH_SHORT).show();
break;
case R.id.action_notifications:
Snackbar.make(mToolbar,"通知",Snackbar.LENGTH_SHORT).show();
break;
case R.id.action_setting:
Snackbar.make(mToolbar,"設(shè)置",Snackbar.LENGTH_SHORT).show();
break;
}
return true; //返回true消費事件
}
});
6纺酸、toolbar中直接布局標(biāo)題等信息,只當(dāng)簡單控件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.sl.mydemo.MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="45dp"
android:background="@color/colorAccent"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="標(biāo)題"
android:textSize="18dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginRight="15dp"
android:text="右側(cè)按鈕"
/>
</android.support.v7.widget.Toolbar>
</LinearLayout>