目录

目录

前言

最近有个项目需要实现一个View拖拽的效果，而且要实现如果拖动到中间要自动向两边靠拢，由于之前用实现过，这次也打算使用它，结果在有列表的布局中使用它居然失效了，无奈只好另求他法，这篇文章就是记录了我如何利用onTouch事件并结合动画实现该效果的。

效果展示

实现代码

关键代码如下

private boolean isIntercept = false;
private int startDownX;
private int startDownY;
private int lastMoveX;
private int lastMoveY;
private void initListener() {
        imgShare.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                ToastUtils.showShort("我是悬浮按钮");
            }
        });
        imgShare.setOnTouchListener(new View.OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                int action = event.getAction();
                switch (action) {
                    case MotionEvent.ACTION_DOWN:
                        startDownX = lastMoveX = (int) event.getRawX();
                        startDownY = lastMoveY = (int) event.getRawY();
                        break;
                    case MotionEvent.ACTION_MOVE:
                        int dx = (int) event.getRawX() - lastMoveX;
                        int dy = (int) event.getRawY() - lastMoveY;

                        int left = v.getLeft() + dx;
                        int top = v.getTop() + dy;
                        int right = v.getRight() + dx;
                        int bottom = v.getBottom() + dy;
                        //防止超出父布局边界
                        if (left < 0) {
                            left = 0;
                            right = left + v.getWidth();
                        }
                        if (right > rl_container.getWidth()) {
                            right = rl_container.getWidth();
                            left = right - v.getWidth();
                        }
                        if (top < 0) {
                            top = 0;
                            bottom = top + v.getHeight();
                        }
                        if (bottom > rl_container.getHeight()) {
                            bottom = rl_container.getHeight();
                            top = bottom - v.getHeight();
                        }
                        v.layout(left, top, right, bottom);
                        lastMoveX = (int) event.getRawX();
                        lastMoveY = (int) event.getRawY();
                        break;
                    case MotionEvent.ACTION_UP:
                        //当抬起手指的时候如果在中间则需忘两边靠拢
                        int left2 = v.getLeft();
                        int right2 = v.getRight();
                        if(v.getLeft()+v.getWidth()/2 >= rl_container.getWidth()/2 ){
                            //超过一半的时候靠右
                            right2 = rl_container.getWidth();
                            left2 = right2 - v.getWidth();
                        }else if(v.getLeft()+v.getWidth()/2 < rl_container.getWidth()/2){
                            //小于一半的时候靠左
                            left2 = 0;
                            right2 = left2 + v.getWidth();
                        }
                        int lastMoveDx = Math.abs((int) event.getRawX() - startDownX);
                        int lastMoveDy = Math.abs((int) event.getRawY() - startDownY);
                        if (0 != lastMoveDx || 0 != lastMoveDy) {
                            isIntercept = true;
                        } else {
                            isIntercept = false;
                        }
                        startFloatAnim(v,left2);//执行靠拢动画
                        break;
                }
                return isIntercept;
            }
        });
    }
    /**
     * 分享按钮的悬浮动画
     * @param endLeft
     */
    private void startFloatAnim(final View v,int endLeft){
    //创建逐渐靠边的动画
        ValueAnimator valueAnimator = ValueAnimator.ofInt(v.getLeft(), endLeft);
        valueAnimator.setDuration(200);
        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                int animatedValue = (int) animation.getAnimatedValue();
                v.layout(animatedValue, v.getTop(), animatedValue+v.getWidth(), v.getBottom());
            }
        });
        valueAnimator.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                // 每次移动都要设置其layout，不然由于父布局可能嵌套listview，当父布局发生改变冲毁（如下拉刷新时）则移动的view会回到原来的位置
                RelativeLayout.LayoutParams lpFeedback = new RelativeLayout.LayoutParams(
                        v.getWidth(), v.getHeight());
                lpFeedback.leftMargin = v.getLeft();
                lpFeedback.topMargin = v.getTop();
                v.setLayoutParams(lpFeedback);
            }
        });
        valueAnimator.start();
    }

案例源码

https://github.com/myml666/ShopCarAnim