android：ToolBar详解（手把手教程）（2）-原创手记-慕课网

4. 控件 (component)

本阶段将从 toolbar_demo_checkpoint2 接续，在还未于 <android.support.v7.widget.Toolbar/> 标签中，自行添加元件的 toolbar 有几个大家常用的元素可以使用，请先见下图：

大抵来说，预设常用的几个元素就如图中所示，接着就依序来说明之：

1. setNavigationIcon
即设定 up button 的图标，因为 Material 的介面，在 Toolbar这里的 up button样式也就有別于过去的 ActionBar 哦。

1. setLogo
APP 的图标。

2. setTitle
主标题。

3. setSubtitle
副标题。

4. setOnMenuItemClickListener
设定菜单各按鈕的动作。

先來看到菜单外的代码，在 MainActivity.java 中：

先来看到

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

// App Logo

toolbar.setLogo(R.drawable.ic_launcher);

// Title

toolbar.setTitle("My Title");

// Sub Title

toolbar.setSubtitle("Sub title");

setSupportActionBar(toolbar);

// Navigation Icon 要設定在 setSupoortActionBar 才有作用

// 否則會出現 back button

toolbar.setNavigationIcon(R.drawable.ab_android);

这边要留意的是setNavigationIcon需要放在 setSupportActionBar之后才会生效。

菜单部分，需要先在res/menu/menu_main.xml左定义：

<menu xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

tools:context=".MainActivity">

<item android:id="@+id/action_edit"

android:title="@string/action_edit"

android:orderInCategory="80"

android:icon="@drawable/ab_edit"

app:showAsAction="ifRoom" />

<item android:id="@+id/action_share"

android:title="@string/action_edit"

android:orderInCategory="90"

android:icon="@drawable/ab_share"

app:showAsAction="ifRoom" />

<item android:id="@+id/action_settings"

android:title="@string/action_settings"

android:orderInCategory="100"

app:showAsAction="never"/>

</menu>

再回到MainActivity.java 中加入OnMenuItemClickListener 的监听者：

private Toolbar.OnMenuItemClickListener onMenuItemClick = new Toolbar.OnMenuItemClickListener() {

@Override

public boolean onMenuItemClick(MenuItem menuItem) {

String msg = "";

switch (menuItem.getItemId()) {

case R.id.action_edit:

msg += "Click edit";

break;

case R.id.action_share:

msg += "Click share";

break;

case R.id.action_settings:

msg += "Click setting";

break;

}

if(!msg.equals("")) {

Toast.makeText(MainActivity.this, msg, Toast.LENGTH_SHORT).show();

}

return true;

}

};

将onMenuItemClick监听者设置给toolbar

setSupportActionBar(toolbar);

...

// Menu item click 的監聽事件一樣要設定在 setSupportActionBar 才有作用

toolbar.setOnMenuItemClickListener(onMenuItemClick);

和 setNavigationIcon 一样，需要將之设定在 setSupportActionBar 之后才有作用。执行上面的代码便会得到下面的界面。

完完整程序见：toolbar_demo_checkpoint3

5. 总结

在这样的架构设计下，ToolBar直接成了Layout中可以控制的东西，相对于过去的actionbar来说，设计与可操控性大幅提升。

本文上面的解释中用到的完成代码：toolbar demo check point 0 ~ 4，请到Github 取得。

最后再附上一个界面上常用的属性说明图：

这里按照图中从上到下的顺序做个简单的说明：

· colorPrimaryDark

§ 状态栏背景色。

§ 在 style 的属性中设置。

· textColorPrimary

§ App bar 上的标题与更多菜单中的文字颜色。

§ 在 style 的属性中设置。

· App bar 的背景色

§ Actionbar 的背景色设定在 style 中的 colorPrimary。

§ Toolbar 的背景色在layout文件中设置background属性。

· colorAccent

§ 各控制元件(如：check box、switch 或是 radoi) 被勾选 (checked) 或是选定 (selected) 的颜色。

§ 在 style 的属性中设置。

· colorControlNormal

§ 各控制元件的预设颜色。

§ 在 style 的属性中设置

· windowBackground

§ App 的背景色。

§ 在 style 的属性中设置

· navigationBarColor

§ 导航栏的背景色，但只能用在 API Level 21 (Android 5) 以上的版本

§ 在 style 的属性中设置

最后需要注意的是：使用material主题的时候，必须设定targetSdkVersion = 21，否则界面看起来是模糊的

转自：http://jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1118/2006.html