现在很多App都实现了下滑时标题栏隐藏,而上滑时标题栏显示,很显然这是利用手势监测和属性动画(ObjectAnimator)进行实现的。
在网上找到的大部分都是ToolBar随listview类似的控件滑动而隐藏或显示,感觉都比较复杂,最近在读View的分发事件,在想是否能够利用View的分发简单实现ToolBar的滑动隐藏。这样就可以在不同的view达到这种效果,不只是listview。
- 使用最简单的布局文件:
(在支持ToolBar,记得在style中添加"windowActionBar"为false,windowNoTitle"为true)<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation = "vertical"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/colorPrimary"> </android.support.v7.widget.Toolbar> <TextView android:id="@+id/textview" android:text="Hello World!" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout>
- 利用属性动画实现Toolbar隐藏和显示,也可以通过alpha实现渐变消失
//隐藏动画 private void hideToolBar(){ Animator animator = ObjectAnimator.ofFloat(toolbar, "translationY", toolbar.getTranslationY(), -toolbar.getHeight()); animator.setDuration(600); animator.setInterpolator(new AccelerateInterpolator()); animator.setTarget(toolbar); animator.start(); } //显示动画 private void showToolBar(){ Animator animator = ObjectAnimator.ofFloat(toolbar, "translationY", toolbar.getTranslationY(), 0); animator.setDuration(600); animator.setInterpolator(new AccelerateInterpolator()); animator.setTarget(toolbar); animator.start(); }
- Android事件传递机制中,事件从Activity的dispatchTouchEvent做分发,所以我们可以在这里进行手势判断,但是不消费用户Touch事件,使得Touch事件得以传递下去。
可以参考: 图解 Android 事件分发机制
public boolean dispatchTouchEvent(MotionEvent ev){
//在这里判断下滑还是上滑
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
startX = ev.getX();
startY = ev.getY();
break;
case MotionEvent.ACTION_MOVE:
endX = ev.getX();
endY = ev.getY();
break;
case MotionEvent.ACTION_UP:
if (endY - startY > 0 && (Math.abs(endY - startY) > 25)) {
//向下滑動
showToolBar();
} else if (endY - startY < 0 && (Math.abs(endY - startY) > 25)) {
//向上滑动
hideToolBar();
}
startX = startY = endX = endY = 0;
break;
}
return super.dispatchTouchEvent(ev);//不消费触摸事件
}
- 效果:
沒有留言:
張貼留言