支付宝的首页的刷新界面有点不太一样,一般刷新是头上的,但支付宝的是中间的,拖动任何地方都能刷新,用过的应该知道。先上个图 -》
看动图 注意头部和滚动列表是分开的,分开也就是导致了一个问题 :怎么把自身的滑动时间传到仍外一个view 上,这也是支付宝首页事件里面值得研究的一个地方,也是独特的地方,至于其它折叠的动画就不研究了,给大家一个连接,模仿uc首页的:https://github.com/BCsl/UcMainPagerDemo
主要是NestedScroll滚动机制的应用,NestedScroll滚动机制还是很值得学习的,如果还没有学习和研究的建议学习下。关于NestedScroll 讲解网上很多了,大家可以找下,这里就不介绍了。
下面进入今天的主题,实现上面动图的效果。
先来分析下要做的事情
- 自己放置空间位置
- 实现事件传递
先来做第一件事:摆放控件
大家用过AppBarLayout的各种特效的应该记得
@string/appbar_scrolling_view_behavior
对就是它,找到它的代码
public static class ScrollingViewBehavior extends HeaderScrollingViewBehavior
在HeaderScrollingViewBehavior里面重写了onMeasureChild方法和layoutChild方法 哎呦又是一坨代码 。就不贴上了,大伙自己打开屎丢丢看下代码,不复杂的代码,这里讲下思路。
通过 abstract View findFirstDependency(List<View> views);
找到依赖的view
通过int getScrollRange(View v) {
获取依赖view客滚动的范围,注意是被依赖的view的滚动范围
return v.getMeasuredHeight();
}
通过上面的两个方法就能够确定view的高度和该摆放的位置(大伙看下代码就明白了)
我这里呢就用[https://github.com/BCsl/UcMainPagerDemo ]这哥们里面抽出来的类(����)
布局文件
<?xml version="1.0" encoding="utf-8"?>
<com.example.zhifubao.MyCoordiantorLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.zhifubao.MainActivity"
>
<FrameLayout
android:id="@+id/header"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#ccc"
app:layout_behavior="com.example.zhifubao.behavior.RefreshBehavior">
</FrameLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/refreshLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="com.example.zhifubao.behavior.ContentBehavior">
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</android.support.v7.widget.RecyclerView>
</android.support.v4.widget.SwipeRefreshLayout>
</com.example.zhifubao.MyCoordiantorLayout>
就只有两部分,头部和列表,看下就明白了,就不解释了
看下app:layout_behavior="com.example.zhifubao.behavior.ContentBehavior"
做了啥
public class ContentBehavior extends HeaderScrollingViewBehavior {
public ContentBehavior(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean layoutDependsOn(CoordinatorLayout parent, View child, View dependency) {
return isDependOn(dependency);
}
@Override
protected View findFirstDependency(List<View> views) {
for (int i = 0, z = views.size(); i < z; i++) {
View view = views.get(i);
if (isDependOn(view))
return view;
}
return null;
}
private boolean isDependOn(View dependency) {
return dependency != null && dependency.getId() == R.id.header;
}
@Override
public boolean onDependentViewChanged(CoordinatorLayout parent, View child, View dependency) {
offsetChildAsNeeded(parent, child, dependency);
return false;
}
private void offsetChildAsNeeded(CoordinatorLayout parent, View child, View dependency) {
child.setTranslationY(dependency.getTranslationY());
}
}
是不是很简单,重写下protected View findFirstDependency(List<View> views)
位置就能正确显示了,我们的滚动范围是整个view,所以就不用重写protected int getScrollRange(View v)
方法了。
上面的都是前戏了,为了正菜做准备的。下面开始正菜。
先上代码
解释下
这里有两个地方要处理
第一
- onInterceptTouchEvent
- onTouchEvent
当拖动都非列表滚动view时的处理,注意我们这里的实现是可以有多个头部view的,这里demo就用了一个。
第二
- onStartNestedScroll
- onNestedScrollAccepted
- onNestedPreScroll
- onNestedPreFling
- onStopNestedScroll
当滑动滚动列表(这里是RecyclerView)时的处理。
这两处呢都要判断SwipeRefreshLayout是否正在刷新,因为SwipeRefreshLayout没有提供方法判断是否刷新,这里用了反射
private View findTopChildUnder(ViewGroup parentView, int x, int y) {
final int childCount = parentView.getChildCount();
for (int i = childCount - 1; i >= 0; i--) {
final View child = parentView.getChildAt(i);
if (x >= child.getLeft() && x < child.getRight()
&& y >= child.getTop() && y < child.getBottom()) {
return child;
}
}
return null;
}
最主要的是在onTouchEvent在man z
代码也复杂,大家看下就好了 主要是思路
最后附上代码地址:https://github.com/hupihuai/zhifubao
注意了不能直接用于项目,可能还有问题,只是提供一种实现思路