第二行代码读书笔记--Material Design实践之ToolBar

ToolBar

ToolBar 是appcompat-v7包中的控件，用于替代原声APP的 ActionBar 的一个控件。

第一步：

将 parent 的主题改成继承 NoActionBar

    // 将 parent 的主题改成继承 NoActionBar
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

第二步：

在activity_main.xml中加入ToolBar，记得布局最外层不要有Margin和Padding

    <android.support.v7.widget.Toolbar
        android:layout_width="match_parent"
        // 设置为之前的 ActionBar 的高度
        android:layout_height="?attr/actionBarSize"
        // 设置背景色
        android:background="?attr/colorPrimary"
        // ToolBar 使用深色主题
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        // 改变弹出的菜单项的主题颜色
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

第三步

在MainActivity中加入以下两行代码，用ToolBar替换ActionBar

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolBar);
        // 为App设置ToolBar
        setSupportActionBar(toolbar);
    }

添加OptionMenu

第一步：

在res下创建文件夹menu，然后在里面创建toolbar.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/item1"
        android:icon="@mipmap/ic_launcher"
        android:title="@string/item1"
        app:showAsAction="never"/>
    <item android:id="@+id/item2"
        android:icon="@mipmap/ic_launcher"
        android:title="@string/item2"
        app:showAsAction="never"/>
    <item android:id="@+id/item3"
        android:icon="@mipmap/ic_launcher"
        android:title="@string/item3"
        app:showAsAction="never"/>
    <item android:id="@+id/item4"
        android:icon="@mipmap/ic_launcher"
        android:title="@string/item4"
        app:showAsAction="never"/>
</menu>

第二步：

在Activity中重写OptionMenu和它的选中事件

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar,menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()) {
            case R.id.item1:
                Toast.makeText(this, "item1", Toast.LENGTH_SHORT).show();
                break;
            case R.id.item2:
                Toast.makeText(this, "item2", Toast.LENGTH_SHORT).show();
                break;
            case R.id.item3:
                Toast.makeText(this, "item3", Toast.LENGTH_SHORT).show();
                break;
            case R.id.item4:
                Toast.makeText(this, "item4", Toast.LENGTH_SHORT).show();
                break;
            default:
                Toast.makeText(this, "其他", Toast.LENGTH_SHORT).show();
                break;
        }
        return true;
    }

总结

用 ToolBar 替换原生的 ActionBar，后面可以得到各种自定义的标题栏。注意在Fragment中的OptionMenu需要先进行注册。