非位移、纯裁剪,下拉显示、上滑收回,跟手丝滑,支持 RecyclerView 列表
一、实现效果
在很多 App 交互中,我们会看到这种效果:
可以写在桌面负一屏下拉,可以写在空调面板,等等等
- 在 Activity 界面下拉顶部 时,顶部的列表 / View 并不是整体平移,而是从上往下一点点截取显示
- 手指向上滑动 时,视图又从下往上平滑裁剪收回
- 全程跟手,无延迟、无抖动
- 松手自动回弹展开或隐藏
- 完美支持 RecyclerView、LinearLayout 等任何 View
效果演示( 看GIF):下拉 → 截取显示列表上滑 → 平滑收回列表松手 → 自动回弹
动画
二、核心实现原理
- 不使用 View 平移 ,而是通过 clipBounds 裁剪区域 实现 "截取显示"
- 触摸事件
ACTION_MOVE实时计算手指偏移量,动态修改裁剪高度 - 下拉时增加显示高度,上滑时减少显示高度
- 松手通过
ValueAnimator实现平滑回弹动画 - 只有内容滚动到顶部时才响应下拉,避免滑动冲突
三、完整实现代码
1. 布局文件 activity_main.xml
- Activity 核心代码(Java)
四、效果说明
-
跟手裁剪手指下拉多少,列表就显示多少;手指上滑,列表实时收回。
-
无位移、纯裁剪视图本身位置不变,只改变显示区域,视觉更高级。
-
智能触发只有 NestedScrollView 滚动到顶部时才响应下拉,不会与内部滑动冲突。
-
自动回弹拉过一半自动完全展开,未拉过一半自动收回。
五、扩展优化方向
- 增加阻尼系数,让下拉更有弹性
- 支持圆角、阴影、透明渐变
- 扩展为下拉刷新、二级面板展开效果
- 兼容 RecyclerView、ScrollView 嵌套滑动