自定义AppBarLayout,让它Fling起来更流畅

2023-11-10 07:00

本文主要是介绍自定义AppBarLayout,让它Fling起来更流畅,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

我们知道,Desgin包中的AppBarLayout配合CollapsingToolbarLayout可以实现折叠效果。但是顶部在快速滑动到折叠状态时,底部的NestedScrollChild不会因为惯性跟着滑动,整个滑动过程瞬间停止,给人一种很不流畅的感觉。为了能让我们的AppBarLayout能Fling更流畅,我们需要在重新修改源码,定制一个FlingAppBarLayout,能够实现类似饿了么首页效果
饿了么首页效果

思路

我们知道AppBarLayout之所以能够有折叠效果,是因为有一个默认的Behavior,而且AppBarLayout在快速滑动时,布局也能够快速展开和收缩,因此可以猜测内部有可能处理了Fling事件。通过源码,找到对应的Behavior,它继承自HeaderBehavior,通过onTouchEvent方法,找到了对应对于Fling事件的处理

    case MotionEvent.ACTION_UP:if (mVelocityTracker != null) {mVelocityTracker.addMovement(ev);mVelocityTracker.computeCurrentVelocity(1000);float yvel = mVelocityTracker.getYVelocity(mActivePointerId);fling(parent, child, -getScrollRangeForDragFling(child), 0, yvel);}

进入fling方法,找到了scroller对象,AppBarLayout的快速滑动效果就是通过它来实现的。至于为什么AppBarLayout向上快速滑动到边界时,突然停止,没有惯性滑动,是因为scroller在调用fling方法时设置了minOffset(向上滑动边界)

    final boolean fling(CoordinatorLayout coordinatorLayout, V layout, int minOffset,int maxOffset, float velocityY) {if (mFlingRunnable != null) {layout.removeCallbacks(mFlingRunnable);mFlingRunnable = null;}if (mScroller == null) {mScroller = new OverScroller(layout.getContext());}mScroller.fling(0, getTopAndBottomOffset(), // curr0, Math.round(velocityY), // velocity.0, 0, // xminOffset, maxOffset); // yif (mScroller.computeScrollOffset()) {mFlingRunnable = new FlingRunnable(coordinatorLayout, layout);ViewCompat.postOnAnimation(layout, mFlingRunnable);return true;} else {onFlingFinished(coordinatorLayout, layout);return false;}}

而具体的view的移动,则是通过FlingRunnable来实现。

 private class FlingRunnable implements Runnable {private final CoordinatorLayout mParent;private final V mLayout;FlingRunnable(CoordinatorLayout parent, V layout) {mParent = parent;mLayout = layout;}@Overridepublic void run() {if (mLayout != null && mScroller != null) {if (mScroller.computeScrollOffset()) {setHeaderTopBottomOffset(mParent, mLayout, mScroller.getCurrY());// Post ourselves so that we run on the next animationViewCompat.postOnAnimation(mLayout, this);} else {onFlingFinished(mParent, mLayout);}}}}

通过这个FlingRunnable类,我们知道AppBarLayout能快速展开和收缩,就是通过它实现的。

具体实现

首先,我们把design中的AppBarLayout源码复制到自己的package中,引入报红的相关文件,具体如下:
工程目录
其中ScrollItem,ReflectUtil,ViewPagerUtil为我们自己定义的,其他都是design包拷贝的。
通过前面三块代码,我们知道AppBarLayout的Fling效果是通过scroller实现的,滑动的边界时通过minOffset和maxOffset来控制的,当滑动的offset超出范围时,scroller调用computeScrollerOffset就为false,顶部view就停止移动了。

因此为了能让AppBarLayout在向上滑动到minOffset边界时不停止移动,把这个minOffset保存到FlingRunnable中,在scroller.fling方法中这个更小的offset,这个在滑动到minOffset时,computeScrollerOffset就不会为false,并且在FlingRunnable中因为有minOffset,我们可以在mScroller.computeScrollOffset里判断是否滑出边界,通过差值,继续滑动底部的可滑动布局。

  mScroller.fling(0, getTopAndBottomOffset(), // curr0, Math.round(velocityY), // velocity.0, 0, // xminOffset-5000, maxOffset); // 设置一个很大的值,在向上滑动时不会因为低于minOffset而停止滑动

在FlingRunnable中新增minOffset字段,run方法中,如果currY<minOffset表示AppBarLayout向上滑动值收缩状态,可以滑动底部布局了,scrollNext(),传入偏移量minOffset-currY

 class FlingRunnable implements Runnable {private final CoordinatorLayout mParent;private final V mLayout;private int minOffset;FlingRunnable(CoordinatorLayout parent, V layout, int min) {mParent = parent;mLayout = layout;minOffset = min;}@Overridepublic void run() {if (mLayout != null && mScroller != null) {if (mScroller.computeScrollOffset()) {int currY = mScroller.getCurrY();if (currY < 0 && currY < minOffset) {scrollNext(minOffset - currY);setHeaderTopBottomOffset(mParent, mLayout, minOffset);} else {setHeaderTopBottomOffset(mParent, mLayout, currY);}// Post ourselves so that we run on the next animationViewCompat.postOnAnimation(mLayout, this);} else {onFlingFinished(mParent, mLayout);}}}}

在构造FlingRunnable时传入minOffset

final boolean fling(CoordinatorLayout coordinatorLayout, V layout, int minOffset,int maxOffset, float velocityY) {if (mFlingRunnable != null) {layout.removeCallbacks(mFlingRunnable);mFlingRunnable = null;}if (mScroller == null) {mScroller = new OverScroller(layout.getContext());}mScroller.fling(0, getTopAndBottomOffset(), // curr0, Math.round(velocityY), // velocity.0, 0, // xminOffset-5000, maxOffset); // yif (mScroller.computeScrollOffset()) {mFlingRunnable = new FlingRunnable(coordinatorLayout, layout, minOffset);ViewCompat.postOnAnimation(layout, mFlingRunnable);return true;} else {...}}

接着就是具体scrollNext方法了,具体就是找到底部的NestedScrollingChild(如RecyclerView,NestedScrollView,ViewPager,主要是这三个)。
在FlingRunnable中新增ScrollItem字段用于处理scroll逻辑

class FlingRunnable implements Runnable {private final CoordinatorLayout mParent;private final V mLayout;private int minOffset;private ScrollItem scrollItem;FlingRunnable(CoordinatorLayout parent, V layout, int min) {mParent = parent;mLayout = layout;minOffset = min;initNextScrollView(parent);}private void initNextScrollView(CoordinatorLayout parent) {int count = parent.getChildCount();for (int i = 0; i < count; i++) {View v = parent.getChildAt(i);CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) v.getLayoutParams();if (lp.getBehavior() instanceof AppBarLayout.ScrollingViewBehavior) {scrollItem = new ScrollItem(v);}}@Overridepublic void run() {if (mLayout != null && mScroller != null) {if (mScroller.computeScrollOffset()) {int currY = mScroller.getCurrY();if (currY < 0 && currY < minOffset) {scrollItem.scroll(minOffset - currY); //处理逻辑在ScrollItem中setHeaderTopBottomOffset(mParent, mLayout, minOffset);} else {setHeaderTopBottomOffset(mParent, mLayout, currY);}// Post ourselves so that we run on the next animationViewCompat.postOnAnimation(mLayout, this);} else {onFlingFinished(mParent, mLayout);}}}
}

而在新增的ScrollItem中,我们来处理对应的scroll操作(NestedScrollView可以通过scrollTo,而RecyclerView则需要用LinearLayoutManager来控制了)

public class ScrollItem {private int type; //1: NestedScrollView   2:RecyclerViewprivate WeakReference<NestedScrollView> scrollViewRef;private WeakReference<LinearLayoutManager> layoutManagerRef;public ScrollItem(View v) {findScrollItem(v);}/*** 查找需要滑动的scroll对象** @param v*/protected boolean findScrollItem(View v) {if (findCommonScroll(v)) return true;if (v instanceof ViewPager) {View root = ViewPagerUtil.findCurrent((ViewPager) v);if (root != null) {View child = root.findViewWithTag("fling");return findCommonScroll(child);}}return false;}private boolean findCommonScroll(View v) {if (v instanceof NestedScrollView) {type = 1;scrollViewRef = new WeakReference<NestedScrollView>((NestedScrollView) v);stopScroll(scrollViewRef.get());return true;}if (v instanceof RecyclerView) {RecyclerView.LayoutManager lm = ((RecyclerView) v).getLayoutManager();if (lm instanceof LinearLayoutManager) {LinearLayoutManager llm = (LinearLayoutManager) lm;type = 2;layoutManagerRef = new WeakReference<LinearLayoutManager>(llm);stopScroll((RecyclerView) v);return true;}}return false;}/*** 停止NestedScrollView滚动** @param v*/private void stopScroll(NestedScrollView v) {try {Field field = ReflectUtil.getDeclaredField(v, "mScroller");if (field == null) return;field.setAccessible(true);OverScroller scroller = (OverScroller) field.get(v);if (scroller != null) scroller.abortAnimation();} catch (Exception e) {e.printStackTrace();}}/*** 停止RecyclerView滚动** @param*/private void stopScroll(RecyclerView rv) {try {Field field = ReflectUtil.getDeclaredField(rv, "mViewFlinger");if (field == null) return;field.setAccessible(true);Object obj = field.get(rv);if (obj == null) return;Method method = obj.getClass().getDeclaredMethod("stop");method.setAccessible(true);method.invoke(obj);} catch (Exception e) {e.printStackTrace();}}public void scroll(int dy) {if (type == 1) {scrollViewRef.get().scrollTo(0, dy);} else if (type == 2) {layoutManagerRef.get().scrollToPositionWithOffset(0, -dy);}}}

至于ViewPager,因为getChildAt会有空值问题,这里是通过adapter获取fragment然后获取rootView做处理

public class ViewPagerUtil {public static View findCurrent(ViewPager vp) {int position = vp.getCurrentItem();PagerAdapter adapter = vp.getAdapter();if (adapter instanceof FragmentStatePagerAdapter) {FragmentStatePagerAdapter fsp = (FragmentStatePagerAdapter) adapter;return fsp.getItem(position).getView();} else if (adapter instanceof FragmentPagerAdapter) {FragmentPagerAdapter fp = (FragmentPagerAdapter) adapter;return fp.getItem(position).getView();}return null;}
}

这里暂时没做PagerAdapter的处理逻辑,ViewPager找到当前item界面rootView后,需要找到需要继续惯性滑动到RecyclerView或NestedScrollView,为方便查找,我们给fragment布局中需要滑动的组件添加tag:“fling”,这样就可以通过findViewWithTag(“fling”)找到它。
好了,基本的滑动逻辑处理完了,我们自己的AppBarLayout可以惯性fling了。会看ScrollItem代码,我加了stopScroll的逻辑。那是因为在底部recyclerView或NestedScrollView快速向下滑动至AppBarLayout展开,而这时在AppBarLayout想要快速向上滑动,应为底部正在滑动,导致两者冲突,不能正常向上滑动,所以AppBarLayout在向上快速滑动时,要停止底部滑动。通过NestedScrollView和RecyclerView的源码,我们找到控制滑动逻辑的OverScroller和ViewFlinger,我们可以通过反射来停止对应的滑动。

项目地址

FlingAppBarLayout
具体的效果在github上下载,工程还有关于SmartRefreshLayout兼容适配

这篇关于自定义AppBarLayout,让它Fling起来更流畅的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/381101

相关文章

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06

MySQL数据库宕机,启动不起来,教你一招搞定!

作者介绍:老苏,10余年DBA工作运维经验,擅长Oracle、MySQL、PG、Mongodb数据库运维(如安装迁移,性能优化、故障应急处理等)公众号:老苏畅谈运维欢迎关注本人公众号,更多精彩与您分享。 MySQL数据库宕机,数据页损坏问题,启动不起来,该如何排查和解决,本文将为你说明具体的排查过程。 查看MySQL error日志 查看 MySQL error日志,排查哪个表(表空间

怎么让1台电脑共享给7人同时流畅设计

在当今的创意设计与数字内容生产领域,图形工作站以其强大的计算能力、专业的图形处理能力和稳定的系统性能,成为了众多设计师、动画师、视频编辑师等创意工作者的必备工具。 设计团队面临资源有限,比如只有一台高性能电脑时,如何高效地让七人同时流畅地进行设计工作,便成为了一个亟待解决的问题。 一、硬件升级与配置 1.高性能处理器(CPU):选择多核、高线程的处理器,例如Intel的至强系列或AMD的Ry

自定义类型:结构体(续)

目录 一. 结构体的内存对齐 1.1 为什么存在内存对齐? 1.2 修改默认对齐数 二. 结构体传参 三. 结构体实现位段 一. 结构体的内存对齐 在前面的文章里我们已经讲过一部分的内存对齐的知识,并举出了两个例子,我们再举出两个例子继续说明: struct S3{double a;int b;char c;};int mian(){printf("%zd\n",s

Spring 源码解读:自定义实现Bean定义的注册与解析

引言 在Spring框架中,Bean的注册与解析是整个依赖注入流程的核心步骤。通过Bean定义,Spring容器知道如何创建、配置和管理每个Bean实例。本篇文章将通过实现一个简化版的Bean定义注册与解析机制,帮助你理解Spring框架背后的设计逻辑。我们还将对比Spring中的BeanDefinition和BeanDefinitionRegistry,以全面掌握Bean注册和解析的核心原理。

用Unity2D制作一个人物,实现移动、跳起、人物静止和动起来时的动画:中(人物移动、跳起、静止动作)

上回我们学到创建一个地形和一个人物,今天我们实现一下人物实现移动和跳起,依次点击,我们准备创建一个C#文件 创建好我们点击进去,就会跳转到我们的Vision Studio,然后输入这些代码 using UnityEngine;public class Move : MonoBehaviour // 定义一个名为Move的类,继承自MonoBehaviour{private Rigidbo

Oracle type (自定义类型的使用)

oracle - type   type定义: oracle中自定义数据类型 oracle中有基本的数据类型,如number,varchar2,date,numeric,float....但有时候我们需要特殊的格式, 如将name定义为(firstname,lastname)的形式,我们想把这个作为一个表的一列看待,这时候就要我们自己定义一个数据类型 格式 :create or repla

HTML5自定义属性对象Dataset

原文转自HTML5自定义属性对象Dataset简介 一、html5 自定义属性介绍 之前翻译的“你必须知道的28个HTML5特征、窍门和技术”一文中对于HTML5中自定义合法属性data-已经做过些介绍,就是在HTML5中我们可以使用data-前缀设置我们需要的自定义属性,来进行一些数据的存放,例如我们要在一个文字按钮上存放相对应的id: <a href="javascript:" d

一步一步将PlantUML类图导出为自定义格式的XMI文件

一步一步将PlantUML类图导出为自定义格式的XMI文件 说明: 首次发表日期:2024-09-08PlantUML官网: https://plantuml.com/zh/PlantUML命令行文档: https://plantuml.com/zh/command-line#6a26f548831e6a8cPlantUML XMI文档: https://plantuml.com/zh/xmi

argodb自定义函数读取hdfs文件的注意点,避免FileSystem已关闭异常

一、问题描述 一位同学反馈,他写的argo存过中调用了一个自定义函数,函数会加载hdfs上的一个文件,但有些节点会报FileSystem closed异常,同时有时任务会成功,有时会失败。 二、问题分析 argodb的计算引擎是基于spark的定制化引擎,对于自定义函数的调用跟hive on spark的是一致的。udf要通过反射生成实例,然后迭代调用evaluate。通过代码分析,udf在