文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

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

2022-06-06 11:24

关注

1,刚刚在别人开源的项目中看到了一个挺不错的用户体验,效果图如下:

2,那下面我们就来实现一下,首先看一下布局,由于一般只是我们包含头像的那部分方法,所以这里我们要把布局分成两部分,对应的布局文件效果图如下:

3,自定义ScrollView

第一步:创建一个类,继承自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);
  }
} 

第二步:重写OnFinishInflate()方法,并记录第一个子view,即我们的head_fragment


@Override
  protected void onFinishInflate() {
    super.onFinishInflate();
    //设置不可过度滚动,否则上移后下拉会出现部分空白的情况
    setOverScrollMode(OVER_SCROLL_NEVER);
    View child = getChildAt(0);
    if (child != null && child instanceof ViewGroup) {
      //获取默认第一个子View
      mHeaderView = ((ViewGroup) child).getChildAt(0);
    }
  } 

第三步:重写OnTouchEvent()方法,在Action_Move方法中拿到下滑的距离,通过设置head_view的属性参数来改变它的大小,在UP的时候还原head_view


@Override
  public boolean onTouchEvent(MotionEvent ev) {
    if (mHeaderView == null)
      return super.onTouchEvent(ev);
    switch (ev.getAction()) {
      case MotionEvent.ACTION_MOVE:
        if (!mIsPulling) {
          //第一次下拉
          if (getScrollY() == 0) {
            //在顶部的时候,记录顶部位置
            mLastY = (int) ev.getY();
          } else {
            break;
          }
        }
        if (ev.getY() - mLastY < 0)
          return super.onTouchEvent(ev);
        int distance = (int) ((ev.getY() - mLastY) * mScaleRatio);
        mIsPulling = true;
        setZoom(distance);
        return true;
      case MotionEvent.ACTION_UP:
        mIsPulling = false;
        replyView();
        break;
    }
    return super.onTouchEvent(ev);
  } 

在回弹view的时候通过属性动画动态的改变head_view的值,并重写onSizeChange()方法,实时的记录head_view的宽高



  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);
  }
  
  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();
  }
@Override
  protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);
    mHeaderWidth = mHeaderView.getMeasuredWidth();
    mHeaderHeight = mHeaderView.getMeasuredHeight();
  } 

这样就实现了我们的效果了,看一下我们自己实现的效果:

demo下载:ZoomInScrollView_jb51.rar

您可能感兴趣的文章:Android仿IOS回弹效果 支持任何控件Android ScrollView实现横向和竖向拖动回弹效果Android ScrollView的顶部下拉和底部上拉回弹效果Android自定义ScrollView实现放大回弹效果Android 实现ViewPager边界回弹效果实例代码Android界面上拉下拉的回弹效果实例代码android仿QQ个人主页下拉回弹效果Android RecyclerView上拉加载更多功能回弹实现代码Android ReboundScrollView仿IOS拖拽回弹效果Android编程ViewPager回弹效果实例分析Android自定义控件仿ios下拉回弹效果


阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-移动开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯