在安卓中使用Animation类实现基础动画效果

最新推荐文章于 2024-09-07 14:54:28 发布

女儿控伪全栈老徐

最新推荐文章于 2024-09-07 14:54:28 发布

阅读量1.4k

点赞数 1

分类专栏： Android 文章标签： android 动画 Animation 移动变化

本文链接：https://blog.csdn.net/freezingxu/article/details/70888766

版权

Android 专栏收录该内容

32 篇文章 1 订阅

订阅专栏

Animation类是安卓所提供的实现基础动画效果的类，一共有四种不同的效果：半透明渐变、旋转、缩放和移动。可以说所有的复杂动画都可以由这几种基本效果组合而成。而实现这四种效果也非常简单。

先来看例子，以下是界面。这个界面上有一张图片，这张图片就是用来展示动画效果用的。图片下方有几个按钮，点击可以展示不同的动画效果：

构成界面的代码如下，一个ImageView和四个Button组件，没有任何复杂的地方：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.freezzingxu.animationstest.activities.MainActivity">

    <ImageView
        android:id="@+id/IMAGE_VIEW_ANIMATION"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginTop="8dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/animation"
        android:layout_marginBottom="8dp"
        app:layout_constraintBottom_toTopOf="@+id/BUTTON_ALPHA"
        app:layout_constraintVertical_bias="0.0"
        android:layout_marginStart="8dp"
        android:layout_marginEnd="8dp" />

    <Button
        android:id="@+id/BUTTON_ALPHA"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:text="@string/button_alpha"
        app:layout_constraintBottom_toTopOf="@+id/BUTTON_ROTATE"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_marginStart="8dp"
        android:layout_marginEnd="8dp"
        android:onClick="playAnimation"/>

    <Button
        android:id="@+id/BUTTON_ROTATE"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:text="@string/button_rotate"
        app:layout_constraintBottom_toTopOf="@+id/BUTTON_SCALE"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_marginStart="8dp"
        android:layout_marginEnd="8dp"
        android:onClick="playAnimation"/>

    <Button
        android:id="@+id/BUTTON_SCALE"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:text="@string/button_scale"
        app:layout_constraintBottom_toTopOf="@+id/BUTTON_TRANSLATE"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_marginStart="8dp"
        android:layout_marginEnd="8dp"
        android:onClick="playAnimation"/>

    <Button
        android:id="@+id/BUTTON_TRANSLATE"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:text="@string/button_translate"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_marginStart="8dp"
        android:layout_marginEnd="8dp"
        android:onClick="playAnimation"/>

</android.support.constraint.ConstraintLayout>

然后再来看Java 源代码

1.实现了透明半效果渐变效果的方法：

/**
 * 执行半透明效果
 * @param view
 */
public void executeAlpha(View view){

    /*
     *  创建一个半透明效果的动画对象，效果从完全透明到完全不透明
     */
    AlphaAnimation alphaAnimation = new AlphaAnimation(0,1);

    /*
     *  设置动画的持续时间
     */
    alphaAnimation.setDuration(3000);

    /*
     *  为界面对象启动动画效果
     */
    view.startAnimation(alphaAnimation);
}

2.实现了旋转效果的方法：

/**
 * 执行旋转效果
 * @param view
 */
public void executeRotate(View view){
    /*
     *  创建一个旋转动画对象
     *  入参列表含义如下：
     *  1.fromDegrees：从哪个角度开始旋转
     *  2.toDegrees：旋转到哪个角度结束
     *  3.pivotXType：旋转所围绕的圆心的x轴坐标的类型，有ABSOLUT绝对坐标、RELATIVE_TO_SELF相对于自身坐标、RELATIVE_TO_PARENT相对于父控件的坐标
     *  4.pivotXValue：旋转所围绕的圆心的x轴坐标,0.5f表明是以自身这个控件的一半长度为x轴
     *  5.pivotYType：y轴坐标的类型
     *  6.pivotYValue：y轴坐标
     */
    RotateAnimation rotateAnimation = new RotateAnimation(0,360, Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
    /*
     *  设置动画的持续时间
     */
    rotateAnimation.setDuration(3000);
    /*
     *  为界面对象启动动画效果
     */
    view.startAnimation(rotateAnimation);
}

3.实现了缩放效果的方法：

/**
 * 执行缩放效果
 * @param view
 */
public void executeScale(View view){
    /*
     *  创建一个缩放效果的动画
     *  入参列表含义如下：
     *  fromX：x轴的初始值
     *  toX：x轴缩放后的值
     *  fromY：y轴的初始值
     *  toY：y轴缩放后的值
     *  pivotXType：x轴坐标的类型，有ABSOLUT绝对坐标、RELATIVE_TO_SELF相对于自身坐标、RELATIVE_TO_PARENT相对于父控件的坐标
     *  pivotXValue：x轴的值，0.5f表明是以自身这个控件的一半长度为x轴
     *  pivotYType：y轴坐标的类型
     *  pivotYValue：轴的值，0.5f表明是以自身这个控件的一半长度为y轴
     */
    ScaleAnimation scaleAnimation = new ScaleAnimation(0,0.1f,0,0.1f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);

    /*
     *  设置动画的持续时间
     */
    scaleAnimation.setDuration(3000);

    /*
     *  为界面对象启动动画效果
     */
    view.startAnimation(scaleAnimation);
}

4.实现了移动效果的方法：

/**
 * 播放移动效果的动画
 * @param view
 */
public void executeTranslate(View view){
    /*
     *  创建一个移动动画效果
     *  入参的含义如下：
     *  fromXType：移动前的x轴坐标的类型
     *  fromXValue：移动前的x轴的坐标
     *  toXType：移动后的x轴的坐标的类型
     *  toXValue：移动后的x轴的坐标
     *  fromYType：移动前的y轴的坐标的类型
     *  fromYValue：移动前的y轴的坐标
     *  toYType：移动后的y轴的坐标的类型
     *  toYValue：移动后的y轴的坐标
     */
    TranslateAnimation translateAnimation = new TranslateAnimation(Animation.RELATIVE_TO_SELF,0,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0,Animation.RELATIVE_TO_SELF,0.5f);

    /*
     *  设置动画的持续时间
     */
    translateAnimation.setDuration(3000);

    /*
     *  为界面对象启动动画效果
     */
    view.startAnimation(translateAnimation);
}

可以看到四种基本动画效果实现起来套路是一样的。

值得注意的是，除了上述代码片段中出现的用于设置动画持续时间的setDuration()方法外，Animation类还有以下一些常用方法：

１、setDuration(long durationMills)
设置动画持续时间（单位：毫秒）

２、setFillAfter(Boolean fillAfter)
如果fillAfter的值为true,则动画执行后，控件将停留在执行结束的状态

３、setFillBefore(Boolean fillBefore)
如果fillBefore的值为true，则动画执行后，控件将回到动画执行之前的状态

４、setStartOffSet(long startOffSet)
设置动画执行之前的等待时间

５、setRepeatCount(int repeatCount)
设置动画重复执行的次数

实现了四种基本的动画效果，再来就是写一个方法，根据不同的按钮来调用不同的效果就可以了：

public void playAnimation(View view){
    ImageView animationImage = (ImageView)this.findViewById(R.id.IMAGE_VIEW_ANIMATION);
    switch(view.getId()){
        case R.id.BUTTON_ALPHA:
            /*
             *  播放透明效果动画
             */
            this.executeAlpha(animationImage);
            break;

        case R.id.BUTTON_ROTATE:
            /*
             *  播放旋转效果动画
             */
            this.executeRotate(animationImage);
            break;

        case R.id.BUTTON_SCALE:
            /*
             *  播放缩放效果动画
             */
            this.executeScale(animationImage);
            break;

        case R.id.BUTTON_TRANSLATE:
            /*
             *  播放移动效果动画
             */
            this.executeTranslate(animationImage);
            break;

        default:
            /*
             *  默认播放透明效果动画
             */
            this.executeAlpha(animationImage);
            break;
    }
}