Toolbar的簡單使用方法

什麼是Toolbar？

Toolbar是google在android5.0之後推出的一個 Material Design風格的導航欄，用來取代之前的Actionbar.相比于Actionbar，Toolbar可以很簡單的設定圖示，主标題，子标題，傳回鍵，菜單欄等按鍵。Toolbar更多的應用在和其他的Matrial Design元件中，如結合CollapsingToolbarLayout實作動态隐藏Toolbar、結合側滑菜單欄等。

開發準備

Toolbar是在android.support.v7包中的，是以我們要在Android studio中的build.gradle導入V7包

compile ‘com.android.support:appcompat-v7:24.2.0’

布局檔案引入Toolbar

在布局檔案中引入Toolbar和引入其他簡單元件一樣，非常簡單，activity_toolbar如下。

<?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"
    android:id="@+id/activity_toolbar"
    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="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    </android.support.v7.widget.Toolbar>
</LinearLayout>
           

布局内容和平常的一樣，layout_height的值?attr/actionBarSize是actionbar的标準長度

android:background=”?attr/colorPrimary”設定Toolbar背景顔色，值是标準的狀态欄背景色藍色。

app:theme=”@style/ThemeOverlay.AppCompat.Dark.ActionBar”>設定toolbar的樣式，也可以不設定。不設定的話标題顔色是黑色，比較難看，一般的狀态欄顔色的字型是白色。

注意事項1：使用Toolbar的時候要隐藏掉系統本身的狀态欄，這裡我在androidmanifest檔案中指定了該activity的them是無标題的Theme.AppCompat.Light.NoActionBar樣式。你也可以在Activity中用代碼去實作隐藏标題欄

代碼設定标題、圖示、菜單

public class ToolbarActivity extends AppCompatActivity {

    private Toolbar toolbar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar);

        toolbar = (Toolbar) findViewById(R.id.toolbar);

        toolbar.setTitle("主标題");
        setSupportActionBar(toolbar);
    }
}
           

以上代碼也非常簡單，隻是設定了标題而已，讓我們來看看效果

可以看到，一個隻設定了主标題的Toolbar，很簡陋，但是Toolbar的操作不僅僅這些，我們來添加傳回鍵，菜單欄，副标題，如圖。

先呈上layout/menu/toolbar_menu.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">
    <item
        android:id="@+id/share"
        android:title="ic_share"
        android:icon="@drawable/ic_photo_share"
        app:showAsAction="ifRoom"
        />



    <item
        android:id="@+id/item01"
        android:title="item01"
        app:showAsAction="never"
        />

    <item
        android:id="@+id/item02"
        android:title="item02"
        app:showAsAction="never"
        />

</menu>
           

app:showAsAction設定為ifRoom是将這個按鍵顯示到toolbar中，設定為never則是把這個item隐藏隐藏在最右邊的菜單鍵裡

設定副标題，傳回鍵，menu監聽器

public class ToolbarActivity extends AppCompatActivity {

    private Toolbar toolbar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar);

        toolbar = (Toolbar) findViewById(R.id.toolbar);

        toolbar.setTitle("主标題");
        toolbar.setSubtitle("副标題");
        toolbar.setLogo(R.mipmap.ic_launcher);
        //設定SupportActionBar
        setSupportActionBar(toolbar);



        //快速設定傳回鍵，傳回鍵的邏輯在下面的onOptionsItemSelected中編寫
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        //也可以使用toolbar.setNavigationIcon(//圖檔)定義自己的傳回鍵圖檔，邏輯還是在onOptionsItemSelected中編寫


    }

    //加載menu下編寫好的菜單欄
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar_menu,menu);
        return true;
    }

    //在這裡編寫菜單的點選監聽
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        switch (id){
            //android.R.id.home是傳回鍵
            case android.R.id.home:
                onBackPressed();
                break;
            case R.id.share:
                Toast.makeText(ToolbarActivity.this, "share", Toast.LENGTH_SHORT).show();
                break;
            case R.id.item01:
                Toast.makeText(ToolbarActivity.this, "item01", Toast.LENGTH_SHORT).show();
                break;
            case R.id.item02:
                Toast.makeText(ToolbarActivity.this, "item02", Toast.LENGTH_SHORT).show();
                break;
            default:
                break;
        }

        return super.onOptionsItemSelected(item);
    }
}
           

可以看到，編寫好的toolbar_men.xml在重寫方法onCreateOptionsMenu（Menu menu）去載入，監聽邏輯則是在 onOptionsItemSelected(MenuItem item)中編寫。

總結：

1、在布局檔案中引入toolbar

2、在java檔案裡使用各種set方法設定圖示、标題等

3、如果要增加菜單欄，則在layout\menu下編寫，在Activity中載入、編寫點選邏輯