多个动画组合、动画调整顺序

首页 > 代码库 > 多个动画组合、动画调整顺序

多个动画组合、动画调整顺序

2024-07-17 03:44:57 218人阅读

animator 动画
动画的作用是让UI有动感，看上去时尚。

Android中动画分两种方式：

一种方式是补间动画Tween Animation，就是说你定义一个开始和结束，中间的部分由程序运算得到。
另一种叫逐帧动画Frame Animation，就是说一帧一帧的连起来播放就变成了动画。

动画可以实现的效果：
1. 移动(Translation)
2. 透明度(alpha)
3. 旋转（rotate）
4. 缩放 (scale)

现在分别用例子来讲解：以下的实现都是用代码实现的(ObjectAnimator)

1. 移动(Translation)

    主要代码[java]
AnimatorSet set = new AnimatorSet() ;
        ObjectAnimator anim = ObjectAnimator .ofFloat(phone, "translationX", -500f, 0f);
        anim.setDuration(2000);
        ObjectAnimator anim3 = ObjectAnimator .ofFloat(phone, "translationX", 0f, -500f);
        anim3.setDuration(2000);
        ObjectAnimator anim2 = ObjectAnimator .ofFloat(phone, "translationY", 0f, -500f);
        anim2.setDuration(2000);
        ObjectAnimator anim4 = ObjectAnimator .ofFloat(phone, "translationY", -500f, 0f);
        anim4.setDuration(2000);


        AnimatorSet set3 = new AnimatorSet();
        set3.play(anim4).before(anim3) ;
        AnimatorSet set2 = new AnimatorSet();
        set2.play(anim2).before(set3) ;
        set.play(anim).before(set2);
        set.start();

AnimatorSet set = new AnimatorSet() ;
  ObjectAnimator anim = ObjectAnimator .ofFloat(phone, "translationX", -500f, 0f);
  anim.setDuration(2000);
  ObjectAnimator anim3 = ObjectAnimator .ofFloat(phone, "translationX", 0f, -500f);
  anim3.setDuration(2000);
  ObjectAnimator anim2 = ObjectAnimator .ofFloat(phone, "translationY", 0f, -500f);
  anim2.setDuration(2000);
  ObjectAnimator anim4 = ObjectAnimator .ofFloat(phone, "translationY", -500f, 0f);
  anim4.setDuration(2000);


  AnimatorSet set3 = new AnimatorSet();
  set3.play(anim4).before(anim3) ;
  AnimatorSet set2 = new AnimatorSet();
  set2.play(anim2).before(set3) ;
  set.play(anim).before(set2);
  set.start();

讲解：anim 是从-500f 位置移动到当前位置（X轴）；
    anim3是从当前位置移动到-500f的位置（X轴）；
    anim2是从当前位置移动-500f的位置(Y轴)；
    anim 4是从-500f 位置移动到当前位置（Y轴）；

   [java]
AnimatorSet set3 = new AnimatorSet();
        set3.play(anim4).before(anim3) ;
        AnimatorSet set2 = new AnimatorSet();
        set2.play(anim2).before(set3) ;
        set.play(anim).before(set2);
        set.start();

AnimatorSet set3 = new AnimatorSet();
  set3.play(anim4).before(anim3) ;
  AnimatorSet set2 = new AnimatorSet();
  set2.play(anim2).before(set3) ;
  set.play(anim).before(set2);
  set.start();         这样做的目的是为了，让目标view移动一个来回，从哪里出发，最后回到出发的位置。

2. 透明度(alpha)

主要代码
[java]
AnimatorSet set = new AnimatorSet() ;
        ObjectAnimator anim = ObjectAnimator.ofFloat(phone, "alpha", 1f, 0f);
        anim.setDuration(2000);
        ObjectAnimator anim2 = ObjectAnimator.ofFloat(phone, "alpha", 0f, 1f);
        anim2.setDuration(2000);
        set.play(anim).before(anim2) ;
        set.start();

AnimatorSet set = new AnimatorSet() ;
  ObjectAnimator anim = ObjectAnimator.ofFloat(phone, "alpha", 1f, 0f);
  anim.setDuration(2000);
  ObjectAnimator anim2 = ObjectAnimator.ofFloat(phone, "alpha", 0f, 1f);
  anim2.setDuration(2000);
  set.play(anim).before(anim2) ;
  set.start();
讲解： anim 从可见到不可见；

anim 从不可见到可见；
3. 旋转（rotate）
主要代码

[java]
nimatorSet set = new AnimatorSet() ;
        ObjectAnimator anim = ObjectAnimator .ofFloat(phone, "rotationX", 0f, 180f);
        anim.setDuration(2000);
        ObjectAnimator anim2 = ObjectAnimator .ofFloat(phone, "rotationX", 180f, 0f);
        anim2.setDuration(2000);
        ObjectAnimator anim3 = ObjectAnimator .ofFloat(phone, "rotationY", 0f, 180f);
        anim3.setDuration(2000);
        ObjectAnimator anim4 = ObjectAnimator .ofFloat(phone, "rotationY", 180f, 0f);
        anim4.setDuration(2000);

        set.play(anim).before(anim2);
        set.play(anim3).before(anim4) ;
        set.start();

AnimatorSet set = new AnimatorSet() ;
  ObjectAnimator anim = ObjectAnimator .ofFloat(phone, "rotationX", 0f, 180f);
  anim.setDuration(2000);
  ObjectAnimator anim2 = ObjectAnimator .ofFloat(phone, "rotationX", 180f, 0f);
  anim2.setDuration(2000);
  ObjectAnimator anim3 = ObjectAnimator .ofFloat(phone, "rotationY", 0f, 180f);
  anim3.setDuration(2000);
  ObjectAnimator anim4 = ObjectAnimator .ofFloat(phone, "rotationY", 180f, 0f);
  anim4.setDuration(2000);

  set.play(anim).before(anim2);
  set.play(anim3).before(anim4) ;
  set.start();

讲解：anim 从0度转180度(X轴)

            anim2从180度转0度(X轴)
            anim3从0度转180度(Y轴)
            anim4从180度转0度(Y轴)

[java]
set.play(anim).before(anim2);
set.play(anim3).before(anim4) ;

set.play(anim).before(anim2);
set.play(anim3).before(anim4) ;这样写X和Y会同时旋转

4. 缩放 (scale)

主要代码

[java]
AnimatorSet set = new AnimatorSet() ;
        ObjectAnimator anim = ObjectAnimator .ofFloat(phone, "scaleX", 1f);
        anim.setDuration(1000);
        ObjectAnimator anim2 = ObjectAnimator .ofFloat(phone, "scaleX", 0.5f);
        anim2.setDuration(1000);
        ObjectAnimator anim3 = ObjectAnimator .ofFloat(phone, "scaleY", 1f);
        anim3.setDuration(1000);
        ObjectAnimator anim4 = ObjectAnimator .ofFloat(phone, "scaleY", 0.5f);
        anim4.setDuration(1000);

        ObjectAnimator anim5 = ObjectAnimator .ofFloat(phone, "scaleX", 0.5f);
        anim5.setDuration(1000);
        ObjectAnimator anim6 = ObjectAnimator .ofFloat(phone, "scaleX", 1f);
        anim6.setDuration(1000);
        ObjectAnimator anim7 = ObjectAnimator .ofFloat(phone, "scaleY",0.5f);
        anim7.setDuration(1000);
        ObjectAnimator anim8 = ObjectAnimator .ofFloat(phone, "scaleY", 1f);
        anim8.setDuration(1000);

        AnimatorSet set3 = new AnimatorSet() ;
        set3.play(anim5).before(anim6);
        AnimatorSet set2 = new AnimatorSet() ;
        set2.play(anim2).before(set3) ;


        AnimatorSet set4 = new AnimatorSet() ;
        set4.play(anim7).before(anim8) ;
        AnimatorSet set5 = new AnimatorSet() ;
        set5.play(anim4).before(set4);

        set.play(anim).before(set2);
        set.play(anim3).before(set5) ;
        set.start();

AnimatorSet set = new AnimatorSet() ;
  ObjectAnimator anim = ObjectAnimator .ofFloat(phone, "scaleX", 1f);
  anim.setDuration(1000);
  ObjectAnimator anim2 = ObjectAnimator .ofFloat(phone, "scaleX", 0.5f);
  anim2.setDuration(1000);
  ObjectAnimator anim3 = ObjectAnimator .ofFloat(phone, "scaleY", 1f);
  anim3.setDuration(1000);
  ObjectAnimator anim4 = ObjectAnimator .ofFloat(phone, "scaleY", 0.5f);
  anim4.setDuration(1000);

  ObjectAnimator anim5 = ObjectAnimator .ofFloat(phone, "scaleX", 0.5f);
  anim5.setDuration(1000);
  ObjectAnimator anim6 = ObjectAnimator .ofFloat(phone, "scaleX", 1f);
  anim6.setDuration(1000);
  ObjectAnimator anim7 = ObjectAnimator .ofFloat(phone, "scaleY",0.5f);
  anim7.setDuration(1000);
  ObjectAnimator anim8 = ObjectAnimator .ofFloat(phone, "scaleY", 1f);
  anim8.setDuration(1000);

  AnimatorSet set3 = new AnimatorSet() ;
  set3.play(anim5).before(anim6);
  AnimatorSet set2 = new AnimatorSet() ;
  set2.play(anim2).before(set3) ;


  AnimatorSet set4 = new AnimatorSet() ;
  set4.play(anim7).before(anim8) ;
  AnimatorSet set5 = new AnimatorSet() ;
  set5.play(anim4).before(set4);

  set.play(anim).before(set2);
  set.play(anim3).before(set5) ;
  set.start();

讲解：anim 从原来大小开始(X轴)

anim2 缩放到原来的1/2(X轴)
anim3从原来大小开始(Y轴)

anim4 缩放到原来的1/2(Y轴)

anim5从原来的1/2开始放大(X轴)

anim6放大到原来的大小(X轴)

anim7从原来的1/2开始放大(Y轴)

anim8放大到原来的大小(Y轴)

声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉：投诉/举报工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。

联系
我们

首页 > 代码库 > 多个动画组合、动画调整顺序

多个动画组合、动画调整顺序

看完仍有疑问？有类似问题直接问程序猿