美文网首页
Android中动画的详细讲解及其使用

Android中动画的详细讲解及其使用

作者: 君袅 | 来源:发表于2019-04-03 21:57 被阅读0次

概述:

在Android动画中，总共有两种类型的动画View Animation(视图动画)和Property Animator(属性动画)；
其中 :
a.View Animation包括Tween Animation（补间动画）和Frame Animation(逐帧动画)；
b.Property Animator包括ValueAnimator和ObjectAnimation；
首先，直观上，他们有如下三点不同：
1、引入时间不同：View Animation是API Level 1就引入的。Property Animation是API Level 11引入的，即Android 3.0才开始有Property Animation相关的API。
2、所在包名不同：View Animation在包android.view.animation中。而Property Animation API在包 android.animation中。
3、动画类的命名不同：View Animation中动画类取名都叫XXXXAnimation,而在Property Animator中动画类的取名则叫XXXXAnimator

大家都知道逐帧动画主要是用来实现动画的，而补间动画才能实现控件的渐入渐出、移动、旋转和缩放的；而Property Animator是在Android 3.0版本才引入的，之前是没有的。大家可能会觉得补间动画和逐帧动画已经很全了，为什么还要引入Property Animator呢？

1、为什么引入Property Animator(属性动画)
我提出一个假设：请问大家，如何利用补间动画来将一个控件的背景色在一分钟内从绿色变为红色？这个效果想必没办法仅仅通过改变控件的渐入渐出、移动、旋转和缩放来实现吧，而这个效果是可以通过Property Animator完美实现的
这就是第一个原因：Property Animator能实现补间动画无法实现的功能
大家都知道，补间动画和逐帧动画统称为View Animation，也就是说这两个动画只能对派生自View的控件实例起作用；而Property Animator则不同，从名字中可以看出属性动画，应该是作用于控件属性的！正因为属性动画能够只针对控件的某一个属性来做动画，所以也就造就了他能单独改变控件的某一个属性的值！比如颜色！这就是Property Animator能实现补间动画无法实现的功能的最重要原因。
我们得到了第二点不同：View Animation仅能对指定的控件做动画，而Property Animator是通过改变控件某一属性值来做动画的。
假设我们将一个按钮从左上角利用补间动画将其移动到右下角，在移动过程中和移动后，这个按钮都是不会响应点击事件的。这是为什么呢？因为补间动画仅仅转变的是控件的显示位置而已，并没有改变控件本身的值。View Animation的动画实现是通过其Parent View实现的，在View被drawn时Parents View改变它的绘制参数，这样虽然View的大小或旋转角度等改变了，但View的实际属性没变，所以有效区域还是应用动画之前的区域；我们看到的效果仅仅是系统作用在按钮上的显示效果，利用动画把按钮从原来的位置移到了右下角，但按钮内部的任何值是没有变化的，所以按钮所捕捉的点击区域仍是原来的点击区域。（下面会举例来说明这个问题）
这就得到了第三点不同：补间动画虽能对控件做动画，但并没有改变控件内部的属性值。而Property Animator则是恰恰相反，Property Animator是通过改变控件内部的属性值来达到动画效果的

2、举例说明补间动画的点击区域问题

下面我们就利用TranslateAnimation来做一个移动动画的例子，看它的点击区域是否会变。
我们先来看看效果


image.png

在效果图中，首先，我给textview添加了点击响应，当点击textview时，会弹出Toast。
然后，当我点击按钮的时候，textview开始向右下角移动。
从结果中可以看出，在移动前，点击textview是可以弹出toast的的，在移动后，点击textview时则没有响应，相反，点击textview的原来所在区域则会弹出toast.

这就论证了不同第三点：补间动画虽能对控件做动画，但并没有改变控件内部的属性值

Android中常用的动画都在这里了，包含了基本的动画【透明度动画，缩放动画，旋转动画，位移动画】；还有就是这四种动画的组合实现； 还有布局动画，就是在加载布局时的动画；还有Activity跳转的动画。 效果图如下：


a.gif

1. Android基础动画

如果是xml的方式写要在res下创建anim文件夹内写

透明度动画

xml:

 <?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android">
     <alpha
         android:duration="1000"
         android:fromAlpha="0.0"
         android:toAlpha="1.0"
         />
 </set>

代码:

        AlphaAnimation animation = new AlphaAnimation(0, 1);
        animation.setDuration(3000);
        animation.setFillAfter(true);
        mImg.setAnimation(animation);

缩放动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:duration="1000"
        android:fromXScale="0"
        android:fromYScale="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1"
        android:toYScale="1" />
</set>

代码:

 /**
 * 第一个参数fromX为动画起始时 X坐标上的伸缩尺寸
 * 第二个参数toX为动画结束时 X坐标上的伸缩尺寸
 * 第三个参数fromY为动画起始时Y坐标上的伸缩尺寸
 * 第四个参数toY为动画结束时Y坐标上的伸缩尺寸
 * 说明: 0.0表示收缩到没有;1.0表示正常无伸缩;值小于1.0表示收缩;值大于1.
 * 第五个参数pivotXType为动画在X轴相对于物件位置类型
 * 第六个参数pivotXValue为动画相对于物件的X坐标的开始位置
 * 第七个参数pivotXType为动画在Y轴相对于物件位置类型
 * 第八个参数pivotYValue为动画相对于物件的Y坐标的开始位置
 */
    private void playAnimator(View view) {
        ObjectAnimator objectAnimatorX = ObjectAnimator.ofFloat(view, "scaleX", 1.0f, 1.3f, 0.9f, 1.15f, 0.95f, 1.02f, 1.0f);
        ObjectAnimator objectAnimatorY = ObjectAnimator.ofFloat(view, "scaleY", 1.0f, 1.3f, 0.9f, 1.15f, 0.95f, 1.02f, 1.0f);
        AnimatorSet animatorSet = new AnimatorSet();
        animatorSet.play(objectAnimatorX).with(objectAnimatorY);
        animatorSet.setDuration(1000);
        animatorSet.start();
    }
Animation animation = new ScaleAnimation(0, 1
animation.setDuration(1000);
iv.startAnimation(animation);

旋转动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:duration="1000"
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="360" />
</set>

代码:

    /**
     * 第一个参数fromDegrees为动画起始时角度
     * 第二个参数toDegrees为动画结束角度
     * 第三个参数pivotXType为动画在X轴相对于物件位置类型
     * 第四个参数pivotXValue为动画相对于物件的X坐标的开始位置
     * 第五个参数pivotXType为动画在Y轴相对于物件位置类型
     * 第六个参数pivotYValue为动画相对于物件的Y坐标的开始位置
     */
    Animation animation = new RotateAnima
    animation.setDuration(1000);
    iv.startAnimation(animation);

位移动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="2000"
        android:fromXDelta="0"
        android:fromYDelta="0"
        android:toXDelta="500"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toYDelta="0" />
</set>

代码:

    /**
     * 第一个参数fromDegrees为动画起始时角度
     * 第二个参数toDegrees为动画结束角度
     * 第三个参数pivotXType为动画在X轴相对于物件位置类型
     * 第四个参数pivotXValue为动画相对于物件的X坐标的开始位置
     * 第五个参数pivotXType为动画在Y轴相对于物件位置类型
     * 第六个参数pivotYValue为动画相对于物件的Y坐标的开始位置
     */
     Animation animation = new RotateAnima
     animation.setDuration(1000);
     iv.startAnimation(animation);
     /**
      * 第一个参数fromXDelta为动画起始时的x坐标
      * 第二个参数toXDelta为动画结束时的x坐标
      * 第三个参数fromYDelta为动画起始时的y坐标
      * 第四个参数toYDelta为动画结束时的y坐标
      */
      Animation animation = new Translat
      animation.setDuration(2000);
      /**设置插值器：先加速，后减速**/
      animation.setInterpolator(new Acce
      iv.startAnimation(animation);

2.组合动画

先播放缩放动画，完成后播放旋转动画

  Animation animation = AnimationUtils.loadAnimation(this, R.anim.scale);
               iv.startAnimation(animation);
               final Animation animation2 = AnimationUtils.loadAnimation(this, R.anim.rotate);
               animation.setAnimationListener(new Animation.AnimationListener() {
                   @Override
                   public void onAnimationStart(Animation animation) {

                   }

                   @Override
                   public void onAnimationEnd(Animation animation) {

                       iv.startAnimation(animation2);
                   }

                   @Override
                   public void onAnimationRepeat(Animation animation) {

                   }
               });

先播放旋转动画，完成后播放位移动画，在xml中设置第二个动画执行的等待时间

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <rotate
        android:duration="1000"
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="360" />
    <translate
        android:duration="1000"
        android:fromXDelta="0"
        android:fromYDelta="0"
        android:toXDelta="500"
        android:startOffset="1000"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toYDelta="0" />
</set>

重复的透明度动画-闪烁

AlphaAnimation alphaAnimation = new AlphaAnimation(0.1f, 1.0f);
                alphaAnimation.setDuration(1000);
                alphaAnimation.setRepeatCount(10);
                /**倒序重复REVERSE  正序重复RESTART**/
                alphaAnimation.setRepeatMode(Animation.REVERSE);
                iv.startAnimation(alphaAnimation);

重复的位移动画-抖动

 Animation translateAnimation = new TranslateAnimation(-10, 10, 0, 0);
                translateAnimation.setDuration(100);
                translateAnimation.setRepeatCount(10);
                /**倒序重复REVERSE  正序重复RESTART**/
                translateAnimation.setRepeatMode(Animation.REVERSE);
                iv.startAnimation(translateAnimation);

3.帧动画

在drawable文件夹下建立文件

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
 >
   <item android:drawable="@mipmap/windmill_1"
       android:duration="500">
   </item>
   <item android:drawable="@mipmap/windmill_2"
       android:duration="500">
   </item>
   <item android:drawable="@mipmap/windmill_3"
       android:duration="500">
   </item>
   <item android:drawable="@mipmap/windmill_4"
       android:duration="500">
   </item>
   <item android:drawable="@mipmap/windmill_5"
       android:duration="500">
   </item>
   <item android:drawable="@mipmap/windmill_6"
       android:duration="500">
   </item>
   <item android:drawable="@mipmap/windmill_7"
       android:duration="500">
   </item>

</animation-list>

在activity中调用

   iv.setImageResource(R.drawable.ring_animation);
               AnimationDrawable animationDrawable = (AnimationDrawable) iv.getDrawable();
               animationDrawable.start();

4.布局动画 这是一个ListView的加载布局动画

先建立动画文件,从透明到不透明并且大小从0到原大小

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator" >

    <scale
        android:duration="1000"
        android:fromXScale="0.1"
        android:fromYScale="0.1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1.0"
        android:toYScale="1.0" />
    <alpha
        android:duration="1000"
        android:fromAlpha="0"
        android:toAlpha="1.0" />
</set>

在activity中的用法

 ListView listView = (ListView) findViewById(R.id.listview);
        List<String> datas = new ArrayList<>();
        for (int i = 0; i < 18; i++) {
            datas.add("万能适配器测试" + i);
        }
        LayoutAnimationController layoutAnimationController= new        LayoutAnimationController(AnimationUtils.loadAnimation(this, R.anim.zoom_in));
        layoutAnimationController.setOrder(LayoutAnimationController.ORDER_NORMAL);
        listView.setLayoutAnimation(layoutAnimationController);
        listView.setAdapter(new CommonAdapter<String>(this, datas, R.layout.item) {

            @Override
            protected void convertView(View item, String s) {
                TextView textView = CommonViewHolder.get(item, R.id.textView);
                textView.setText(s);
            }
        });

5.Activity跳转动画

退出动画：从不透明到透明并且大小从原大小到0

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator"
    android:zAdjustment="top" >

    <scale
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%p"
        android:pivotY="50%p"
        android:toXScale="0.1"
        android:toYScale="0.1" />

    <alpha
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromAlpha="1.0"
        android:toAlpha="0" />

</set>

进入动画：从透明到不透明并且大小从0到原大小

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator" >

    <scale
        android:duration="1000"
        android:fromXScale="0.1"
        android:fromYScale="0.1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1.0"
        android:toYScale="1.0" />
    <alpha
        android:duration="1000"
        android:fromAlpha="0"
        android:toAlpha="1.0" />
</set>

在Activity中的用法

  startActivity(new Intent(this,SecondActivity.class));
                overridePendingTransition(R.anim.zoom_in,R.anim.zoom_out);

相关文章

网友评论

      本文标题：Android中动画的详细讲解及其使用

      本文链接：https://www.haomeiwen.com/subject/otbtiqtx.html

      延伸阅读

      深度阅读

      • 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

      栏目导航

      热点阅读

      关于我们|服务条款|联系我们|Android中动画的详细讲解及其使用|投稿指南|网站地图|RSS订阅|排版工具|手机版

      提供经典美文摘抄,优美散文欣赏,现代诗歌精选,短篇小说,心情随笔,表白情书范文,故事会在线阅读欣赏

      Copyright © 2014-2023 Haomeiwen.com All Rights Reserved. 好美文阅读网 版权所有

      备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

      本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

      所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！