Android动画使用demo（补间动画，属性动画-ValueAnimator & ObjectAnimator）

谁践踏了优雅 2022-10-05 10:59 368阅读 0赞

点击不同按钮，可以实现控件的平移，缩放，旋转和透明度变化，从而实现各个控件的动画效果。  
一、补间动画使用demo  
1、BJAnimatorActivity

public class BJAnimatorActivity extends Activity implements View.OnClickListener { 
        private Button mBtnScale;
        private Button mBtnTranstion;
        private Button mBtnRotate;
        private Button mBtnAlpha;
        private Button mBtnAniSet;
        private ImageView mImg;
    
        @Override
        protected void onCreate(@Nullable Bundle savedInstanceState) { 
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_bj_animator);
            initview();
        }
    
        private void initview() { 
            mBtnTranstion = findViewById(R.id.bjTrans);
            mBtnScale = findViewById(R.id.bjScale);
            mBtnRotate = findViewById(R.id.bjRotate);
            mBtnAlpha = findViewById(R.id.bjAlpha);
            mBtnAniSet = findViewById(R.id.bjAniSet);
            mImg = findViewById(R.id.bjImg);
    
            mBtnTranstion.setOnClickListener(this);
            mBtnScale.setOnClickListener(this);
            mBtnRotate.setOnClickListener(this);
            mBtnAlpha.setOnClickListener(this);
            mBtnAniSet.setOnClickListener(this);
        }
    
        @Override
        public void onClick(View v) { 
            switch (v.getId()) { 
                case R.id.bjTrans:
                    /*animation = AnimationUtils.loadAnimation(this, R.anim.animator_translate); mImg.startAnimation(animation);*/
                    TranslateAnimation translateAnimation = new TranslateAnimation(0, 200, 0, 200);
                    translateAnimation.setDuration(1000L);
                    // 动画执行完成后保持状态
                    translateAnimation.setFillAfter(true);
                    mImg.startAnimation(translateAnimation);
                    break;
                case R.id.bjScale:
                    ScaleAnimation scaleAnimation = new ScaleAnimation(1, 2, 1, 2, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
                    scaleAnimation.setDuration(2000L);
                    mImg.startAnimation(scaleAnimation);
                    break;
                case R.id.bjRotate:
                    RotateAnimation rotateAnimation = new RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
                    rotateAnimation.setDuration(2000L);
                    mImg.startAnimation(rotateAnimation);
                    break;
                case R.id.bjAlpha:
                    AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0.1f);
                    alphaAnimation.setDuration(2000L);
                    mImg.startAnimation(alphaAnimation);
                    break;
                case R.id.bjAniSet:
                    Animation animationSet = AnimationUtils.loadAnimation(this, R.anim.aset);
                    //开始动画集
                    animationSet.start();
                    //取消动画集
                    animationSet.cancel();
                    //判断当前动画集是否开始
                    animationSet.hasStarted();
                    //判断当前动画集是否结束
                    animationSet.hasEnded();
                    //重新开始当前动画集
                    animationSet.reset();
    
                    mImg.startAnimation(animationSet);
                default:
                    break;
            }
        }
    }

2、activity\_bj\_animator.xml

3、aset.xml

4、实现效果  
![在这里插入图片描述][2021060819331666.png]  
二、属性动画-ValueAnimator 使用demo  
1、AnimatorActivity

public class AnimatorActivity extends Activity implements View.OnClickListener { 
        private Button mBtnTranslate;
        private Button mBtnScale;
        private Button mBtnRotate;
        private Button mBtnAlpha;
        private ImageView mImgs;
        private LinearLayout mLinear;
        private int width;
        private int height;
    
        @Override
        protected void onCreate(@Nullable Bundle savedInstanceState) { 
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_animator);
            initview();
        }
    
        private void initview() { 
            mBtnTranslate = findViewById(R.id.translate);
            mBtnScale = findViewById(R.id.scales);
            mBtnRotate = findViewById(R.id.rotate);
            mBtnAlpha = findViewById(R.id.alpha);
            mImgs = findViewById(R.id.imgs);
            mLinear = findViewById(R.id.linearAnimator);
    
            mBtnTranslate.setOnClickListener(this);
            mBtnScale.setOnClickListener(this);
            mBtnRotate.setOnClickListener(this);
            mBtnAlpha.setOnClickListener(this);
            mImgs.setOnClickListener(this);
        }
    
        @Override
        public void onClick(View v) { 
            switch (v.getId()) { 
                case R.id.translate:
                    lineAnimator();
                    break;
                case R.id.scales:
                    scaleAnimator();
                    break;
                case R.id.rotate:
                    raAnimator();
                    break;
                case R.id.alpha:
                    cricleAnimator();
                    break;
                default:
                    break;
            }
        }
    
        // 定义一个修改ImageView位置的方法
        private void moveView(View view, int rawX, int rawY) { 
            int left = rawX - mImgs.getWidth() / 2;
            int top = rawY - mImgs.getHeight();
            int width = left + view.getWidth();
            int height = top + view.getHeight();
            view.layout(left, top, width, height);
        }
    
        // 位移，按轨迹方程来运动
        private void lineAnimator() { 
            width = mLinear.getWidth();
            height = mLinear.getHeight();
            ValueAnimator xValue = ValueAnimator.ofInt(height, 0, height / 4, height / 2, height / 4 * 3, height);
            xValue.setDuration(3000L);
            xValue.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
                @Override
                public void onAnimationUpdate(ValueAnimator animation) { 
                    // 轨迹方程
                    int x = width / 2;
                    int y = (int) animation.getAnimatedValue();
                    moveView(mImgs, x, y);
                }
            });
            xValue.setInterpolator(new LinearInterpolator());
            xValue.start();
        }
    
        // 缩放效果
        private void scaleAnimator() { 
            ValueAnimator vValue = ValueAnimator.ofFloat(1.0f, 0.6f, 1.2f, 1.0f, 0.6f, 1.2f, 1.0f);
            vValue.setDuration(1000L);
            vValue.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
                @Override
                public void onAnimationUpdate(ValueAnimator animation) { 
                    float scale = (float) animation.getAnimatedValue();
                    mImgs.setScaleX(scale);
                    mImgs.setScaleY(scale);
                }
            });
            vValue.setInterpolator(new LinearInterpolator());
            vValue.start();
        }
    
        // 旋转且透明度变化
        private void raAnimator() { 
            ValueAnimator rValue = ValueAnimator.ofInt(0, 360);
            rValue.setDuration(1000L);
            rValue.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
                @Override
                public void onAnimationUpdate(ValueAnimator animation) { 
                    int rotateValue = (int) animation.getAnimatedValue();
                    mImgs.setRotation(rotateValue);
                    float fractionValue = animation.getAnimatedFraction();
                    mImgs.setAlpha(fractionValue);
                }
            });
            rValue.setInterpolator(new LinearInterpolator());
            rValue.start();
        }
    
        // 圆形旋转
        private void cricleAnimator() { 
            width = mLinear.getWidth();
            height = mLinear.getHeight();
            int R = width / 4;
            ValueAnimator tValue = ValueAnimator.ofFloat(0, (float) (2.0f * Math.PI));
            tValue.setDuration(1000L);
            tValue.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 
                @Override
                public void onAnimationUpdate(ValueAnimator animation) { 
                    float t = (float) animation.getAnimatedValue();
                    int x = (int) (R * Math.sin(t) + width / 2);
                    int y = (int) (R * Math.cos(t) + height / 2);
                    moveView(mImgs, x, y);
                }
            });
            tValue.setInterpolator(new LinearInterpolator());
            tValue.start();
        }
    }

2、activity\_animator.xml

3、实现效果  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDQ5NTY3OA_size_16_color_FFFFFF_t_70]  
三、属性动画-ObjectAnimator 使用demo  
1、ObjectAnimatorActivity

public class ObjectAnimatorActivity extends Activity implements View.OnClickListener { 
        private Button mBtnScale;
        private Button mBtnTranstion;
        private Button mBtnRotate;
        private Button mBtnAlpha;
        private ImageView mObgImg;
    
        @Override
        protected void onCreate(@Nullable Bundle savedInstanceState) { 
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_object_animator);
            initview();
        }
    
        private void initview() { 
            mBtnTranstion = findViewById(R.id.objTrans);
            mBtnScale = findViewById(R.id.objScale);
            mBtnRotate = findViewById(R.id.objRotate);
            mBtnAlpha = findViewById(R.id.objAlpha);
            mObgImg = findViewById(R.id.objImg);
    
            mBtnTranstion.setOnClickListener(this);
            mBtnScale.setOnClickListener(this);
            mBtnRotate.setOnClickListener(this);
            mBtnAlpha.setOnClickListener(this);
    
        }
    
        @Override
        public void onClick(View v) { 
            switch (v.getId()) { 
                case R.id.objTrans:
                    transtionAnimator();
                    break;
                case R.id.objScale:
                    scaleAnomator();
                    break;
                case R.id.objRotate:
                    rotateAnimator();
                    break;
                case R.id.objAlpha:
                    alphaAnomator();
                    break;
                default:
                    break;
            }
        }
    
        // 平移
        private void transtionAnimator() { 
            // 沿X轴平移,还有Y轴平移
            /*ObjectAnimator animator = ObjectAnimator.ofFloat(mObgImg, "translationX", 0, 100, 200, -100, -200, 0); animator.setDuration(1000L); animator.start();*/
    
            // X,Y轴同时平移
            AnimatorSet animatorSet = new AnimatorSet();
            animatorSet.playTogether(
                    ObjectAnimator.ofFloat(mObgImg, "translationX", 0, 100, 200, -100, -200, 0)
                            .setDuration(2000L),
    
                    ObjectAnimator.ofFloat(mObgImg, "translationY", 0, 100, 200, -100, -200, 0)
                            .setDuration(2000L)
            );
            animatorSet.start();
        }
    
        // 缩放
        private void scaleAnomator() { 
            // 沿X轴缩放,还有Y轴缩放
            /*ObjectAnimator animator = ObjectAnimator.ofFloat(mObgImg, "scaleX", 1f, 1.5f, 2f, 1.5f, 1f); animator.setDuration(1000L); animator.start();*/
    
            // X,Y轴同时缩放
            AnimatorSet animatorSet = new AnimatorSet();
            animatorSet.playTogether(
                    ObjectAnimator.ofFloat(mObgImg, "scaleX", 1f, 1.5f, 2f, 1.5f, 1f)
                            .setDuration(2000L),
                    ObjectAnimator.ofFloat(mObgImg, "scaleY", 1f, 1.5f, 2f, 1.5f, 1f)
                            .setDuration(2000L)
            );
            animatorSet.start();
        }
    
        // 旋转
        private void rotateAnimator() { 
            // 沿X轴旋转,还有Y轴旋转和Z轴旋转
            /*ObjectAnimator animator = ObjectAnimator.ofFloat(mObgImg, "rotationX", 0,360); animator.setDuration(2000L); animator.start();*/
    
            // X,Y,Z轴同时缩放
            AnimatorSet animatorSet = new AnimatorSet();
            animatorSet.playTogether(
                    ObjectAnimator.ofFloat(mObgImg, "rotationX", 0, 360)
                            .setDuration(2000L),
                    ObjectAnimator.ofFloat(mObgImg, "rotationY", 0, 360)
                            .setDuration(2000L),
                    ObjectAnimator.ofFloat(mObgImg, "rotation", 0, 360)
                            .setDuration(2000L)
            );
            animatorSet.start();
        }
    
        // 透明
        private void alphaAnomator() { 
    
            ObjectAnimator animator = ObjectAnimator.ofFloat(mObgImg, "alpha", 0, 0.5f, 1.0f);
            animator.setDuration(2000L);
            animator.start();
        }
    }

2、activity\_object\_animator.xml

3、实现效果  
![在这里插入图片描述][2021060819425811.png]

[2021060819331666.png]: /images/20221005/e43f04407bac47718b2c68d339fa38d6.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDQ5NTY3OA_size_16_color_FFFFFF_t_70]: /images/20221005/96c9be650c4e4307a19c9482b2e0d5c5.png
[2021060819425811.png]: /images/20221005/3d199d47e30a4c77907f02c8d97cbac4.png