ToolBar
ToolBar其實是一個ActionBar的變體,大大的擴展了ToolBar,我們可以像對待一個獨立的控件去使用ToolBar,可以將他放在屏幕的任何位置,還可以將他改變高度或者在ToolBar上使用動畫,從SDK看,很多actionBar的方法都已經廢棄了,所以問們可以斷定,未來ToolBar將完全取代ActonBar
1布局文件
toolBar可放在任何位置,只要你想...
<android.support.v7.widget.Toolbar
android:id="@+id/toolBar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/colorPrimary"/>
2關聯(lián)ToolBar
2.1 menu文件的使用
這里穿插一個內容就是menu文件的使用,因為后面會用到,所以這里面簡單的作一下說明:
- 菜單資源文件必須放在res/menu目錄中.菜單資源文件必須使用<menu>標簽作為根節(jié)點.除了<menu>標簽外,還有兩外兩個標簽用于設置菜單像和分組,分別是<item>和<group>
- <menu>標簽沒有任何屬性,但可以嵌套在<item>標簽中,表示子菜單.不過<item>標簽中不能才嵌套<menu>標簽
<menu>標簽的屬性含義
- android:id 表示菜單項的資源ID
- android:menuCategory 同種菜單的種類 該屬性可取4個值
- container
- system
- secondary
- alternative
- android:orderInCategory 同類菜單的排列順序;該屬性是一個整數值
- android:title 標題
- android:titleCondensed 菜單的短標題,當菜單標題太長的時候會顯示該屬性的值
- android:icon 菜單的圖片資源ID
- android:alphabeticShortcut 菜單項的字幕快捷鍵
- android:numericShortcut 菜單的數字快捷鍵
- android:checkable 表示菜單是否帶有復選框,該屬性可設計為true/false
- android:checked 如果菜單像帶復選框(checkable屬性為true),該屬性表示復選框默認狀態(tài)是否被選中
- android:visible 菜單默認狀態(tài)是否可見
- android:enabled 菜單默認狀態(tài)是否被激活
- app:showAsAction
- ifRoom 如果有空間的話,會顯示在ToolBar上,當空間不足的時候會顯示在列表上
- always 一直顯示在ToolBar上
- collapseActionView (一般要配合ifRoom一起使用)聲明這個操作視窗應該被折疊到一個按鈕中,當用戶選擇這個按鈕時,這個操作視窗展開否則,這個操作視窗在默認的情況下時可見的
- never 永遠不會顯示,也不會顯示在列表上,但是按menu鍵的時候會出來
- withText 菜單項和它的圖標一起顯示
<group>標簽的屬性含義
可以實現(xiàn)組合的顯示,當組合的時候這里你可以看看實現(xiàn)的效果
<item
android:id="@+id/Tab3"
android:title="組合"
app:showAsAction="never">
<menu>
<item
android:id="@+id/item1"
android:title="組合1"/>
<item
android:id="@+id/item2"
android:title="組合2"/>
<item
android:id="@+id/item3"
android:title="組合3"/>
<item
android:id="@+id/item4"
android:title="組合4"/>
</menu>
</item>
- android:checkableBehavior 設置該組件所有菜單上顯示的選擇組件(CHeckBox或RadioButton).如果該屬性值設為all,顯示CheckBox組件;如果設置single,顯示RadioButton組件;如果設置none,顯示正常的菜單項(不顯示任何選擇組件)
2.2 ToolBar的設置
在代碼中找到這個控件然后設置給ActionBar(setSupportActionBar(toolBar)) 但是這里有兩個前提要注意一下:
- 主題中必須設置沒有ActionBar(<item name="windowActionBar">false</item>),否則會出現(xiàn)里面報兩個ActionBar的錯誤
- 當前Activity必須繼承自AppCompatActivity
這里要注意,其實toolBar和ActionBar可以不聯(lián)系到一起,如果不聯(lián)系到一起的話,那么可以不用去setSupportActionBar(),也不用在activity中的onCreateOptionsMenu,你可以直接用(public void inflateMenu(int resId))方法直接設置menu文件 但是這樣toolBar就完全變成一個獨立于Activity的控件了,需要注意的是,如果你這么定義了,那么Activity的回調方法是不會監(jiān)聽toolBar上的menu的點擊時間了,所有的點擊時間都要通過toolBar提供那個都得監(jiān)聽其來實現(xiàn).
-
關聯(lián)ActionBar的寫法
setSupportActionBar(mToolBar); //這里是關聯(lián)menu文件的 @Override public boolean onCreateOptionsMenu(Menu menu) { MenuInflater menuInflater = getMenuInflater(); menuInflater.inflate(R.menu.menu_main, menu); return true; } //設置點擊事件的 @Override public boolean onOptionsItemSelected(MenuItem item) { switch (item.getItemId()){ case id: break; } return super.onOptionsItemSelected(item); } -
不關聯(lián)ActionBar的寫法
mToolBar.inflateMenu(R.menu.menu_main); /*設置導航圖標*/ mToolBar.setNavigationIcon(R.mipmap.ic_launcher); mToolBar.setNavigationOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { Toast.makeText(MainActivity.this, "圖標的點擊事件執(zhí)行了", Toast.LENGTH_SHORT).show(); } }); mToolBar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem item) { if (item.getItemId() == R.id.name) { Toast.makeText(MainActivity.this, "條目的點擊事件", Toast.LENGTH_SHORT).show(); return true; } else { return false; } } });
2.3 ToolBar詳細設置
-
一些簡單的設置
/*設置導航圖標*/ mToolBar.setNavigationIcon(R.mipmap.ic_launcher); /*設置標題*/ mToolBar.setTitle("標題欄"); /*設置副標題*/ mToolBar.setSubtitle("子標題"); /*設置標題顯示顏色*/ mToolBar.setTitleTextColor(Color.parseColor("#FFFFFF")); /*設置副標題的字體顏色*/ mToolBar.setSubtitleTextColor(Color.parseColor("#FFFFFF")); /*設置Logo*/ mToolBar.setLogo(R.drawable.ic_search_black_24dp); /*設置導航按鈕*/ mToolBar.setNavigationIcon(R.drawable.ic_search_black_24dp);這里注意上面這些設置要在setSupportActionBar();之前進行設置否則不會生效;
-
給ToolBar添加字是圖
這里還有一個問題,ToolBar有自己的LayoutParams,干什么用的呢?其實就是添加子視圖的
/*添加一個子視圖*/ TextView subText = new TextView(this); subText.setText("添加的子控件"); Toolbar.LayoutParams params = new Toolbar.LayoutParams(Toolbar.LayoutParams.WRAP_CONTENT, Toolbar.LayoutParams.WRAP_CONTENT, Gravity.CENTER); params.setMargins(3, 3, 4, 4); subText.setLayoutParams(params); mToolBar.addView(subText);
2.4 添加View在ToolBar上
-
代碼添加
/*添加一個子視圖*/ TextView subText = new TextView(this); subText.setText("添加的子控件"); Toolbar.LayoutParams params = new Toolbar.LayoutParams(Toolbar.LayoutParams.WRAP_CONTENT, Toolbar.LayoutParams.WRAP_CONTENT, Gravity.CENTER); params.setMargins(3, 3, 4, 4); subText.setLayoutParams(params); mToolBar.addView(subText); -
XML文件中添加
<android.support.v7.widget.Toolbar android:id="@+id/toolBar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="@color/colorPrimary"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Clock"/> </android.support.v7.widget.Toolbar>
2.5 常見問題
-
當在xml中設置一些屬性的時候不起作用的問題(這個問題主要是因為toolBar的屬性都要自定義屬性才好使)
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:toolbar="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/color_0176da" toolbar:navigationIcon="@mipmap/ic_drawer_home" toolbar:logo="@mipmap/ic_launcher" toolbar:subtitle="456" toolbar:title="123"> <!--自定義控件--> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Clock" /> </android.support.v7.widget.Toolbar> </LinearLayout> -
Menu Item 的文字顏色設置無效 (通過設置app:popupTheme="@style/Theme.ToolBar.Base"主題進行替換,這里注意是app開頭的,你懂的)
<style name="Theme.ToolBar.Base" parent="Theme.AppCompat.Light.NoActionBar"> <item name="android:textColorPrimary">@color/colorAccent</item> <item name="android:textSize">20sp</item> </style> -
最后上一個仿知乎的ToolBar設置(這里就貼出一個主要的主題,其他的上面都涉及到了))
<style name="zhiHuToolBar" parent="Theme.ToolBar.Base"> <item name="actionOverflowButtonStyle">@style/ActionButton.Overflow.ZhiHu</item> </style> <style name="ActionButton.Overflow.ZhiHu" parent="android:style/Widget.Holo.Light.ActionButton.Overflow"> <item name="android:src">@mipmap/ic_overflow</item> </style>這里注意一點就是app:theme="@style/Theme.ToolBar.ZhiHu"和app:popupTheme="@style/Theme.ToolBar.Base"的區(qū)別
2017年11月08日補充:
ToolBar還有一個屬性標簽
- app:layout_anchor="@id/xxxid"這個屬性是附著都的意思,作用是附著在其他控件上,會使得其它控件狀態(tài)改變的時候這個控件也會改變(當設置這個屬性后這個控件的位置會附著到響應的標簽的最上方去)!!!
