Android开发中,当一个页面存放的控件超出屏幕时,通常需要使用ScrollView来包裹布局。这样用户可以通过手指的滑动来查看超出屏幕的部分。然而当ScrollView滑动到边界时,继续滑动只会显示一个阴影效果。iOS自带的控件却可以实现边界的阻尼回弹效果,这种阻尼回弹效果会让用户有更好的使用体验。这里给出一个Android上的实现方案
解决思路:
ScrollView使用时要求内部有且仅一个子View。当ScrollView滑动到边界时,让子View在ScrollView中随着手指按一定的规则进行平移,模拟出拉伸效果。当手指松开时,再让子View恢复拉伸前的位置,模拟出回弹效果。
完整的代码如下,详细的原理见注释即可
public class StretchScrollView extends NestedScrollView {
// 子View
private View innerView;
// 上次手势事件的y坐标
private float mLastY;
// 记录子View的正常位置
private Rect normal = new Rect();
public StretchScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
protected void onFinishInflate() {
initView();
super.onFinishInflate();
}
private void initView() {
// 去除原本ScrollView滚动到边界时的阴影效果
setOverScrollMode(OVER_SCROLL_NEVER);
if (getChildAt(0) != null) {
innerView = getChildAt(0);
}
}
@Override
public boolean onTouchEvent(MotionEvent ev) {
switch (ev.getAction()) {
case MotionEvent.ACTION_UP:
// 手指松开恢复
if (!normal.isEmpty()) {
planAnimation();
normal.setEmpty();
mLastY = 0;
}
break;
case MotionEvent.ACTION_MOVE:
float currentY = ev.getY();
// 滑动距离
int distanceY = (int) (mLastY - currentY);
// 处理Y轴的滚动事件,当滚动到最上或者最下时需要移动布局
// 手指刚触及屏幕时,也会触发此事件,此时mLastY的值还是0,会立即触发一个比较大的移动。这里过滤掉这种情况
if (isNeedTranslate() && mLastY != 0) {
if (normal.isEmpty()) {
// 保存正常的布局位置
normal.set(innerView.getLeft(), innerView.getTop(), innerView.getRight(), innerView.getBottom());
}
// 移动布局, 使distance / 2 防止平移过快
innerView.layout(innerView.getLeft(), innerView.getTop() - distanceY / 2,
innerView.getRight(), innerView.getBottom() - distanceY / 2);
}
mLastY = currentY;
break;
}
return super.onTouchEvent(ev);
}
public void planAnimation() {
// 开启移动动画
TranslateAnimation animation = new TranslateAnimation(0, 0, innerView.getTop(), normal.top);
animation.setDuration(200);
innerView.startAnimation(animation);
// 补间动画并不会真正修改innerView的位置,这里需要设置使得innerView回到正常的布局位置
innerView.layout(normal.left, normal.top, normal.right, normal.bottom);
}
public boolean isNeedTranslate() {
int offset = innerView.getMeasuredHeight() - getHeight();
int scrollY = getScrollY();
// 顶部或者底部
return scrollY == 0 || scrollY == offset;
}
}
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程网。