ToolBar介绍
ToolBar是Android5.0引入,可使用support v7兼容包开发。Android开发中逐渐使用ToolBar替换掉ActionBar。
ToolBar常用设置项
- toolbar:navigationIcon
左侧图标,默认是一个Back箭头 - toolbar:logo
app图标,展示位置和navigationIcon差不多,一般用navigationIcon - toolbar:subtitle
副标题 - toolbar:title
标题
注:命名空间一定要用toolbar,不要用android命名空间。sdk bug,用android命名空间,设置不生效。
项目开发
由于项目开发过程中,对toolbar的自定义程度比较高,所有没有采用toolbar自带的几个属性,而是采用在xml文件ToolBar标签包裹自定义布局的方式引入。
1)在layout布局文件中引入ToolBar
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
style="@style/ToolbarStyle"
app:theme="?attr/actionBarTheme">
<include layout="@layout/toolbar_web"/>
</android.support.v7.widget.Toolbar>
<WebView
android:id="@+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/toolbar"/>
</RelativeLayout>
代码中,Toolbar标签内包裹了实际的布局文件,此处使用include标签,保证代码的整洁性。
toolbar_web.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/app_brand_color"
android:orientation="horizontal">
<LinearLayout
android:id="@+id/toolbar_back"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginRight="60dp"
android:layout_alignParentLeft="true"
android:background="@drawable/btn_white_hover"
android:gravity="center_vertical"
android:orientation="horizontal"
>
<ImageView
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_marginLeft="14dp"
android:layout_marginRight="14dp"
android:src="@drawable/toolbar_back"
/>
<TextView
android:id="@+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:singleLine="true"
android:textColor="#ffffff"
android:textSize="20sp"
/>
</LinearLayout>
<LinearLayout
android:id="@+id/toolbar_share"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_marginRight="20dp"
android:background="@drawable/btn_white_hover"
android:gravity="center_vertical"
android:orientation="horizontal"
>
<ImageView
android:layout_width="16dp"
android:layout_height="16dp"
android:scaleType="centerCrop"
android:src="@drawable/web_share_ic"
/>
</LinearLayout>
</RelativeLayout>
项目中以toolbar_xxx.xml的命名方法统一定义toolbar内部的布局文件,布局文件内部toolbar_back,toolbar_title采用统一的命名方法,以便于项目管理。
2)代码中使用ToolBar
- 在BaseActivity中用toolbar替换默认的actionbar
@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); int layoutId = getLayoutId(); if (layoutId != -1) { setContentView(layoutId); } Injector.inject(this,this); mContext = this; readIntent(); if (findViewById(R.id.toolbar) != null){ toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); getSupportActionBar().setDisplayHomeAsUpEnabled(false); getSupportActionBar().setDisplayShowTitleEnabled(false); } initControls(savedInstanceState); setListeners(); overridePendingTransition(R.anim.left_in, R.anim.hold); }
这里必须要设置setDisplayHomeAsUpEnabled为false,否则就算没有设置navigationIcon,也会莫名其妙的出现默认的Icon~~
2)在实际的activity中,找到对应的View实例
3)ToolBar相关view的响应事件
@Override
protected void setListeners() {
toolbarBack.setOnClickListener(this);
toolbarSend.setOnClickListener(this);
listView.setOnItemClickListener(itemClickListener);
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.toolbar_back:
finish();
break;
case R.id.toolbar_send:
int position = listView.getCheckedItemPosition();
if(position < 0){
ToastUtils.showToast("请选择一个分数");
return;
}
break;
}
}