Android 属性动画实现抛物线动画

Posted 2022-12-01 我爱烤冷面

此前多次学习过安卓动画，知道有三种动画，知道三种动画的特性，但是一直没有实践过，看了没有多久，就忘记了，而且也不会用，这次通过实现“抛物线”动画，对安卓的动画有了一次较为明确的理解。

首先，安卓的三种动画有哪三种呢？
1、Tween Animation 渐变（补间）动画
2、Animation-list 逐帧动画
3、Property Animation——Animator 属性动画

以我的理解方式来解释这三种动画，以操作一个view为例。

第一，补间动画Tween Animation是四种动画类型（位移、旋转、透明度、伸缩）操作于这个view， 使这个view产生相应的视觉效果，但是没有改变view本身的任何属性（这个不想多解释了，每篇动画文章都会提到这句）。补间动画对应4个动画类：AlphaAnimation（透明度）、ScaleAnimation（缩放）、TranslateAnimation（位移）、RotateAnimation（旋转），我们可以在代码中，通过操作这4个类，来实现自己想要的动画效果，当然，我们也可以使用布局文件来实现（alph、scale、translate、rotate）。

第二，逐帧动画Animation-list 是按照给定的顺序，轮流显示一定数目的图像而显示的动画效果。参考博文http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1106/1915.html

第三，属性动画Animator，其实跟Tween 很像，也是那4种基础动画方式，但是属性动画可以改变view本身的属性，并且属性动画大体分为两种，第一种是跟tween十分相似的，ObjectAnimator，通过ofFloat、ofInt、ofObject来实现跟tween动画相似的动画方式。第二种是，ValueAnimator是计算动画过程中变化的值，包含动画的开始值，结束值，持续时间等属性。但并没有把这些计算出来的值应用到具体的对象上面，所以也不会有什么的动画显示出来。要把计算出来的值应用到对象上，必须为ValueAnimator注册一个监听器ValueAnimator.AnimatorUpdateListener，该监听器负责更新对象的属性值。在实现这个监听器的时候，可以通过getAnimatedValue()的方法来获取当前帧的值。 此时，我只想说，动画实在太复杂了！！这里我先简单介绍了3类动画的概念，接下来介绍一下实现抛物线动画，分别使用属性动画跟补间动画实现，那些负责的动画还没研究透彻，以后研究透彻了再写 ！

抛物线动画的实现

首先，套用一句别人那里学来的话，理解一下抛物线动画的原理：两个位移动画，一个横向匀速移动，一个纵向变速移动，两个动画同时执行，就有了抛物线的效果。

然后，我们看一下两个动画相同的代码部分
起始点、终点位置
//获取起点坐标
int[] location2 = new int[2];
readingIV.getLocationInWindow(location2);
int x1 = location2[0];
int y1 = location2[1];
//获取终点坐标，最近拍摄的坐标
int[] location = new int[2];
mRecentPhoto.getLocationInWindow(location);
int x2 = location[0];
int y2 = location[1]

1、补间动画实现方式

  //两个位移动画
        TranslateAnimation translateAnimationX = new TranslateAnimation(0, -(x1 - x2)-offsetX, 0, 0);   //横向动画
        TranslateAnimation translateAnimationY = new TranslateAnimation(0, 0, 0, y2 - y1 + offsetY); //竖向动画
        translateAnimationX.setInterpolator(new LinearInterpolator());  //横向动画设为匀速运动
        translateAnimationX.setRepeatCount(0);// 动画重复执行的次数
        translateAnimationY.setInterpolator(new AccelerateInterpolator());  //竖向动画设为开始结尾处加速，中间迅速
        translateAnimationY.setRepeatCount(0);// 动画重复执行的次数
        // 组合动画
        AnimationSet anim = new AnimationSet(false);
        anim.setFillAfter(false);   //动画结束不停留在最后一帧
        anim.addAnimation(translateAnimationX);
        anim.addAnimation(translateAnimationY);
        anim.setAnimationListener(new Animation.AnimationListener()    //抛物线动画结束后，执行淡出动画
            @Override
            public void onAnimationStart(Animation animation) 
            

            @Override
            public void onAnimationRepeat(Animation animation) 
            

            @Override
            public void onAnimationEnd(Animation animation) 
                AlphaAnimation alphaAnim = new AlphaAnimation(1f, 0.01f);//淡出动画
                alphaAnim.setDuration(500);
                alphaAnim.setInterpolator(new LinearInterpolator());
                alphaAnim.setFillAfter(false);   //动画结束不停留在最后一帧
                alphaAnim.setRepeatCount(0);// 动画重复执行的次数
                readingIV.clearAnimation();
                readingIV.startAnimation(alphaAnim);

                alphaAnim.setAnimationListener(new Animation.AnimationListener() 
                    @Override
                    public void onAnimationStart(Animation animation) 
                    

                    @Override
                    public void onAnimationEnd(Animation animation) 
                        readingIV.setVisibility(View.INVISIBLE);
                        refreshCouldIndicator(activity, null, null);
                    

                    @Override
                    public void onAnimationRepeat(Animation animation) 
                    
                );
            
        );
        // 播放
        readingIV.setVisibility(View.VISIBLE);
        refreshCouldIndicator(activity, null, null);
        anim.setDuration(800);// 动画的执行时间
        anim.setStartOffset(400);
        readingIV.startAnimation(anim);

通过以上方法，可以实现抛物线，并在结束的位置执行淡出动画。但是，在部分机型上， 发现该动画执行结束后， 淡出动画会跑到起始位置执行， 但是大部分机型都是没问题的， 这种适配问题我没搞清楚是什么原因导致的， 但是既然是回到初始位置执行，那么就说明跟view的属性没发生变化有关，于是采用属性动画来实现，解决了该问题，原理几乎相同。

//抛物线动画
        ObjectAnimator translateAnimationX = ObjectAnimator.ofFloat(view, "translationX", 0, -(x1 - x2) - offsetX);
        translateAnimationX.setDuration(800);
        translateAnimationX.setInterpolator(new LinearInterpolator());
//        translateAnimationX.start();
        ObjectAnimator translateAnimationY = ObjectAnimator.ofFloat(view, "translationY", 0, y2 - y1 + offsetY);
        translateAnimationY.setDuration(800);
        translateAnimationY.setInterpolator(new AccelerateInterpolator());

        //缩小动画
        ObjectAnimator scaleX = ObjectAnimator.ofFloat(view, "scaleX", 1, 0);
        scaleX.setDuration(200);
        ObjectAnimator scaleY = ObjectAnimator.ofFloat(view, "scaleY", 1, 0);
        scaleY.setDuration(200);
        scaleY.addListener(new Animator.AnimatorListener() 
            @Override
            public void onAnimationStart(Animator animation) 
            

            @Override
            public void onAnimationEnd(Animator animation) 
                anim_mask_layout.removeView(readingIV);
                setLvTouch(activity, false);
            

            @Override
            public void onAnimationCancel(Animator animation) 
            

            @Override
            public void onAnimationRepeat(Animator animation) 
            
        );
        AnimatorSet animatorSet = new AnimatorSet();
        animatorSet.play(translateAnimationX).with(translateAnimationY);
        animatorSet.play(scaleX).with(scaleY).after(translateAnimationX);
        animatorSet.start();

源码下载