欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

android动画使用介绍(视图动画)

程序员文章站 2022-03-01 21:04:51
...

1.android 视图动画介绍

Android系统提供了view的简单的动画效果,试图动画效果分为view的平移动画、缩放动画、旋转动画、透明动画。

2.视图动画的分类和使用

视图动画分为四类:

  1. 平移动画(TranslateAnimation)
  2. 旋转动画(RotateAnimation)
  3. 缩放动画(ScaleAnimation)
  4. 透明度动画(AlphaAnimation)
  5. 动画集合(AnimationSet)

四种动画都继承自Animation
所以都拥有Animation父类的方法和属性,比如设置动画的时长,动画执行的次数、动画重复次的模式等,四种动画都可以通过XML文件来实现,也可以通过Java代码来实现,

共同属性如下表所示:

XML节点 Java代码方法 介绍
android:duration setDuration() 设置动画执行持续的时间
android:ShareInterpolator setInterpolator() 设置动画的插值器,可以理解我动画执行的模式,比如匀速,先加速后减速等
android:fillAfter setFillAfter(boolean) 设置动画执行完成之后是否保持执行完的状态
android:fillBefore setFillBefore(boolean) 设置动画执行完成之后是否保持执行前的状态
android:repeatMode setRepeatMode(int) 设置动画重复播放的模式,reverse表示倒叙播放,restart表示正序播放
android:repeatCount setRepeatCount(int) 设置动画执行次数
2.1 平移动画

平移动画可以用XML方式实现和Java代码方式去实现

2.1.1 Xml方式实现动画
Xml节点属相 相关介绍
android:fromXDelta 起始点X轴坐标@(解释1)
android:fromYDelta 起始点Y轴从标,同上
android:toXDelta 结束点Y轴从标,同上
android:toYDelta 结束点Y轴从标,同上

@(解释1):
(数值、百分数、百分数p,譬如50表示以当前View左上角坐标加50px为初始点、50%表示以当前View的左上角加上当前View宽高的50%做为初始点、50%p表示以当前View的左上角加上父控件宽高的50%做为初始点)

Xml文件res/anim新建xml文件

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXDelta="0"
    android:toXDelta="200"
    android:fromYDelta="0"
    android:toYDelta="200"
    android:duration="2000"
    android:fillAfter="false"
    android:repeatMode="restart"
    android:repeatCount="3"
    >
</translate>

Java文件中加载Xml文件并启动动画,设置监听方法

	 TextView my_tv=findViewById(R.id.myview);
	 //加载动画资源
        TranslateAnimation translateAnimation= (TranslateAnimation) AnimationUtils.loadAnimation(this,R.anim.translate_demo);
        //textView设置动画
        my_tv.startAnimation(translateAnimation);
        //动画设置监听
        translateAnimation.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
                Log.e("TAG","动画开始执行...");
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                Log.e("TAG","动画完成执行...");
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
                Log.e("TAG","动画重复执行...");
            }
        });

动画监听方法log打印

2019-07-23 21:09:47.572 8053-8053/com.example.bitmap.animation E/TAG: 动画开始执行...
2019-07-23 21:09:49.532 8053-8053/com.example.bitmap.animation E/TAG: 动画重复执行...
2019-07-23 21:09:51.554 8053-8053/com.example.bitmap.animation E/TAG: 动画重复执行...
2019-07-23 21:09:53.577 8053-8053/com.example.bitmap.animation E/TAG: 动画重复执行...
2019-07-23 21:09:55.603 8053-8053/com.example.bitmap.animation E/TAG: 动画完成执行...
2.1.2 Java方式实现动画
 TextView my_tv=findViewById(R.id.my_tv);
        TranslateAnimation translateAnimation= new TranslateAnimation(0,200,0,200);
        //设置动画时长
        translateAnimation.setDuration(2000);
        //保存动画执行完成之后状态
        translateAnimation.setFillAfter(false);
        //设置动画重复执行模式
        translateAnimation.setRepeatMode(Animation.REVERSE);
        //重复执行次数
        translateAnimation.setRepeatCount(5);
        //设置插值器,动画执行速度减速
        translateAnimation.setInterpolator(new DecelerateInterpolator());
        //textView设置动画
        my_tv.startAnimation(translateAnimation);
      //监听类似平移动画
2.2 缩放动画
2.2.1 Xml方式实现动画
Xml节点属相 相关介绍
android:fromXScale 起始X上缩放值
android:toXScale 结束时Y轴上缩放值,同上
android:fromYScale 开始点Y轴缩放值,同上
android:toYScale 结束Y轴缩放值,同上
android:pivotX X轴上缩放坐标(以哪一点作为缩放中心)@(解释1)
android:pivotY Y轴缩放坐标 (同上)

Xml代码:

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="1"
    android:toXScale="3"
    android:fromYScale="1"
    android:toYScale="3"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="4000"
    android:fillAfter="false"
    android:repeatMode="restart"
    android:repeatCount="3"
    >
</scale>

Java中加载Xml代码并执行动画和设置监听

  TextView my_tv=findViewById(R.id.my_tv);
        ScaleAnimation scaleAnimation= (ScaleAnimation) AnimationUtils.loadAnimation(this,R.anim.scale_demo);
        my_tv.startAnimation(scaleAnimation);
          //监听类似平移动画
2.2.1 Java方式实现动画
   ScaleAnimation scaleAnimation=new ScaleAnimation(1,3,1,3,100,50);
        //设置动画时长
        scaleAnimation.setDuration(2000);
        //保存动画执行完成之后状态
        scaleAnimation.setFillAfter(false);
        //设置动画重复执行模式
        scaleAnimation.setRepeatMode(Animation.REVERSE);
        //重复执行次数
        scaleAnimation.setRepeatCount(5);
        //设置插值器,动画执行速度减速
        scaleAnimation.setInterpolator(new DecelerateInterpolator());
        my_tv.startAnimation(scaleAnimation);
         //监听类似平移动画
2.3旋转动画
Xml节点属相 相关介绍
android:fromDegrees 动画开始旋转时的角度,正数代表顺时针,负数代表逆时针
android:toDegrees 动画结束旋转时的角度,正数代表顺时针,负数代表逆时针
android:pivotX X轴上旋转坐标(以哪一点作为缩放中心)@(解释1)
android:pivotY 结束Y轴旋转值,同上
2.3.1Xml方式设置动画

Xml代码

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="90"
    android:toDegrees="-360"
    android:pivotY="50%"
    android:pivotX="50%"
    android:duration="4000"
    android:fillAfter="false"
    android:repeatMode="restart"
    android:repeatCount="10"
    >
</rotate>

Java代码

RotateAnimation rotateAnimation= (RotateAnimation) AnimationUtils.loadAnimation(this,R.anim.rotate_demo);
        my_tv.startAnimation(rotateAnimation);
        //监听类似平移动画
2.3.2Java方式设置动画

        RotateAnimation rotateAnimation= new RotateAnimation(90,-360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
        //设置动画时长
        rotateAnimation.setDuration(2000);
        //保存动画执行完成之后状态
        rotateAnimation.setFillAfter(false);
        //设置动画重复执行模式
        rotateAnimation.setRepeatMode(Animation.REVERSE);
        //重复执行次数
        rotateAnimation.setRepeatCount(5);
        //设置插值器
        rotateAnimation.setInterpolator(new BounceInterpolator());
        my_tv.startAnimation(rotateAnimation);
        //监听类似平移动画
2.4透明度动画
Xml节点属相 相关介绍
android:fromAlpha 动画开始时的透明度,最小值0.0表示全透明,最大值1.0表示完全不透明
android:toAlpha 动画结束时的透明度 同上
2.4.1Xml设置透明度动画
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="1.0"
    android:toAlpha="0.5"
    android:repeatCount="10"
    android:repeatMode="restart"
    android:duration="4000"
    android:fillAfter="false"
    >
</alpha>

Java中加载Xml代码同之前的平移动画、缩放动画、旋转动画类似

2.4.2 Java设置透明度动画
    AlphaAnimation alphaAnimation=new AlphaAnimation(1.0f,0.5f);
        //设置动画时长
        alphaAnimation.setDuration(2000);
        //保存动画执行完成之后状态
        alphaAnimation.setFillAfter(false);
        //设置动画重复执行模式
        alphaAnimation.setRepeatMode(Animation.REVERSE);
        //重复执行次数
        alphaAnimation.setRepeatCount(5);
        //设置插值器
        alphaAnimation.setInterpolator(new BounceInterpolator());
        my_tv.startAnimation(alphaAnimation);
          //监听类似平移动画
2.5集合动画(AnimationSet)
2.5.1 Xml方式实现动画
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="4000"
    android:fillAfter="false"
    android:repeatMode="restart"
    android:repeatCount="10"
    >
    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0.2"
        />
    <rotate
        android:fromDegrees="0"
        android:toDegrees="180"
        android:pivotX="50%"
        android:pivotY="50%"
        />
</set>

Java代码加载资源文件

 AnimationSet animationSet = (AnimationSet) AnimationUtils.loadAnimation(this,R.anim.set_demo);

2.5.2 Java代码实现集合动画
  		AlphaAnimation alphaAnimation=new AlphaAnimation(1.0f,0.5f);
        RotateAnimation rotateAnimation=new RotateAnimation(0,180,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
        AnimationSet animationSet = new AnimationSet(false);
        animationSet.addAnimation(alphaAnimation);
        animationSet.addAnimation(rotateAnimation);
        animationSet.setDuration(2000);
        //保存动画执行完成之后状态
        animationSet.setFillAfter(false);
        //设置动画重复执行模式
        animationSet.setRepeatMode(Animation.REVERSE);
        //重复执行次数
        animationSet.setRepeatCount(5);
        //设置插值器
        animationSet.setInterpolator(new BounceInterpolator());
        my_tv.startAnimation(animationSet);

3.系统常用动画插值器介绍

插值器定义动画的变化规律,比如匀速变、加速变化、先加速后减速变化等等。系统为我们提供众多插值器。

Java类 Xml中配置 介绍
AccelerateDecelerateInterpolator @android:anim/accelerate_decelerate_interpolator 动画始末速率较慢,中间加速
AccelerateInterpolator @android:anim/accelerate_interpolator 动画开始速率较慢,之后慢慢加速
AnticipateInterpolator @android:anim/anticipate_interpolator 开始的时候从后向前甩
BounceInterpolator @android:anim/bounce_interpolator 动画结束时弹起
CycleInterpolator @android:anim/cycle_interpolator 循环播放速率改变为正弦曲线
DecelerateInterpolator @android:anim/decelerate_interpolator 动画开始快然后慢
LinearInterpolator @android:anim/linear_interpolator 动画匀速改变
OvershootInterpolator @android:anim/overshoot_interpolator 向前弹出一定值之后回到原来位置

自定义插值器需要继承BaseInterpolator,重写TimeInterpolator接口的getInterpolation(float input)方法,计算input值(0-1)具体参考系统提供的插值器。

参考资料:https://www.jianshu.com/p/16e0d4e92bb2

相关标签: 视图动画 动画