今天在使用 ToolBar 的时候,发现使用起来有些繁琐,没有自己定义 xml 布局简单,使用起来也不算太方便,但是随着版本的越来越高,ToolBar 更加符合Android 的设计,现在把使用的步骤记录下来,方便以后的查阅。
Toolbar 使用前准备
- 定义 ToolBar Style
可以根据 App 的风格,色彩定义 ToolBar 的背景色等
<style name="MyActionBar" parent="AppTheme">
<item name="android:actionBarStyle">@style/ActionBar.Solid.MyAppTheme</item>
<item name="android:textColorSecondary">@color/colorWhite</item>
</style>
<style name="ActionBar.Solid.MyAppTheme" parent="@style/Widget.AppCompat.Light.ActionBar.Solid">
<item name="background">@color/colorPrimary</item>
</style>
- 定义xml——view_toolbar.xml
定义 xml 布局方便在其他页面中引用
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:minHeight="?attr/actionBarSize"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:titleTextColor="@android:color/white"
android:background="@color/colorPrimary"
app:theme="@style/MyActionBar">
</android.support.v7.widget.Toolbar>
- 在 BaseActivity 中定义 Toolbar 的方法 Toolbar
创建 Activity 的基类,可以把 Activity 的基础操作写在这里,方便其他 Activity 调用,减少代码量。
/*
* 返回
*/
protected void initBackButton(String title) {
initToolBar();
setBackButton(title);
changeStatusColor();
}
private void setBackButton(String title) {
if (getSupportActionBar() != null) {
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
setTitle(title);
}
}
/*
* 初始化 Toolbar
*/
protected void initToolBar() {
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
// Logo
toolbar.setLogo(R.mipmap.push_4);
// 主标题
toolbar.setTitle("Title");
// 副标题
toolbar.setSubtitle("Sub Title");
//设置toolbar
setSupportActionBar(toolbar);
//左边的小箭头(注意需要在setSupportActionBar(toolbar)之后才有效果),可以使用默认
toolbar.setNavigationIcon(R.mipmap.back);
}
/*
* 重写方法
*/
public boolean onOptionsItemSelected(MenuItem item) {
if (getSupportActionBar() != null) {
this.finish();
}
return true;
}
/*
* 状态栏颜色修改
*/
protected void changeStatusColor() {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = getWindow();
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.setStatusBarColor(ContextCompat.getColor(this, R.color.colorPrimary));
}
}
ToolBar 在 Activity 中的使用
以上把通用的方法都已经封装完成,接下来就要在 Activity 中使用 ToolBar
定义 menu 导航栏需要显示的图标 menu_scan.xml
这个步骤也可以在 Activiy 中手动添加 Menu,这样写方便导航栏元素的修改,代码更佳清晰
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_scan"
android:title="二维码"
android:icon="@mipmap/scan"
app:showAsAction="ifRoom">
</item>
</menu>
- menu 中的几个属性说明如下:(参考:https://blog.csdn.net/monalisatearr/article/details/78415585)
android:icon:这个属性是指定每个菜单项左边的图标的
android:id:菜单项的唯一标识
android:orderInCategory:菜单项的优先级,也就是顺序,只能设置大于正整数,数值越大菜单项越靠前
android:title:菜单描述,也就是菜单文字
app:showAsAction:这个是控制菜单项的显示的
- 其中 showAsAction 的 value值有如下几个:
ifRoom:设置这个值之后,如果toolbar上还有空间的话就会显示优先级高的菜单项在toolbar上,剩下的才显示在弹出的列表中
never:永远不会显示在Toolbar上,只会在溢出列表中出现
withText:这个属性我看了下效果是跟never一个样不知道是不是我哪里没设置对!!!
collapseActionView:这个属性通俗的说就是声明某一个菜单项单独显示在toolbar上,而不是显示在打开的菜单中,一般配合ifRoom使用
在 Activity 的 layout 文件中 引入 ToolBar
<include
android:id="@+id/toolbar"
layout="@layout/view_toolbar"/>
在 Activity 中使用 ToolBar
- 在 onCreate() 中引用 ToolBar
initBackButton("title");//带有返回按键
// 设置不带返回键的 Title
// initToolBar();// 不带返回按键
// setTitle("title");// 设置 title
- 在方法 onCreateOptionsMenu(Menu menu) 中添加导航栏元素
@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu. menu_scan, menu);
return true;
}
- 点击 menu 中的元素点击事件
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.action_scan:
// do some things
return true;
default:
finish();
return true;
}
}
另记载
- App 的字体大小不随系统的改变而修改——在 BaseActivity 中重写 getResources() 方法
@Override
public Resources getResources() {
Resources res = super.getResources();
Configuration config=new Configuration();
config.setToDefaults();
res.updateConfiguration(config,res.getDisplayMetrics() );
return res;
}