欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android自定义ScrollView实现放大回弹效果

程序员文章站 2023-12-02 22:40:22
背景 在很多项目中我们都会用到scrollview这个控件,因为scrollview能够在屏幕内容多时下上滑动以适配加载的内容。但是scrollview滑动时效果感觉太死...

背景

在很多项目中我们都会用到scrollview这个控件,因为scrollview能够在屏幕内容多时下上滑动以适配加载的内容。但是scrollview滑动时效果感觉太死板了,这个时候我们如果给它添加一个回弹的动画效果,会让界面交互更加舒服,提升用户体验效果。

Android自定义ScrollView实现放大回弹效果

自定义scrollview

1、创建一个类,继承scrollview并重写相应的构造函数

public class zoominscrollview extends scrollview {

  public zoominscrollview(context context) {
    this(context, null);
  }

  public zoominscrollview(context context, attributeset attrs) {
    this(context, attrs, 0);
  }

  public zoominscrollview(context context, attributeset attrs, int defstyleattr) {
    super(context, attrs, defstyleattr);
  }
}

2、获取默认第一个子view即我们的头部mheaderview

@override
protected void onfinishinflate() {
  super.onfinishinflate();
  // 设置不可过度滚动,否则上移后下拉会出现部分空白的情况
  setoverscrollmode(over_scroll_never);
  view child = getchildat(0);
  if (child != null && child instanceof viewgroup) {
    // 获取默认第一个子view
    viewgroup vg = (viewgroup) getchildat(0);
    if (vg.getchildat(0) != null) {
      mheaderview = vg.getchildat(0);
    }
  }
}

3、获取头部view的长和宽

@override
protected void onsizechanged(int w, int h, int oldw, int oldh) {
  super.onsizechanged(w, h, oldw, oldh);
  mheaderwidth = mheaderview.getmeasuredwidth();
  mheaderheight = mheaderview.getmeasuredheight();
}

4、设置上下滑动标记

@override
public boolean dispatchtouchevent(motionevent ev) {
  currentx = ev.getx();
  currenty = ev.gety();

  switch (ev.getaction()) {
    case motionevent.action_move:
      distancex = currentx - lastx;
      distancey = currenty - lasty;
      if (math.abs(distancex) < math.abs(distancey) && math.abs(distancey) > 12) {
        updownslide = true;
      }
      break;
  }

  lastx = currentx;
  lasty = currenty;

  if (updownslide && mheaderview != null) {
    commontouchevent(ev);
  }
  return super.dispatchtouchevent(ev);
}

5、监听触摸事件

private void commontouchevent(motionevent ev) {
  switch (ev.getaction()) {
    case motionevent.action_up:
      // 手指离开后头部恢复图片
      mispulling = false;
      replyview();
      clear();
      break;
    case motionevent.action_move:
      if (!mispulling) {
        // 第一次下拉
        if (getscrolly() == 0) {
          // 滚动到顶部时记录位置,否则正常返回
          mlasty = (int) ev.gety();
        } else {
          break;
        }
      }

      int distance = (int) ((ev.gety() - mlasty) * mscaleratio);
      // 当前位置比记录位置要小时正常返回
      if (distance < 0) {
        break;
      }
      mispulling = true;
      setzoom(distance);
      break;
  }
}

6、头部缩放

private void setzoom(float s) {
  float scaletimes = (float) ((mheaderwidth + s) / (mheaderwidth * 1.0));
  // 如超过最大放大倍数则直接返回
  if (scaletimes > mscaletimes) {
    return;
  }
  viewgroup.layoutparams layoutparams = mheaderview.getlayoutparams();
  layoutparams.width = (int) (mheaderwidth + s);
  layoutparams.height = (int) (mheaderheight * ((mheaderwidth + s) / mheaderwidth));
  // 设置控件水平居中
  ((marginlayoutparams) layoutparams).setmargins(-(layoutparams.width - mheaderwidth) / 2, 0, 0, 0);
  mheaderview.setlayoutparams(layoutparams);
}

7、回弹动画

private void replyview() {
  final float distance = mheaderview.getmeasuredwidth() - mheaderwidth;
  // 设置动画
  valueanimator anim = objectanimator.offloat(distance, 0.0f).setduration((long) (distance * mreplyratio));
  anim.addupdatelistener(new valueanimator.animatorupdatelistener() {
    @override
    public void onanimationupdate(valueanimator animation) {
      setzoom((float) animation.getanimatedvalue());
    }
  });
  anim.start();
}

通过以上方式就可以简单的实现我们想要的效果了!

项目地址 ☞ 传送门

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。