仿小红书嵌套滑动效果

本文介绍如何借助嵌套滑动机制实现小红书应用中的滑动效果。分析了两种思路,重点讲解使用NestedScrolling机制的实现过程,包括NestedRecyclerView和LinearLayoutNestScrollParent的详细设置,以及如何通过Scroller实现弹性滑动效果。
摘要由CSDN通过智能技术生成

小红书效果

分析

  • 思路一:可以通过自定义view来实现类似 (比较麻烦,参考这里
  • 思路二:借助 NestScrolling 机制实现 (比较简单,关于嵌套滑动概述参考这里

下面就用思路二来分析一下如何实现

滑动效果分析

  • recyclerView 上滑时,如果手指没有滑过 recyclerView 的顶部,那么 recyclerView 自己消费滑动事件;否则开始嵌套滑动(整体上滑)。当手指抬起时候如果滑动距离大于 50dp ,通过惯性滑动滑到顶部,否则滑回到初始位置
  • recyclerView 下滑时,如果recyclerView的第一个 item 不是完全可见,那么 recyclerView 自己消费滑动事件;否则开始嵌套滑动(整体下滑)。当手指抬起时候如果滑动距离大于 50dp ,通过惯性滑动滑到底部,否则滑回到初始位置

实现

NestedRecyclerView(NestScrollChild)

public class NestedRecyclerView extends RecyclerView {
   


    private float topPadding = Utils.dp2Px(50);
    private float scrollSlop = Utils.dp2Px(50); //滑动超过这个距离松手后自动自动滑动到顶部
    private float downY;
    private float moveY;
    private float deltaMoveY;
    private float deltaDownMoveY;
    private float lastMoveY;
    public OverScroller mScroller;
    private int firstCompletelyVisiblePosition;

    public NestedRecyclerView(@NonNull Context context) {
   
        this(context, null);
    }

    public NestedRecyclerView(@NonNull Context context, @Nullable AttributeSet attrs) {
   
        super(context, attrs);
        init(context);
    }

    private void init(Context context) {
   
        mScroller = new OverScroller(context);
    }


    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {
   
        switch (event.getAction()) {
   
            case MotionEvent.ACTION_DOWN:
                Log.d("NestedRecyclerView", "ACTION_DOWN");
                downY = event.getRawY();
                lastMoveY = event.getRawY();
                break;
        }
        return super.dispatchTouchEvent(event);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
   
        switch (event.getAction()) {
   
            case MotionEvent.ACTION_DOWN:
                Log.d("NestedRecyclerView", "ACTION_DOWN");
                
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值