Android 筆記 —— Toolbar 使用總結(jié)

Toolbar 是在 Android5.0 推出的一款 MD 風(fēng)格的導(dǎo)航控件熏挎,主要是為了替換 Actionbar 的骚腥。與 Actionbar 相比懊悯,Toolbar 非常靈活窗悯,我們可以自由地在 Toolbar 內(nèi)添加子控件区匣。

使用 Toolbar

由于 Toolbar 是在 Android5.0 才開始加上的,低版本要使用的話蒋院,需要引入 support-v7 兼容包亏钩,使用 android.support.v7.widget.Toolbar 進(jìn)行開發(fā)。

compile 'com.android.support:appcompat-v7:25.3.1'
修改 style

打開 res/values/styles.xml欺旧,默認(rèn)配置如下:

<!-- Base application theme. -->
   <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
       <!-- Customize your theme here. -->
       <item name="colorPrimary">@color/colorPrimary</item>
       <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
       <item name="colorAccent">@color/colorAccent</item>
   </style>

來看一下 style 屬性所對應(yīng)的涵義


style 屬性
隱藏默認(rèn)的 Toolbar
  • 方式1

改成其他沒有 Toolbar 的主題

parent="Theme.AppCompat.Light.NoActionBar"
  • 方式2

自己建立一個主題姑丑,并在屬性中設(shè)置無 Toolbar

<style name="AppTheme" parent="AppTheme.Base">
   </style>
   
   <style name="AppTheme.Base" parent="AppTheme">
       <!--將ActionBar隱藏,這里使用ToolBar-->
       <item name="windowActionBar">false</item>
       <!-- 使用 API Level 22以上編譯的話,要拿掉前綴字 -->
       <item name="windowNoTitle">true</item>
       <!--colorPrimaryDark對應(yīng)狀態(tài)欄的顏色-->
       <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
       <!--colorPrimary 對應(yīng)ToolBar的顏色-->
       <item name="colorPrimary">@color/colorPrimary</item>
       <!--colorAccent 對應(yīng)EditText編輯時辞友、RadioButton選中栅哀、CheckBox等選中時的顏色。-->
       <item name="colorAccent">@color/colorAccent</item>
       <!--窗口的顏色-->
       <item name="android:windowBackground">@color/colorWindow</item>
   </style>

如果不隱藏默認(rèn) Toolbar称龙,在代碼中對 Toolbar 進(jìn)行 setSupportActionBar 操作時留拾,會報錯:

Caused by: java.lang.IllegalStateException: This Activity already has an action bar 
supplied by the window decor. Do not request Window.FEATURE_SUPPORT_ACTION_BAR and set 
windowActionBar to false in your theme to use a Toolbar instead.
在布局文件中添加 Toolbar 控件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:id="@+id/activity_main"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   tools:context="com.ginkwang.toolbarsample.MainActivity">
?
   <android.support.v7.widget.Toolbar
       android:id="@+id/tb_main"
       android:layout_width="match_parent"
       android:layout_height="?attr/actionBarSize"
       android:background="?attr/colorPrimary"/>
</RelativeLayout>

?attr/actionBarSize : 表示根據(jù)屏幕的分辨率采用系統(tǒng)默認(rèn)的高度 如果低版本也要使用的話,則需要使用v7包的,否則只有api21上才能有效

Java 文件中調(diào)用

Toolbar 的一些屬常用屬性也在代碼中使用并寫明作用了。

public class MainActivity extends AppCompatActivity {
?
   private Toolbar mTbMain;
?
   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);
       initView();
   }
?
   private void initView() {
       mTbMain = (Toolbar) findViewById(R.id.tb_main);
       //設(shè)置 APP logo
       mTbMain.setLogo(R.mipmap.ic_logo);
       //設(shè)置主標(biāo)題鲫尊,默認(rèn)為 app_label
       mTbMain.setTitle("標(biāo)題");
       //設(shè)置主標(biāo)題文字顏色
       mTbMain.setTitleTextColor(getResources().getColor(R.color.colorWhiteOne));
       //設(shè)置副標(biāo)題
       mTbMain.setSubtitle("副標(biāo)題");
       //設(shè)置副標(biāo)題顏色
       mTbMain.setSubtitleTextColor(getResources().getColor(R.color.colorWhiteTwo));
       //設(shè)置側(cè)邊欄(抽屜)的按鈕
       mTbMain.setNavigationIcon(R.mipmap.ic_navigation);
       //取代原本的 Actionbar
       setSupportActionBar(mTbMain);
   }
}

效果圖:

Toolbar 基本使用

Toolbar 的高級用法

NavigationIcon 點擊事件

設(shè)置 NavigationIcon 的點擊事件,需要放在 setSupportActionBar 之后設(shè)置才會生效,因為setSupportActionBar 里面也會 setNavigationOnClickListener()

setSupportActionBar(mTbMain);
//設(shè)置NavigationIcon的點擊事件,需要放在setSupportActionBar之后設(shè)置才會生效,
//因為setSupportActionBar里面也會setNavigationOnClickListener
mTbMain.setNavigationOnClickListener(new View.OnClickListener() {
     @Override
     public void onClick(View pView) {
         // TODO: 2017/5/5 添加抽屜
     }
});
添加菜單 Menu
  • 菜單布局
<?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/menu_item_share"
       android:icon="@mipmap/ic_share"
       android:orderInCategory="1"
       android:title="@string/menu_share"
       app:showAsAction="always"/>
?
   <item
       android:id="@+id/menu_item_about"
       android:icon="@mipmap/ic_about"
       android:orderInCategory="2"
       android:title="@string/menu_about"
       app:showAsAction="ifRoom"/>
?
   <item
       android:id="@+id/menu_item_more"
       android:icon="@mipmap/ic_more"
       android:orderInCategory="3"
       android:title="@string/menu_more"
       app:showAsAction="never"/>
</menu>

其中痴柔,
android:orderInCategory 屬性代表 actionbar 里每個item的優(yōu)先級,值越大優(yōu)先級越低
app:showAsAction 屬性表示是否在 ToolBar 上顯示按鈕,屬性值有如下幾種:

  • always:使菜單項一直顯示在ToolBar上

  • ifRoom:如果有足夠的空間疫向,這個值會使菜單項顯示在ToolBar上

  • never:使菜單項永遠(yuǎn)都不出現(xiàn)在ToolBar上,在…的子項中顯示

  • withText:使菜單項和它的圖標(biāo)咳蔚,菜單文本一起顯示

由于showAsAction屬性是在支持包中定義的豪嚎,所以需要添加命名空間:

xmlns:app="http://schemas.android.com/apk/res-auto"
Java 代碼中添加 Menu 監(jiān)聽
  • 方法一
    重寫onCreateOptionsMenu(Menu menu)、onOptionsItemSelected(MenuItem item)
@Override
   public boolean onCreateOptionsMenu(Menu menu) {
       getMenuInflater().inflate(R.menu.menu_main, menu);
       return true;
   }
?
   @Override
   public boolean onOptionsItemSelected(MenuItem item) {
       switch (item.getItemId()) {
           case R.id.menu_item_share:
               Toast.makeText(MainActivity.this, "分享", Toast.LENGTH_LONG).show();
               break;
?
           case R.id.menu_item_about:
               Toast.makeText(MainActivity.this, "關(guān)于", Toast.LENGTH_LONG).show();
               break;
?
           case R.id.menu_item_more:
               Toast.makeText(MainActivity.this, "更多", Toast.LENGTH_LONG).show();
               break;
       }
       return true;
   }
  • 方法二
    重寫onCreateOptionsMenu(Menu menu)谈火,通過toolbar.setOnMenuItemClickListener()監(jiān)聽
mTbMain.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
           @Override
           public boolean onMenuItemClick(MenuItem item) {
               switch (item.getItemId()) {
                   case R.id.menu_item_share:
                       Toast.makeText(MainActivity.this, "分享", Toast.LENGTH_LONG).show();
                       break;
?
                   case R.id.menu_item_about:
                       Toast.makeText(MainActivity.this, "關(guān)于", Toast.LENGTH_LONG).show();
                       break;
?
                   case R.id.menu_item_more:
                       Toast.makeText(MainActivity.this, "更多", Toast.LENGTH_LONG).show();
                       break;
               }
               return true;
           }
       });

跟 NavigationIcon 監(jiān)聽事件一樣侈询,都是要設(shè)置在 setSupportActionBar 之后才會生效。

效果圖
Toolbar 上 menu icon
隱藏的 menu icon

參考
Android開發(fā):最詳細(xì)的 Toolbar 開發(fā)實踐總結(jié)
ToolBar的使用

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末堆巧,一起剝皮案震驚了整個濱河市妄荔,隨后出現(xiàn)的幾起案子泼菌,更是在濱河造成了極大的恐慌谍肤,老刑警劉巖,帶你破解...
    沈念sama閱讀 219,427評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件哗伯,死亡現(xiàn)場離奇詭異荒揣,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)焊刹,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,551評論 3 395
  • 文/潘曉璐 我一進(jìn)店門系任,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人虐块,你說我怎么就攤上這事俩滥。” “怎么了贺奠?”我有些...
    開封第一講書人閱讀 165,747評論 0 356
  • 文/不壞的土叔 我叫張陵霜旧,是天一觀的道長。 經(jīng)常有香客問我儡率,道長挂据,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,939評論 1 295
  • 正文 為了忘掉前任儿普,我火速辦了婚禮崎逃,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘眉孩。我一直安慰自己个绍,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,955評論 6 392
  • 文/花漫 我一把揭開白布浪汪。 她就那樣靜靜地躺著巴柿,像睡著了一般。 火紅的嫁衣襯著肌膚如雪吟宦。 梳的紋絲不亂的頭發(fā)上篮洁,一...
    開封第一講書人閱讀 51,737評論 1 305
  • 那天,我揣著相機(jī)與錄音殃姓,去河邊找鬼袁波。 笑死瓦阐,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的篷牌。 我是一名探鬼主播睡蟋,決...
    沈念sama閱讀 40,448評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼枷颊!你這毒婦竟也來了戳杀?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,352評論 0 276
  • 序言:老撾萬榮一對情侶失蹤夭苗,失蹤者是張志新(化名)和其女友劉穎信卡,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體题造,經(jīng)...
    沈念sama閱讀 45,834評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡傍菇,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,992評論 3 338
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了界赔。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片丢习。...
    茶點故事閱讀 40,133評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖淮悼,靈堂內(nèi)的尸體忽然破棺而出咐低,到底是詐尸還是另有隱情,我是刑警寧澤袜腥,帶...
    沈念sama閱讀 35,815評論 5 346
  • 正文 年R本政府宣布见擦,位于F島的核電站,受9級特大地震影響瞧挤,放射性物質(zhì)發(fā)生泄漏锡宋。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,477評論 3 331
  • 文/蒙蒙 一特恬、第九天 我趴在偏房一處隱蔽的房頂上張望执俩。 院中可真熱鬧,春花似錦癌刽、人聲如沸役首。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,022評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽衡奥。三九已至,卻和暖如春远荠,著一層夾襖步出監(jiān)牢的瞬間矮固,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,147評論 1 272
  • 我被黑心中介騙來泰國打工譬淳, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留档址,地道東北人盹兢。 一個月前我還...
    沈念sama閱讀 48,398評論 3 373
  • 正文 我出身青樓,卻偏偏與公主長得像守伸,于是被迫代替她去往敵國和親绎秒。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,077評論 2 355

推薦閱讀更多精彩內(nèi)容