Toolbar是android5.0推出来的一个MaterialDesign风格的控件,用来替代之前的Actionbar,并规范导航栏,相对于Actionbar的话,Toolbar使用起来还是蛮便捷灵活的,可以进行导航栏标题,副标题,logo,menu等一系列操作和设置。
Toolbar extends ViewGroup 在使用的时候可以看作是一个布局容器使用,来自android.support.v7.widget包。
1、设置主题样式
将主题样式设置为:
同时activity最好继承自AppCompatActivity,这样兼容性更好些;
2、在xml布局文件中使用
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:title="主标题"
app:titleTextColor="@color/colorAccent"
app:subtitle="副标题"
app:subtitleTextColor="@color/colorAccent"
android:background="@color/colorPrimaryDark"
app:navigationIcon="@mipmap/back_icon">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="中间标题"
android:textColor="@color/colorAccent"
android:gravity="center"
android:textSize="15sp"/>
android.support.v7.widget.Toolbar>
LinearLayout>
注意点:在Toolbar中添加其他控件的时候,控件的宽高不要设置为match_parent或fill_parent,会将Toolbar全部遮住导致没有效果
可以根据自己的需要进行设置;这些属性也可以通过代码进行设置,效果是一样的;
//设置主标题
toolbar.setTitle("主标题");
//设置主标题字体颜色
toolbar.setTitleTextColor(Color.RED);
//设置副标题
toolbar.setSubtitle("副标题");
//设置副标题字体颜色
toolbar.setSubtitleTextColor(Color.RED);
//设置logo图片
toolbar.setLogo(R.mipmap.ic_launcher);
//设置Navigation图片
toolbar.setNavigationIcon(R.mipmap.ic_launcher);
3、设置Toolbar
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
//设置Navigation点击监听
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(ToolBarActivity.this, "back", Toast.LENGTH_LONG).show();
}
});
4、添加menu菜单
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
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_search"
android:orderInCategory="100"
android:title="搜索"
android:icon="@mipmap/search_icon"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/action_share"
android:orderInCategory="100"
android:title="分享"
android:icon="@mipmap/share_icon"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/action_add"
android:orderInCategory="100"
android:title="新增"
android:icon="@mipmap/add_icon"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/action_setting"
android:orderInCategory="100"
android:title="设置"
android:icon="@mipmap/setting_icon"
app:showAsAction="ifRoom"/>
menu>
showAsAction属性共有五个值:ifRoom、never、always、withText、collapseActionView
ifRoom:
会显示在Item中,但是如果已经有4个或者4个以上的Item时会隐藏在溢出列表中。当然个数并不仅仅局限于4个,依据屏幕的宽窄而定
never:
永远不会显示。只会在溢出列表中显示,而且只显示标题,所以在定义item的时候,最好把标题都带上。
always:
无论是否溢出,总会显示
withText:
示意Action bar要显示文本标题。Action bar会尽可能的显示这个标题,但是,如果图标有效并且受到Action bar空间的限制,文本标题有可能显示不全。
collapseActionView:
声明了这个操作视窗应该被折叠到一个按钮中,当用户选择这个按钮时,这个操作视窗展开。否则,这个操作视窗在默认的情况下是可见的,并且即便在用于不适用的时候,也要占据操作栏的有效空间。
5、设置menu选择或点击item监听
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int itemId = item.getItemId();
switch (itemId) {
case R.id.action_search:
Toast.makeText(ToolBarActivity.this, "搜索", Toast.LENGTH_LONG).show();
break;
case R.id.action_share:
Toast.makeText(ToolBarActivity.this, "分享", Toast.LENGTH_LONG).show();
break;
case R.id.action_add:
Toast.makeText(ToolBarActivity.this, "新增", Toast.LENGTH_LONG).show();
break;
case R.id.action_setting:
Toast.makeText(ToolBarActivity.this, "设置", Toast.LENGTH_LONG).show();
break;
}
return super.onOptionsItemSelected(item);
}
menu菜单的添加和选择监听还有通过下面的方式来实现:
添加menu菜单:
//添加menu菜单
toolbar.inflateMenu(R.menu.main);
不过inflateMenu的源码还是通过getMenuInflater().inflate(R.menu.main, menu);来实现的;
inflateMenu源码:
public void inflateMenu(@MenuRes int resId) {
getMenuInflater().inflate(resId, getMenu());
}
menu菜单选择监听
//menu菜单item点击监听
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
//根据选择的itemId来判断选择的是哪个item
int itemId = item.getItemId();
return false;
}
});
Toolbar列表悬停及滑动变色
先看下toolbar+listview滑动变色的一个效果:
1、xml布局
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.toolbartest.MyListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:dividerHeight="0.5dp"
android:divider="@color/colorAccent"
android:clipToPadding="false"
android:clipChildren="false">
com.toolbartest.MyListView>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimaryDark">
android.support.v7.widget.Toolbar>
RelativeLayout>
这里根据布局用的是RelativeLayout,用FrameLayout也可以的,这里需要注意的是,因为要给ListView设置一个paddingTop,所以要个ListView设置这两个属性;
//该控件的绘制范围是否不在Padding里面。false:绘制的时候范围会考虑padding即会往里面缩进。
android:clipToPadding="false"
//子控件是否能不超出padding的区域(比如ScrollView上滑动的时候,child可以滑出该区域)
android:clipChildren="false"
2、自定义ListView并重写onScrollChanged方法进行滑动监听
@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
if(listener!=null){
//获得y轴滑动距离
float scaleY = getListViewY();
Log.e("TAG","scaleY-->"+scaleY);
//小于等于屏幕的三分之一
if(scaleY<=screenHeight/3){
//计算透明度
float alaph=1-scaleY/(screenHeight/3f);
if(alaph<0.3){
alaph=0.3f;
}
//将透明度回调回去
listener.onTranlucent(alaph);
}
}
}
这里需要注意,设置了listview各种滑动监听,并打印log发现listview并没有提供获取滑动中Y轴的值,就只能自己计算了;
2.1、计算ListView滑动中Y轴的值
private float getListViewY(){
View view = this.getChildAt(0);
if(view==null){
return 0;
}
int firstVisiblePosition = this.getFirstVisiblePosition();
int top = view.getTop();
return -top + firstVisiblePosition * view.getHeight() ;
}
3、获取控件并设置透明度
toolbar = (Toolbar) findViewById(R.id.toolbar);
//设置Toolbar
setSupportActionBar(toolbar);
//获取toolbar的高度
toolbar.post(new Runnable() {
@Override
public void run() {
int measuredHeight = toolbar.getMeasuredHeight();
//设置ListView 的paddingTop为toolbar的高度
listview.setPadding(0,measuredHeight,0,0);
}
});
//回调监听透明度
listview.setTranslucentListener(new TranslucentListener() {
@Override
public void onTranlucent(float alpha) {
//设置toolbar透明度
toolbar.setAlpha(alpha);
}
});
这样就可以了,如果导航栏用的不是toolbar的话,将toolbar换成RelativeLayout或者LinearLayout并设置透明度就可以了。
源码地址:
http://download.csdn.net/detail/wangwo1991/9915012