從Android5.0開始，谷歌推出了Material Design風格的導航控件----Toolbar。粗暴的來說，它是用來替換Actionbar的（原因呢，很多寫Toolbar的文章都說了，就不再啰嗦了）。
Toolbar的API中寫到，相比Actionbar來說，Toolbar能夠支撐更加集中的功能集。Toolbar含有以下可選元素：
- A navigation button： 導航按鈕
- A branded logo image：logo圖標
- A title and subtitle：標題和副標題
- One or more custom views：一個或多個自定義view
- An action menu：菜單按鈕
Toolbar入門
使用v7包里的Toolbar，才能向下兼容。不然只能5.0以上的才能用。
android.support.v7.widget.Toolbar
- 在使用Toolbar前，要隱藏原來的Actionbar。方法有兩種：
- 在AndroidManifest.xml中，給application或者是相應的activity設置相應的主題：
android:theme="@style/Theme.AppCompat.Light.NoActionBar"
或自定義style,在設置給application或者是相應的activity:
<style name="...">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style> - 在代碼中設置：
- 在AndroidManifest.xml中，給application或者是相應的activity設置相應的主題：
/**
* 1.一定要設置在setContentView()前邊
* 2.如果activity繼承的是AppCompatActivity(AS現在默認的都是AppCompatActivity),
* supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
* 3.如果activity繼承的是Activity,
* requestWindowFeature(Window.FEATURE_NO_TITLE);
*/
supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
- 隱藏Actionbar后，就可以使用Toolbar了。
在布局文件中添加Toolbar，
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/colorPrimary"
app:titleTextColor="#ffffff">
</android.support.v7.widget.Toolbar>
在activity中，
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
}
運行后，
toobar-1.PNG
Toolbar各元素基本使用及自定義
- 導航按鈕
- 顯示自帶的返回按鈕，也就是Actionbar中的返回按鈕，并點擊監聽
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
}
});
}
運行后，
toolbar-2.PNG
- 設置自定義按鈕圖標
兩種方法：- 在布局文件中
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/colorPrimary"
app:titleTextColor="#ffffff"
app:navigationIcon="@mipmap/menu">
- 代碼中設置
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
// getSupportActionBar().setDisplayHomeAsUpEnabled(true);
mToolbar.setNavigationIcon(R.mipmap.menu);
mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
}
});
}
運行后，
toolbar-3.PNG
- 設置logo
同樣是兩種：
app:logo="@mipmap/ic_launcher"
或
mToolbar.setLogo(R.mipmap.ic_launcher);
運行后，
toolbar-4.PNG
- 設置標題和副標題
app:titleTextColor="#ffffff"
app:title="標題"
app:subtitle="副標題"
app:subtitleTextColor="#ffffff"
在代碼中設置
mToolbar.setTitle("標題");
mToolbar.setTitleTextColor(Color.WHITE);
mToolbar.setSubtitle("副標題");
mToolbar.setSubtitleTextColor(Color.WHITE);
運行后，
toolbar-6.PNG
- 自定義view
<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="View"
android:textColor="#ffffff"
android:layout_gravity="center"
android:textSize="25sp"/>
</android.support.v7.widget.Toolbar>
運行后，
toolbar-7.PNG
在代碼中設置，
mToolbar.addView(LayoutInflater.from(this).inflate(R.layout.tv,null));
運行后，
toolbar-8.PNG
- 菜單按鈕
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/m1"
android:title="分享1"
android:icon="@drawable/share"
app:showAsAction="never"/>
<item
android:id="@+id/m2"
android:title="設置2"
android:icon="@drawable/set"
app:showAsAction="never"
/>
<item
android:id="@+id/m3"
android:title="分享3"
android:icon="@mipmap/share"
app:showAsAction="always"/>
<item
android:id="@+id/m4"
android:title="設置4"
android:icon="@mipmap/set"
app:showAsAction="always"/>
<item
android:id="@+id/m5"
android:title="分享5"
android:icon="@mipmap/share"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/m6"
android:title="設置6"
android:icon="@mipmap/set"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/m7"
android:title="分享7"
android:icon="@mipmap/share"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/m8"
android:title="設置8"
android:icon="@mipmap/set"
app:showAsAction="ifRoom"/>
</menu>
showAsAction，指定該按鈕顯示的位置，有幾個值可選：always，表示永遠顯示在actionbar中，如果屏幕空間不夠，則不顯示；ifRoom，表示屏幕空間夠得話顯示在actionbar中，不夠就顯示在overflow中；never，永遠顯示在overflow中。
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu,menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()){
...
}
return super.onOptionsItemSelected(item);
}
運行后，
toolbar-9.PNG
toolbar-10.PNG
通過圖可以發現，Overflow中的選項沒有顯示圖標。這是官方的默認效果，Google認為隱藏在overflow中的Action按鈕都應該只顯示文字。那應該怎樣顯示呢？可以參考郭霖大神的博客：
總結
這篇文章是Toolbar的簡單了解和使用。在實際使用中，我們再根據具體需求靈活運用。
ps：寫就是學習的過程。加油！！！
