安卓特效实现之添加商品抛物线动画

大家好，我是梦辛工作的是灵，最近在做一款购物的APP，然后客户要求有个加入商品时候，商品自动调入购物车的一个特效，之前没有做过的我一脸懵逼，毫无头绪，好吧，不得不承认我自己很菜，然后经过多次百度和查阅资料，大概知道了实现逻辑，就是 新建一个 ImageView 从 起点 到 终点 显示贝塞尔曲线的一个动画过程，动画实现完后，在将ImageView 移除，然后下面是实现代码（我也是参考其他大佬的）：

 	/**
     * 商品加入到购物车的动画效果 
     */
    private void addCart(Bitmap bitmap,View start,View end,RelativeLayout parentView) {
		 
        // 1.先创建 一个 用于执行动画的 ImageView 
        final ImageView goods = new ImageView(this);
        goods.setImageBitmap(bitmap); 
        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(50,50);
        parentView.addView(goods, params);
 
        //2.获得父视图的坐标
        int[] parentLocation = new int[2];
        parentView.getLocationInWindow(parentLocation);

        //3.获得起点视图的坐标
        int startLoc[] = new int[2];
        start.getLocationInWindow(startLoc);

        //4.获得终点视图的坐标
        int endLoc[] = new int[2];
        end.getLocationInWindow(endLoc);
 
		//5.计算动画开始的坐标  结束的坐标
		
        //开始掉落的商品的起始点：商品起始点 - 父布局起始点 + 该商品图片的一半
        float startX = startLoc[0] - parentLocation[0] + start.getWidth() / 2;
        float startY = startLoc[1] - parentLocation[1] + start.getHeight() / 2;

        //商品掉落后的终点坐标：购物车起始点-父布局起始点+购物车图片的1/5
        float endX = endLoc[0] - parentLocation[0] + end.getWidth() / 5;
        float endY = endLoc[1] - parentLocation[1];

		// 6.计算中间动画的插值坐标（贝塞尔曲线）（其实就是用贝塞尔曲线来完成起终点的过程）
		
        //开始绘制贝塞尔曲线 路径
        Path path = new Path();
        
        //移动到起始点（贝塞尔曲线的起点）
        path.moveTo(startX, startY);
        
        //使用二次萨贝尔曲线：注意第一个起始坐标越大，贝塞尔曲线的横向距离就会越大，一般按照下面的式子取即可
        path.quadTo((startX + endX) / 2, startY, endX, endY);
        
        //mPathMeasure用来计算贝塞尔曲线的曲线长度和贝塞尔曲线中间插值的坐标，
        // 如果是true，path会形成一个闭环
        PathMeasure mPathMeasure = new PathMeasure(path, false);

        //属性动画实现（从0到贝塞尔曲线的长度之间进行插值计算，获取中间过程的距离值）
        ValueAnimator valueAnimator = ValueAnimator.ofFloat(0, mPathMeasure.getLength());
        valueAnimator.setDuration(300);
        
        // 匀速线性插值器
        valueAnimator.setInterpolator(new LinearInterpolator());
        
        float[] mCurrentPosition = new float[2];
        
        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                // 当插值计算进行时，获取中间的每个值，
                // 这里这个值是中间过程中的曲线长度（下面根据这个值来得出中间点的坐标值）
                float value = (Float) animation.getAnimatedValue();
                
                //获取当前点坐标封装到mCurrentPosition
                // boolean getPosTan(float distance, float[] pos, float[] tan) ：
                // 传入一个距离distance(0<=distance<=getLength())，然后会计算当前距
                // 离的坐标点和切线，pos会自动填充上坐标，这个方法很重要。
                mPathMeasure.getPosTan(value, mCurrentPosition, null);
                
                //mCurrentPosition此时就是中间距离点的坐标值
                // 移动的商品图片（动画图片）的坐标设置为该中间点的坐标
                goods.setTranslationX(mCurrentPosition[0]);
                goods.setTranslationY(mCurrentPosition[1]);
                
            }
        });
        
		// 7.执行动画
        valueAnimator.start();

		// 8.监听动画结束
		valueAnimator.addListener(new Animator.AnimatorListener() {
            @Override
            public void onAnimationStart(Animator animation) {

            }

            //当动画结束后：
            @Override
            public void onAnimationEnd(Animator animation) {
                // 移除视图
                parentView.removeView(goods);
                // 购物车的数量增加
                doAddGoods();  
            }

            @Override
            public void onAnimationCancel(Animator animation) {

            }

            @Override
            public void onAnimationRepeat(Animator animation) {

            }
        });
    }

这次学到了，大佬的代码有点乱，我重新整理和排布了下，顺带再次理解了下思路，争取后续能举一反三，大家一起加油吧
大佬传送门https://www.jb51.net/article/95991.htm