第一步
將打算使用Toolbar的Activity繼承AppCompatActivity呀闻。為什么要讓Activity繼承這個(gè)類呢捡多?我們來(lái)看下官方文檔對(duì)AppCompatActivity的介紹:You can add an ActionBar to your activity when running on API level 7 or higher by extending this class for your activity and setting the activity theme to Theme.AppCompat or a similar theme.就是說(shuō)垒手,我們可以通過(guò)繼承AppCompatActivity類和設(shè)置Theme.AppCompat主題科贬,來(lái)使我們可以添加一個(gè)ActionBar。
public class MainActivity extends AppCompatActivity {
@Overrideprotected
void onCreate(Bundle savedInstanceState) {
...
}
}
第二步
設(shè)置Theme.AppCompat主題乘综。Theme.AppCompat主題到底代表這什么呢瘾带,讓我們來(lái)看看Theme.AppCompat的官方文檔:Themes in the "Theme.AppCompat" family will contain an action bar by default. 就是說(shuō)看政,"Theme.AppCompat"系列的主題都會(huì)默認(rèn)包含一個(gè)ActionBar允蚣。"Theme.AppCompat"主題有兩個(gè)子主題嚷兔,我們會(huì)用到:
- "Theme.AppCompat.Light.NoActionBar"主題冒晰,當(dāng)設(shè)置為這個(gè)主題時(shí)壶运,Activity將沒(méi)有默認(rèn)的Actionbar蒋情。源代碼如下
<style name="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
- "Theme.AppCompat.Light.NoActionBar"主題棵癣,這個(gè)主題Activity也沒(méi)有Action Bar狈谊,同時(shí)Activity背景變成了深色沟沙。
<style name="Theme.AppCompat.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
當(dāng)然我們并不是直接使用系統(tǒng)提供的Theme尝胆,而是繼承某個(gè)Theme煎娇,進(jìn)行一定程度的自定義。我們?cè)趕tyles.xml寫下如下代碼:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!--colorPrimary主要負(fù)責(zé)的是App Bar的背景顏色 -->
<item name="colorPrimary">@color/colorPrimary</item>
<!--colorPrimaryDark主要負(fù)責(zé)的是狀態(tài)欄status bar的背景顏色 -->
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<!--colorAccent主要負(fù)責(zé)的是某些選擇控件的背景顏色 -->
<item name="colorAccent">@color/colorAccent</item>
</style>
</resources>
第三步
將剛剛自定義的Theme,在menifest.xml文件中的Application標(biāo)簽中聲明因妙,也可以在Activity標(biāo)簽中聲明攀涵;
<menifest...>
...
<Application
...
android:theme="@style/Apptheme">
...
</Application>
</menifest>
第四步
在Activity的布局文件中添加Toolbar
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
/>
?attr/actionBarsize 是指使用Theme中該屬性actionBarSize的值以故。
第五步
在Java代碼中添加Toolbar裆操,并且可以通過(guò)Java語(yǔ)句添加App圖標(biāo)昆烁,導(dǎo)航圖標(biāo)缎岗,主標(biāo)題静尼,副標(biāo)題,自定義內(nèi)容等等密强∶├桑可以通過(guò)查閱Toolbar官方文檔來(lái)深入學(xué)習(xí)蜗元。下面的代碼是位于該Activity的onCreate()方法中或渤。
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setLogo(R.mipmap.ic_launcher);
toolbar.setTitle("我是主標(biāo)題");
toolbar.setSubtitle("我是副標(biāo)題");
toolbar.setNavigationIcon(R.mipmap.ic_launcher);
toolbar.inflateMenu(R.menu.menu_main);
第六步
添加Toolbar上的菜單。首先在res/menu文件夾中添加menu_main.xml文件奕扣,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_edit"
android:title="編輯"
android:orderInCategory="80"
android:icon="@drawable/ic_menu_home"
app:showAsAction="always"/>
<item
android:id="@+id/action_setting"
android:title="分享"
android:orderInCategory="90"
app:showAsAction="never"/>
<item
android:id="@+id/action_share"
android:title="設(shè)置"
android:orderInCategory="100"
app:showAsAction="never"/>
</menu>
然后在Java代碼中將其添加到toolbar中薪鹦,并為toolbar添加點(diǎn)擊事件,下面的代碼也在Activity的onCreate()方法中惯豆。
onMenuItemClickListener = new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
String msg = "";
switch (item.getItemId()){
case R.id.action_edit:
msg += "edit";
break;
case R.id.action_setting:
msg += "setting";
break;
case R.id.action_share:
msg += "share";
break;
}
if (!msg.equals("")){
Toast.makeText(MainActivity.this,msg,Toast.LENGTH_LONG).show();
}
return true;
}
};
toolbar.setOnMenuItemClickListener(onMenuItemClickListener);
到此,Toolbar的基本功能就完成了。下面是一些零碎的注意事項(xiàng)端考。
顏色設(shè)置
- 設(shè)置狀態(tài)欄status bar的顏色
<item name="colorPrimaryDark">#000000</item>
或者在布局文件中設(shè)置Toolbar的背景顏色
- 設(shè)置App bar上的主標(biāo)題的顏色,overflow menu選項(xiàng)的字體顏色
<item name="android:textColorPrimary">@android:color/holo_red_light</item>
注意textColorPrimary這個(gè)屬性除了設(shè)置主標(biāo)題的顏色外椿浓,還設(shè)置了overflow menu中選項(xiàng)的字體顏色左腔。除了這個(gè)方法巧还,還可以在toolbar的布局文件中設(shè)置。這個(gè)方法只會(huì)設(shè)置主標(biāo)題的顏色。所以惧辈,可以利用這兩個(gè)方法边翁,現(xiàn)在textColorPrimary中設(shè)置overflow menu選項(xiàng)字體顏色啊胶,再用app:titleTextColor覆蓋主標(biāo)題的顏色痴晦。注意:是"app:" 不是"android:"碧浊。
xmlns:app="http://schemas.android.com/apk/res-auto"
...
app:titleTextColor="@android:color/white"
- 設(shè)置App bar上的副標(biāo)題的顏色
<item name="android:textColorSecondary">#000000</item>
或者在布局文件中
app:subtitleTextColor="@android:color/black"
其中第二種會(huì)覆蓋第一中方法劳较。注意:是"app:" 不是"android:"。
- 設(shè)置控制元件(switch等按鈕)被選定或者選擇的顏色
<item name="android:colorAccent">#000000</item>
- 設(shè)置app的背景色
<item name="android:windowBackground">#000000</item>
- 設(shè)置各控制元件(switch等)的默認(rèn)顏色砖第,以及overflow menu按鈕(三個(gè)點(diǎn))的顏色
<item name="colorControlNormal">#000000</item>
- 設(shè)置導(dǎo)航欄的背景顏色袱院,只在Android 5.0后有效
<item name="navigationBarColor">#000000</item>
- 修改overflow menu中的選項(xiàng)的文字大小,(但是也會(huì)Activity中的TextView中的文字的大小,不過(guò)可以在布局文件中更改)
<item name="android:textSize">50sp</item>
最后
- 這只是Toolbar的基本使用欣喧,還有很多高階的使用驯鳖,比如和CoordinatorLayout在一起的動(dòng)畫效果等等记舆,還要繼續(xù)學(xué)習(xí)盛正。
- Toolbar在Java代碼和XML文字中還有更多設(shè)置续崖,可以通過(guò)查閱Toolbar官方文檔來(lái)深入學(xué)習(xí)逻恐。
主要參考文章:
- Android開(kāi)發(fā):最詳細(xì)的 Toolbar 開(kāi)發(fā)實(shí)踐總結(jié)
-
android:ToolBar詳解(手把手教程)
感謝上面兩篇文章作者的分享惭每,本文是通過(guò)學(xué)習(xí)這兩篇文章宏赘,查閱官方文檔察署,進(jìn)行實(shí)踐驗(yàn)證的寫出來(lái)進(jìn)行自我總結(jié)嘶是,再次分享給大家聂喇。