Android 动画使用 -- 基础

最新推荐文章于 2023-03-10 20:40:13 发布
最新推荐文章于 2023-03-10 20:40:13 发布
阅读量534 收藏
点赞数
分类专栏： Android 文章标签： android 动画 Animation Animator
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/man_help/article/details/52080157
版权

Android 动画

Android 中提供了一系列简单的动画效果，比如旋转、缩放、淡入淡出、移动等，大多数控件都可以使用这些动画效果，实现比较绚丽的 UI 效果

Android 动画分类

Android 中的动画目前可以分为三大类：

  1. Tweened Animations (补间动画)：通过在两个关键帧之间补充渐变的动画效果来实现

  2. Frame-by-frame Animations (帧动画)：通过连续播放图片来模拟动画效果

  3. Property Animator (属性动画)：通过改变对象的属性来实现动画

下面分别介绍三种动画的基本使用方式，每种动画都有两种实现方法 —— 代码 和 XML文件

Tweened Animations

Tweened Animations 分类

总体上来说可以分为四类：

  • 移动动画 TranslateAnimation

  • 缩放动画 ScaleAnimation

  • 淡入淡出 AlphaAnimation

  • 旋转动画 RotateAnimation

Tweened Animations 代码方式实现

代码方式使用步骤：

  1. 创建一个 AnimationSet 动画集合对象（Animation 子类，可以添加多个动画效果）；

  2. 创建需要的 Animation 对象(上面的四个分类)；

  3. 根据需求，为 Animation 对象设置相应的执行参数(比如时间、重复方式等)；

  4. 将 Animation 对象添加到 AnimationSet 集合当中；

  5. 使用要操作的控件对象开始执行 AnimationSet。

这里顺带提一下：如果只是实现单一的动画效果，可以不使用 AnimationSet ，让控件直接执行相应的动画对象也能实现单一效果。

示例代码：

/**
 * 代码的方式创建 淡入淡出动画
 * @param view v
 */
public void startAlphaByCode(View view) {
    //1.创建一个 AnimationSet 对象(集合)，true 表示使用 AnimationSet 自带的插补器，false 表示使用自定义的插补器
    AnimationSet animationSet = new AnimationSet(true);
    /**
     * 2.创建 AlphaAnimation 对象
     * 参数1：起始透明度  1表示完全不透明，0表示完全透明
     * 参数2：截止透明度  1表示完全不透明，0表示完全透明
     * 此处效果：从完全不透明到完全透明渐变
     */
    AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
    //3.为 AlphaAnimation 设置参数，如动画渐变的过程为3秒
    alphaAnimation.setDuration(3000);
    //4.把 AlphaAnimation 添加到 AnimationSet 中
    animationSet.addAnimation(alphaAnimation);
    //5.给定控件开始执行 AnimationSet
    imageView.startAnimation(animationSet);
}

其他的动画效果之后会在代码中给出，注释也比较详细，这里就不一一举例了

Tweened Animations 的 xml 方式实现

XML 方式使用步骤：

  1. 在 res 文件夹下面新建一个名为 anim 的文件夹

  2. 在 anim 文件夹下新建 xml 文件，根标签设为 set （动画集合）

  3. 在 set 标签中添加子标签 (可为 rotate、scale、alpha、translate)

  4. 在代码中使用 AnimationUtils 加载 xml 文件，并生成 Animation 对象

  5. 使用控件对象开始执行 Animation

同样顺带说明：如果只是实现单一的动画效果可以不使用 set 标签，但是别忘了添加命名空间

示例：

首先 在 anim 下创建 alpha.xml 

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--
        android:fromAlpha   起始透明度 0.0 表示完全透明 1.0 表示完全不透明
        android:toAlpha     终止透明度
    -->

    <alpha
        android:fromAlpha="0.2"
        android:toAlpha="1.0"
        android:duration="3000"/>
</set>

然后 在代码中配合使用

/**
 * XML的方式创建 淡入淡出动画
 * @param view v
 */
public void startAlphaByXML(View view) {
    // 1. 在res文件夹下面新建一个名为 anim 的文件夹
    // 2. 在 anim 文件夹下新建 xml 文件，根标签设为 set （相当于 AnimationSet）
    // 3. 在 set 标签中添加子标签 alpha
    // 4. 在代码中使用 AnimationUtils 加载 xml 文件，并生成 Animation 对象
    Animation alpha = AnimationUtils.loadAnimation(this, R.anim.alpha);
    // 5. 使用控件对象开始执行 Animation
    imageView.startAnimation(alpha);
}

其他的动画效果之后会在代码中给出，注释也比较详细，这里就不一一举例了

Frame-by-frame Animations

先介绍帧动画的 XML 方式的使用，这种方式比较常用

Frame-by-frame Animations 的 xml 方式实现

XML 方式使用步骤：

  1. 在 drawable 文件夹下创建一个资源文件, 如 frame.xml

  2. 根标签设置为 animation-list

  3. 添加 item 子标签 子标签设置要轮播的图片和时长

  4. 在代码中根据资源文件获得 AnimationDrawable 实例

  5. 把 AnimationDrawable 设置为要操作的控件的背景

  6. 调用 AnimationDrawable 的 start 方法开始动画

扩展：上面第 4 步 和 第 5 步，也可以替换成以下方式

  • 4.为要操作的控件设置 资源文件 为背景

  • 5.获取背景作为 AnimationDrawable 实例

示例：

创建资源文件 frame.xml 

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

    <!--添加要轮播的图片-->
    <item android:drawable="@drawable/h1" android:duration="100"/>
    <item android:drawable="@drawable/h2" android:duration="100"/>

</animation-list>

在代码中使用 (ivFrameXml 是要操作的控件)

/*
// 方式一
// 为 ImageView 设置 资源文件 背景
ivFrameXml.setBackgroundResource(R.drawable.frame);
// 获取背景作为 AnimationDrawable 对象
animationDrawableXml = (AnimationDrawable) ivFrameXml.getBackground();
*/

// 方式二
// 通过逐帧动画的资源文件获得 AnimationDrawable 实例
animationDrawableXml = (AnimationDrawable) getResources().getDrawable(R.drawable.frame);
// 把 AnimationDrawable 设置为 ImageView 的背景
ivFrameXml.setBackgroundDrawable(animationDrawableXml);

//开始动画
animationDrawableXml.start();

Frame-by-frame Animations 代码方式实现

代码方式使用步骤：

  1. 创建 AnimationDrawable 实例

  2. 为 AnimationDrawable 添加动画帧

  3. 为 AnimationDrawable 设置执行参数(如是否执行一次，默认是执行一次)

  4. 把 AnimationDrawable 设置为 要操作的控件 的背景

  5. 调用 AnimationDrawable 的 start 方法开始动画

示例：

//要操作的对象  
ivFrameCode = (ImageView) findViewById(R.id.iv_frame_code);

// 创建 AnimationDrawable 实例
animationDrawableCode = new AnimationDrawable();
// 添加动画帧
animationDrawableCode.addFrame(getResources().getDrawable(R.drawable.h1),100);
animationDrawableCode.addFrame(getResources().getDrawable(R.drawable.h2),100);
// false 重复    true 执行一次
animationDrawableCode.setOneShot(false);//重复执行
// 把 AnimationDrawable 设置为 ImageView 的背景
ivFrameCode.setBackgroundDrawable(animationDrawableCode);

//开始动画
animationDrawableCode.start();

Property Animator

Property Animator 是 3.0 之后新增的动画，它通过改变控件属性的方式实现动画效果，这里的属性指的是可以通过控件的 set 和 get 方式设置的属性。Animator 不同于 Animation ，Animator 是真正改变控件的属性。

Property Animator 可以分为 ObjectAnimator 和 ValueAnimator ，这里只介绍 ObjectAnimator 的使用， ValueAnimator 请自行搜索…（Orz）

Property Animator 代码实现方式

代码实现步骤：

  1. 创建 ObjectAnimator 对象，指定要作用的对象和动画效果

  2. 为 ObjectAnimator 设置执行参数

  3. 调用 ObjectAnimator 的 start 方法开始动画

补充：如果要同时实现多个动画效果 那么要使用 AnimatorSet ，把动画效果添加到 AnimatorSet 集合中，使用 AnimatorSet 开始动画，使用方法参考之后给出的代码。

示例：

/**
 * 代码的方式 淡入淡出
 * @param view v
 */
public void startAlphaByCode(View view) {
    //设置淡入效果从 0.2 的透明度，到完全不透明
    ObjectAnimator animator = ObjectAnimator.ofFloat(imageView,"alpha",0.2f,1);
    //设置动画时长
    animator.setDuration(2000);
    //开始动画
    animator.start();
}

Property Animator (属性动画) 没有像 Tweened Animation 那样很明确的分成四大类，但是同样能实现 平移、淡入淡出、旋转、缩放效果，实现这些效果靠的是修改属性值

示例中有个方法很重要 ofFloat ，实际上 ObjectAnimator 提供了 提供了 ofInt、ofFloat、ofObject 三个方法，这些方法都是设置动画作用的对象、作用的属性、动画开始、结束、以及中间的任意个属性值，拿 ofFloat 来说明：

方法 ofFloat(arg1, arg2, …) 是一个变长参数的方法

参数1：要操作的对象

参数2：要操作的属性(一个 ObjectAnimator 只能操作一个属性)

  • 淡入淡出
    • alpha
  • 旋转
    • rotation 围绕中心旋转
    • rotationX 围绕 X 轴中心旋转
    • rotationY 围绕 Y 轴中心旋转
  • 缩放
    • scaleX X 轴方向缩放
    • scaleY Y 轴方向缩放
  • 平移
    • translationX X 轴方向平移
    • translationY Y 轴方向平移

可变参数：如果只设置一个值，表示开始值 ； 如果设置两个值，第一个表示开始值，第二个表示结束值；如果设置两个以上，第一个表示开始值 最后一个表示结束值，中间的表示过渡值。如：

//淡入效果 ： 从 原图的 0.2 的透明度 --> 0.8 的透明度 --> 0.5 的透明度 --> 完全不透明
ObjectAnimator.ofFloat(imageView, "alpha", 0.2f, 0.8f, 0.5f, 1);

Property Animator 的 xml 实现方式

xml 方式使用步骤：

  1. 在 res 文件夹下创建 animator 文件夹
  2. 在 animator 文件夹下创建资源文件 如 alpha.xml 设置动画效果
  3. 在代码中使用 AnimatorInflater 的 loadAnimator 方法加载资源文件，生成 Animator 实例
  4. 使用 Animator 的 setTarget 方法设置要操作的对象
  5. 使用 Animator 的 start 方法 开始动画

补充：如果要设置多个动画效果，那么根标签设置为 set ，在 set 中添加各动画效果的子标签,使用方法参考之后给出的代码。

示例：

创建资源文件 alpha.xml 

<?xml version="1.0" encoding="utf-8"?>

<objectAnimator
    xmlns:android="http://schemas.android.com/apk/res/android"
    //属性
    android:propertyName="alpha"
    android:valueFrom="1.0"
    android:valueTo="0.2"
    android:valueType="floatType"
    android:duration="2000"/>

在代码中使用

//加载资源文件生成 Animator 对象
Animator animator = AnimatorInflater.loadAnimator(this, R.animator.alpha);
//设置要作用的对象
animator.setTarget(imageView);
//开始执行动画
animator.start();

效果图

Tweened Animations (补间动画)：

补间动画

Frame-by-frame Animations (帧动画)：

帧动画

Property Animator (属性动画)：

属性动画

代码

项目文件结构

项目文件结构

主要代码

如果嫌弃代码太长，阅读不便，那就跳到最后可以下载

  • Tweened Animations (补间动画)

布局文件 activity_tweened_animations.xml ：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
        <ImageView
            android:id="@+id/iv_chry"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/an_chry"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
        <Button
            android:id="@+id/rotate_code"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="旋转 CODE"
            android:onClick="startRotateByCode"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/rotate_code"
            android:text="旋转 XML"
            android:onClick="startRotateByXML"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
        <Button
            android:id="@+id/scale_code"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="缩放 CODE"
            android:onClick="startScaleByCode"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/scale_code"
            android:text="缩放 XML"
            android:onClick="startScaleByXML"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
        <Button
            android:id="@+id/translate_code"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="移动 CODE"
            android:onClick="startTranslateByCode"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/translate_code"
            android:text="移动 XML"
            android:onClick="startTranslateByXML"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
        <Button
            android:id="@+id/alpha_code"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="淡入淡出 CODE"
            android:onClick="startAlphaByCode"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/alpha_code"
            android:text="淡入淡出 XML"
            android:onClick="startAlphaByXML"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
        <Button
            android:id="@+id/animation_set_code"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="动画集合 CODE"
            android:onClick="startAnimationSetByCode"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/animation_set_code"
            android:text="动画集合 XML"
            android:onClick="startAnimationSetByXML"/>
    </RelativeLayout>

</LinearLayout>

布局实现 TweenedAnimationsActivity.java ：

package com.yu.animationdemo;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.AnimationUtils;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;

/**
 * 补间动画 TweenedAnimations
 * Created by yu on 2016/7/12.
 *
 * 代码的方式使用 TweenedAnimations 的步骤：
 *  1.创建一个 AnimationSet 对象（Animation 子类）；
 *  2.增加需要创建相应的 Animation 对象；
 *  3.更加项目的需求，为 Animation 对象设置相应的数据；
 *  4.将 Animation 对象添加到 AnimationSet 对象当中；
 *  5.使用控件对象开始执行 AnimationSet。
 *
 * XML的方式使用 TweenedAnimations 的步骤：
 *  1. 在res文件夹下面新建一个名为 anim 的文件夹
 *  2. 在 anim 文件夹下新建 xml 文件，根标签设为 set （相当于 AnimationSet）
 *  3. 在 set 标签中添加子标签 (可为 rotate、scale、alpha、translate)
 *  4. 在代码中使用 AnimationUtils 加载 xml 文件，并生成 Animation 对象
 *  5. 使用控件对象开始执行 Animation
 *
 *  注：例子中的 Animation.RELATIVE_TO_SELF 相对自身 和 Animation.RELATIVE_TO_PARENT 相对父控件
 *  相对的概念是指 相对于控件自身的坐标原点或者相对于父控件的坐标原点来说的 默认都是左上角
 *  但如果父控件设置了 android:gravity="center" 那么父控件的坐标原点就变为父控件的中心了
 */
public class TweenedAnimationsActivity extends AppCompatActivity {

    private ImageView imageView;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_tweened_animations);
        imageView = (ImageView) findViewById(R.id.iv_chry);
    }

    /**
     * 代码的方式创建 移动动画
     * @param view v
     */
    public void startTranslateByCode(View view) {
        //1.创建一个 AnimationSet 对象(集合)，true 表示使用 AnimationSet 自带的插补器，false 表示使用自定义的插补器
        AnimationSet animationSet = new AnimationSet(true);
        /**
         * 2.创建 TranslateAnimation 对象
         * 8个参数，参数1、2确定X起点；参数3、4确定X终点；参数5、6确定Y起点；参数7、8确定Y终点
         *
         * 参数1：描述x轴起始坐标的类型  Animation.ABSOLUTE绝对坐标； Animation.RELATIVE_TO_SELF相对自身； Animation.RELATIVE_TO_PARENT.相对父控件
         * 参数2：x起始坐标：如果参数1是 Animation.ABSOLUTE，那么这里可以填绝对数值，0表示左边界；否则可以是一个相对于自身或父控件的百分比（1.0 表示 100%）
         * 参数3：描述x轴结束坐标的类型  Animation.ABSOLUTE绝对坐标； Animation.RELATIVE_TO_SELF相对自身； Animation.RELATIVE_TO_PARENT.相对父控件
         * 参数4：x结束坐标：如果参数3是 Animation.ABSOLUTE，那么这里可以填绝对数值，0表示左边界；否则可以是一个相对于自身或父控件的百分比（1.0 表示 100%）
         *
         * 参数5：描述y轴起始坐标的类型  Animation.ABSOLUTE绝对坐标； Animation.RELATIVE_TO_SELF相对自身； Animation.RELATIVE_TO_PARENT.相对父控件
         * 参数6：y起始坐标：如果参数5是 Animation.ABSOLUTE，那么这里可以填绝对数值，0表示左边界；否则可以是一个相对于自身或父控件的百分比（1.0 表示 100%）
         * 参数7：描述y轴终止坐标的类型  Animation.ABSOLUTE绝对坐标； Animation.RELATIVE_TO_SELF相对自身； Animation.RELATIVE_TO_PARENT.相对父控件
         * 参数8：y终止坐标：如果参数7是 Animation.ABSOLUTE，那么这里可以填绝对数值，0表示左边界；否则可以是一个相对于自身或父控件的百分比（1.0 表示 100%）
         *
         * 此处效果：以父控件左上角移动到右下角
         */
        TranslateAnimation translateAnimation = new TranslateAnimation(
                Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,1,
                Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,1);
        //3.为 translateAnimation 设置参数，如动画执行时间为2秒
        // 也可以使用 animationSet.setDuration(3000);这样集合内的所有动画都拥有这个效果
        translateAnimation.setDuration(3000);
        //4.把 translateAnimation 添加到 AnimationSet 中
        animationSet.addAnimation(translateAnimation);
        //5.给定控件开始执行 AnimationSet
        imageView.startAnimation(animationSet);
        //imageView.startAnimation(translateAnimation);
    }

    /**
     * 代码的方式创建 缩放动画
     * @param view v
     */
    public void startScaleByCode(View view) {
        //1.创建一个 AnimationSet 对象(集合)，true 表示使用 AnimationSet 自带的插补器，false 表示使用自定义的插补器
        AnimationSet animationSet = new AnimationSet(true);
        /**
         * 2.创建 ScaleAnimation 对象
         * 8个参数，参数1、2确定X轴（水平方向）缩放；参数3、4确定Y轴（竖直方向）的缩放；后四个参数确定缩放的中心位置(缩放过程中中心是不变的)
         *
         * 参数1：X轴的初始大小 1.0表示原始尺寸
         * 参数2：X轴缩放后的大小
         * 参数3：Y轴的初始大小
         * 参数4：Y轴缩放后的大小
         *
         * 参数5：描述x轴坐标的类型  Animation.ABSOLUTE绝对坐标； Animation.RELATIVE_TO_SELF相对自身； Animation.RELATIVE_TO_PARENT.相对父控件
         * 参数6：x轴坐标：如果参数5是 Animation.ABSOLUTE，那么这里可以填绝对数值，0表示左边界；否则可以是一个相对于自身或父控件的百分比（1.0 表示 100%）
         * 参数7：描述y轴坐标的类型  Animation.ABSOLUTE绝对坐标； Animation.RELATIVE_TO_SELF相对自身； Animation.RELATIVE_TO_PARENT.相对父控件
         * 参数8：y轴坐标：如果参数7是 Animation.ABSOLUTE，那么这里可以填绝对数值，0表示左边界；否则可以是一个相对于自身或父控件的百分比（1.0 表示 100%）
         *
         * 此处效果：以控件的左上角为坐标原点进行缩放，从原始尺寸放大到 原来的2倍
         */
        ScaleAnimation scaleAnimation = new ScaleAnimation(1,2,1,2,Animation.RELATIVE_TO_SELF,0.0f,Animation.RELATIVE_TO_SELF,0.0f);
        //3.为 scaleAnimation 设置动画参数，如缩放过程用时3s
        scaleAnimation.setDuration(3000);
        //4.把 scaleAnimation 添加到 animationSet 中
        animationSet.addAnimation(scaleAnimation);
        //5.让控件执行动画
        imageView.startAnimation(animationSet);
    }

    /**
     * 代码的方式创建 旋转动画
     * @param view v
     */
    public void startRotateByCode(View view) {
        //1.创建一个 AnimationSet 对象(集合)，true 表示使用 AnimationSet 自带的插补器，false 表示使用自定义的插补器
        AnimationSet animationSet = new AnimationSet(true);
        /**
         * 2.创建 RotateAnimation 对象
         * 6个参数，前两个参数确定旋转的角度,后四个参数确定旋转的圆心位置
         * 参数1：旋转起始角度
         * 参数2：旋转结束角度
         * 参数3：描述x轴坐标的类型  Animation.ABSOLUTE绝对坐标； Animation.RELATIVE_TO_SELF相对自身； Animation.RELATIVE_TO_PARENT.相对父控件
         * 参数4：x轴坐标：如果参数3是 Animation.ABSOLUTE，那么这里可以填绝对数值，0表示左边界；否则可以是一个相对于自身或父控件的百分比（1.0 表示 100%）
         * 参数5：描述y轴坐标的类型  Animation.ABSOLUTE绝对坐标； Animation.RELATIVE_TO_SELF相对自身； Animation.RELATIVE_TO_PARENT.相对父控件
         * 参数6：y轴坐标：如果参数5是 Animation.ABSOLUTE，那么这里可以填绝对数值，0表示左边界；否则可以是一个相对于自身或父控件的百分比（1.0 表示 100%）
         * 此处效果：以控件自身中心为圆心，旋转一圈
         */
        RotateAnimation rotateAnimation = new RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        //3.为 rotateAnimation 设置动画参数，如旋转过程用时3s
        rotateAnimation.setDuration(3000);
        //4.把 rotateAnimation 添加到 animationSet 中
        animationSet.addAnimation(rotateAnimation);
        //5.让控件执行动画
        imageView.startAnimation(animationSet);
    }

    /**
     * 代码的方式创建 淡入淡出动画
     * @param view v
     */
    public void startAlphaByCode(View view) {
        //1.创建一个 AnimationSet 对象(集合)，true 表示使用 AnimationSet 自带的插补器，false 表示使用自定义的插补器
        AnimationSet animationSet = new AnimationSet(true);
        /**
         * 2.创建 AlphaAnimation 对象
         * 参数1：起始透明度  1表示完全不透明，0表示完全透明
         * 参数2：截止透明度  1表示完全不透明，0表示完全透明
         * 此处效果：从完全不透明到完全透明渐变
         */
        AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
        //3.为 AlphaAnimation 设置参数，如动画渐变的过程为3秒
        alphaAnimation.setDuration(3000);
        //4.把 AlphaAnimation 添加到 AnimationSet 中
        animationSet.addAnimation(alphaAnimation);
        //5.给定控件开始执行 AnimationSet
        imageView.startAnimation(animationSet);
    }


    /**
     * XML的方式创建 淡入淡出动画
     * @param view v
     */
    public void startAlphaByXML(View view) {
        // 1. 在res文件夹下面新建一个名为 anim 的文件夹
        // 2. 在 anim 文件夹下新建 xml 文件，根标签设为 set （相当于 AnimationSet）
        // 3. 在 set 标签中添加子标签 alpha
        // 4. 在代码中使用 AnimationUtils 加载 xml 文件，并生成 Animation 对象
        Animation alpha = AnimationUtils.loadAnimation(this, R.anim.alpha);
        // 5. 使用控件对象开始执行 Animation
        imageView.startAnimation(alpha);
    }

    /**
     * XML的方式创建 旋转动画
     * @param view v
     */
    public void startRotateByXML(View view) {
        // 1. 在res文件夹下面新建一个名为 anim 的文件夹
        // 2. 在 anim 文件夹下新建 xml 文件，根标签设为 set （相当于 AnimationSet）
        // 3. 在 set 标签中添加子标签 rotate
        // 4. 在代码中使用 AnimationUtils 加载 xml 文件，并生成 Animation 对象
        Animation rotate = AnimationUtils.loadAnimation(this, R.anim.rotate);
        // 5. 使用控件对象开始执行 Animation
        imageView.startAnimation(rotate);
    }

    /**
     * XML的方式创建 缩放动画
     * @param view v
     */
    public void startScaleByXML(View view) {
        // 1. 在res文件夹下面新建一个名为 anim 的文件夹
        // 2. 在 anim 文件夹下新建 xml 文件，根标签设为 set （相当于 AnimationSet）
        // 3. 在 set 标签中添加子标签 scale
        // 4. 在代码中使用 AnimationUtils 加载 xml 文件，并生成 Animation 对象
        Animation scale = AnimationUtils.loadAnimation(this, R.anim.scale);
        // 5. 使用控件对象开始执行 Animation
        imageView.startAnimation(scale);
    }

    /**
     * XML的方式创建 移动动画
     * @param view v
     */
    public void startTranslateByXML(View view) {
        // 1. 在res文件夹下面新建一个名为 anim 的文件夹
        // 2. 在 anim 文件夹下新建 xml 文件，根标签设为 set （相当于 AnimationSet）
        // 3. 在 set 标签中添加子标签 translate
        // 4. 在代码中使用 AnimationUtils 加载 xml 文件，并生成 Animation 对象
        Animation translate = AnimationUtils.loadAnimation(this, R.anim.translate);
        // 5. 使用控件对象开始执行 Animation
        imageView.startAnimation(translate);
    }

    /**
     * 代码的方式创建 动画集合
     * @param view v
     */
    public void startAnimationSetByCode(View view) {
        // 创建 AnimationSet 对象
        AnimationSet animationSet = new AnimationSet(true);
        //旋转动画 以自身中心为圆心顺时针旋转 2 圈
        RotateAnimation rotateAnimation = new RotateAnimation(0, 720,
                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        //移动动画 从父控件(坐标原点)左上角移动到右下角
        TranslateAnimation translateAnimation = new TranslateAnimation(
                Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,1,
                Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,1);
        //把动画添加到动画集合中
        animationSet.addAnimation(rotateAnimation);
        animationSet.addAnimation(translateAnimation);

        //设置通用属性
        animationSet.setDuration(2000); // 动画时长 2 秒
        animationSet.setStartOffset(500);// 延迟 500 毫秒再开始动画
        //开始执行动画
        imageView.startAnimation(animationSet);
    }

    /**
     * XML 的方式创建 动画集合
     * @param view v
     */
    public void startAnimationSetByXML(View view) {
        //使用 AnimationUtils 加载 xml 文件，并生成 Animation 对象
        Animation animation =  AnimationUtils.loadAnimation(this, R.anim.animations_set);
        //开始执行动画
        imageView.startAnimation(animation);
    }
}
  • Frame-by-frame Animations (帧动画)

布局文件 activity_frame_animations.xml ：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <ImageView
            android:id="@+id/iv_frame_xml"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <ImageView
            android:id="@+id/iv_frame_code"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:visibility="gone"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:layout_marginTop="100dp">
        <Button
            android:id="@+id/btn_frame_start"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="startFrame"
            android:text="开始XML"
            android:textColor="#000"
            android:textSize="18sp"/>

        <Button
            android:id="@+id/btn_frame_stop"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/btn_frame_start"
            android:onClick="stopFrame"
            android:text="停止XML"
            android:textColor="#000"
            android:textSize="18sp"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
        <Button
            android:id="@+id/btn_frame_start_code"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="startFrameByCode"
            android:text="开始Code"
            android:textColor="#000"
            android:textSize="18sp"/>

        <Button
            android:id="@+id/btn_frame_stop_code"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/btn_frame_start_code"
            android:onClick="stopFrameByCode"
            android:text="停止Code"
            android:textColor="#000"
            android:textSize="18sp"/>
    </RelativeLayout>

</LinearLayout>

布局实现 FrameAnimationsActivity.java ：

package com.yu.animationdemo;

import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;

/**
 * 帧动画
 * Created by yu on 2016/7/12.
 */
public class FrameAnimationsActivity extends AppCompatActivity{

    private ImageView ivFrameXml;  //xml 方式使用的控件
    private ImageView ivFrameCode; //代码 方式使用的控件

    private AnimationDrawable animationDrawableXml; //xml 方式使用的帧动画对象
    private AnimationDrawable animationDrawableCode;//代码 方式使用的帧动画对象
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_frame_animations);

        // xml 方式 初始化
        initFrameXml();
        //代码方式 初始化
        initFrameCode();
    }

    /**
     * 代码的方式 初始化帧动画对象
     */
    private void initFrameCode() {
        ivFrameCode = (ImageView) findViewById(R.id.iv_frame_code);
        // 创建 AnimationDrawable 实例
        animationDrawableCode = new AnimationDrawable();
        // 添加动画帧
        animationDrawableCode.addFrame(getResources().getDrawable(R.drawable.h1),100);
        animationDrawableCode.addFrame(getResources().getDrawable(R.drawable.h2),100);
        // false 重复    true 执行一次
        animationDrawableCode.setOneShot(false);
        // 把 AnimationDrawable 设置为 ImageView 的背景
        ivFrameCode.setBackgroundDrawable(animationDrawableCode);
    }

    /**
     * Xml的方式 初始化帧动画对象
     */
    private void initFrameXml() {
        ivFrameXml = (ImageView) findViewById(R.id.iv_frame_xml);
        if (ivFrameXml != null) {
            /*
            // 方式一
            // 为 ImageView 设置 资源文件 背景
            ivFrameXml.setBackgroundResource(R.drawable.frame);
            // 获取背景作为 AnimationDrawable 对象
            animationDrawableXml = (AnimationDrawable) ivFrameXml.getBackground();
            */

            // 方式二
            // 通过逐帧动画的资源文件获得 AnimationDrawable 实例
            animationDrawableXml = (AnimationDrawable) getResources().getDrawable(R.drawable.frame);
            // 把 AnimationDrawable 设置为 ImageView 的背景
            ivFrameXml.setBackgroundDrawable(animationDrawableXml);
        }
    }

    /**
     * xml 执行动画
     * @param view v
     */
    public void startFrame(View view) {
        if (!animationDrawableXml.isRunning()) {
            ivFrameXml.setVisibility(View.VISIBLE);
            ivFrameCode.setVisibility(View.GONE);
            animationDrawableCode.stop();
            //开始动画
            animationDrawableXml.start();
        }
    }

    /**
     * xml 停止动画
     * @param view v
     */
    public void stopFrame(View view) {
        animationDrawableXml.stop();
    }

    /**
     * 代码 执行动画
     * @param view v
     */
    public void startFrameByCode(View view) {
        if (!animationDrawableCode.isRunning()) {
            ivFrameXml.setVisibility(View.GONE);
            ivFrameCode.setVisibility(View.VISIBLE);
            animationDrawableXml.stop();
            //开始动画
            animationDrawableCode.start();
        }
    }

    /**
     * 代码 停止动画
     * @param view v
     */
    public void stopFrameByCode(View view) {
        animationDrawableCode.stop();
    }
}
  • Property Animator (属性动画)

布局文件与补间动画类似，不再累述

布局实现 PropertyAnimatorActivity.java ：

package com.yu.animationdemo;

import android.animation.Animator;
import android.animation.AnimatorInflater;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.animation.ValueAnimator;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;

/**
 * 属性动画
 *
 *  ofFloat(arg1, arg2，...)
 * 参数1：要操作的对象
 * 参数2：要操作的属性(只能操作一个属性)
 * 可变参数：开始和结束
 *
 * Created by yu on 2016/7/12.
 */
public class PropertyAnimatorActivity extends AppCompatActivity {

    private ImageView imageView;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_property_animator);
        imageView = (ImageView) findViewById(R.id.image_view);
    }

    /**
     * 代码的方式 旋转动画
     * @param view v
     */
    public void startRotateByCode(View view) {

        //中心旋转
        //ObjectAnimator animator = ObjectAnimator.ofFloat(imageView,"rotation",0,360);
        //围绕 X 轴旋转
        //ObjectAnimator animator = ObjectAnimator.ofFloat(imageView,"rotationX",0,360,180);
        //围绕 Y 轴旋转
        ObjectAnimator animator = ObjectAnimator.ofFloat(imageView,"rotationY",0,360,180);
        animator.setDuration(2000);
        //下面两句设置重复模式 INFINITE (-1) 表示一直重复
        //animator.setRepeatMode(ValueAnimator.REVERSE);
        //animator.setRepeatCount(ValueAnimator.INFINITE);
        //开始动画
        animator.start();
    }

    /**
     * XML的方式 旋转动画
     * @param view v
     */
    public void startRotateByXML(View view) {
        //加载资源文件
        Animator animator = AnimatorInflater.loadAnimator(this, R.animator.rotate);
        //设置作用的对象
        animator.setTarget(imageView);
        //开始动画
        animator.start();
    }

    /**
     * 代码的方式 缩放动画
     * @param view v
     */
    public void startScaleByCode(View view) {
        // X 轴方向缩放 0.5 --> 2 --> 1
        ObjectAnimator animator = ObjectAnimator.ofFloat(imageView,"scaleX",0.5f,2,1);
        animator.setDuration(2000);
        animator.start();
    }

    /**
     * XML的方式 缩放动画
     * @param view v
     */
    public void startScaleByXML(View view) {
        Animator animator = AnimatorInflater.loadAnimator(this, R.animator.scale);
        animator.setTarget(imageView);
        animator.start();
    }

    /**
     * 代码方式 位移动画
     * @param view v
     */
    public void startTranslateByCode(View view) {
        //水平方向位移 从 0 -> 300 -> 100 -> 500 止
        ObjectAnimator animator = ObjectAnimator.ofFloat(imageView,"translationX",0,300,100,500);
        animator.setDuration(2000);
        //animator.setRepeatMode(ValueAnimator.REVERSE);
        animator.start();
    }

    /**
     * XML方式 位移动画
     * @param view v
     */
    public void startTranslateByXML(View view) {
        Animator animator = AnimatorInflater.loadAnimator(this, R.animator.translate);
        animator.setTarget(imageView);
        animator.start();
    }

    /**
     * 代码的方式 淡入淡出
     * @param view v
     */
    public void startAlphaByCode(View view) {
        //淡入淡出 从 0.2 的不透明度 -> 0.8 的不透明度 -> 0.5 的不透明度 -> 1 完全不透明
        ObjectAnimator animator = ObjectAnimator.ofFloat(imageView,"alpha",0.2f,0.8f,0.5f,1);
        animator.setDuration(3000);
        //animator.setRepeatMode(ValueAnimator.REVERSE);
        animator.start();
    }

    /**
     * XML的方式 淡入淡出
     * @param view v
     */
    public void startAlphaByXML(View view) {
        Animator animator = AnimatorInflater.loadAnimator(this, R.animator.alpha);
        animator.setTarget(imageView);
        animator.start();
    }

    /**
     * 代码方式 动画集合
     * @param view v
     */
    public void startAnimatorSetByCode(View view) {
        //创建 AnimatorSet 集合对象
        AnimatorSet set = new AnimatorSet();
        //创建 淡入淡出动画
        ObjectAnimator animatorAlpha = ObjectAnimator.ofFloat(imageView,"alpha",0.2f,1);
        //创建 平移动画
        ObjectAnimator animatorTranslationX = ObjectAnimator.ofFloat(imageView,"translationX",0,300,100,500);
        //设置顺序播放
        //set.playSequentially(animatorTranslationX,animatorAlpha);
        //设置一起播放
        set.playTogether(animatorAlpha, animatorTranslationX);
        //设置作用的对象
        set.setTarget(imageView);
        //设置动画时长
        set.setDuration(3000);
        //开始执行动画
        set.start();
    }

    /**
     * XML方式 动画集合
     * @param view v
     */
    public void startAnimatorSetByXML(View view) {
        Animator animator = AnimatorInflater.loadAnimator(this, R.animator.animator_set);
        animator.setTarget(imageView);
        animator.start();
    }
}

源代码下载

CSDN 资源

GitHub 资源

总结

本次学习的都是 Android 动画中最最基础的使用方法，还有很多常用的高级知识点没有涉及，比如 Interpolator、Layout Animations (布局动画)、AnimatorListenerAdapter、AnimatorListener 等 ….

路漫漫其修远兮 … , …

man_help
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Android属性动画--基础使用
Sizon的专栏
03-24 3246
Android属性动画–基础使用转载请注明出处，谢谢~~ 首先这篇文章是第一次用Markdown编写的，有什么问题（格式上的）请大家谅解。 - Android动画的概述 - 属性动画的介绍 - 属性动画的基本使用目录Android属性动画基础使用 Android动画概述 属性动画介绍 属性动画的基本使用 ObjectAnimator的使用 ValueAnimator的使用 AnimatorS
Android动画----Translate
不悔的青春
12-04 1901
引言　　关于动画的学习，这是第四篇啦，都是最基础的几种动画，梳理一番，对知识的了解就更加清晰啦，转入正题，介绍今天的主角Translate。 　　 Translate动画　　顾名思义，Translate动画就是位移动画，也是集成自基类Animation。 　　 Translate属性 　　 　　Translate动画的相关属性如下xml所示，每个字段的意思见注释 <?xml version=
android 动画效果教程,Android 三种动画详解及简单实例
weixin_42325867的博客
05-26 251
Android 三种动画详解帧动画一张张图片不断的切换，形成动画效果在drawable目录下定义xml文件，子节点为animation-list，在这里定义要显示的图片和每张图片的显示时长 在屏幕上播放帧动画ImageView iv = (ImageView) findViewById(R.id.iv); //把动画文件设置为imageView的背景...
缩进动画Scaleanimation的一个小示例
项勇 | 一天不学点啥就浑身难受
01-13 950
根据之前所学的所有动画，我们都可以在不同的实例中将动画效果添加进去，让界面更灵活美观，下面我就用一个简单的ListView来实现添加动画效果： 一、要实现的效果： 一组ListView数组，当打开页面的时候，ListView上所有的数据以渐进缩放动画效果呈现出来； 二、效果图： 三、代码附上： package com.example.examples_scaleani
Android动画----Alpha
不悔的青春
11-30 4836
引言　　紧接上一篇文章，本篇继续学习Android动画基础知识，本篇的主角是Alpha 　　 Alpha动画　　Alpha是Andriod透明度渐变动画，其基类为Animation类。 　　 Alpha属性 <?xml version="1.0" encoding="utf-8"?> <alpha xmlns:android="http://schemas.android.com/ap
Android属性动画 - 平移动画
u010349644的专栏
09-22 1万+
1、简介 在上一篇中，详细讲解了Android补间动画 - 缩放动画的具体实现，补间动画的其他动画实现方式很类似，能够将一个掌握透彻，其他也就迎刃而解，本篇文章主要讲解属性动画-平移动画的具体实现，同时也会概况属性动画的其他几种类型，相信看完本篇文章会对属性动画有一个全面的认识。 话不多说，我们仍然以一个实例来讲解，具体效果图如下： 2、具体实现 对于属性动画的实现，我们可以不用在xm...
Android动画----ValueAnimator
不悔的青春
01-10 2972
引言　　关于Android动画的内容，我们已经讲了好几篇了，都是一些最基础的，包括Alpha、Translate、Rotate、Scale都是常见的补间动画（Tween Animation），属于视图动画（包括补间动画和帧动画），今天我们来学习另一种类型，属性动画，主角是ValueAnimator。 　　那么肯定有人会疑惑视图动画和属性动画有什么区别？那就看下面我对这两种动画的理解： 　　 视图
Android 动画 - RoateAnimation 旋转动画
shibin1990_的博客
06-07 3457
RoateAnimation：旋转动画，ViewAnimation的小分支 同样，创建RoateAnimation有两种方式 1. XML文件+Java代码 2. Java代码方式XML文件+Java代码示例图片： roate.xml<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.a
Android基础学习-Drawable
oschina_41673164的博客
10-01 2140
android基础学习-Drawable
Android RecyclerView 使用大全 - 基础使用，item 动画，下拉刷新等
程序员徐师兄的博客
03-10 2982
是官方在5.0之后新添加的控件，推出用来替代传统的ListView和GridView列表控件。
Android动画介绍-总结
最新发布
05-02
在Android开发中，动画是提升用户...总之，Android动画是一个广泛且重要的主题，开发者需要掌握基础动画和属性动画的使用，了解视图过渡动画，并结合实际项目需求，合理地运用各种动画技术，创造出引人入胜的用户体验。
Android动画介绍-属性动画（1）
05-02
本篇文章将深入探讨Android属性动画的基础知识，特别关注JAVA方式的实现。 ### 一、属性动画概述 属性动画系统不同于之前的帧动画（Frame Animation）和补间动画（Tween Animation），它并不依赖于视图更新或者UI...
Android动画介绍-补间动画（1）
05-02
本文将深入探讨Android中的补间动画，这是Android动画系统的一部分，主要用于创建平滑的过渡效果。补间动画，也称为“时间插值”动画，允许开发者定义对象在一定时间内的变化过程。 一、补间动画基础 补间动画基于...
Android-android动画差值器
08-13
总的来说，差值器是Android动画系统中的一个重要组成部分，它允许开发者对动画的时间轴进行控制，创造出各种富有表现力的动态效果。理解和熟练运用差值器，不仅可以提升应用程序的视觉体验，还能增强用户的沉浸感，...
Android-Android上的Triangulation动画
08-13
这篇文章将深入探讨这个主题，包括Android动画基础、SVG三角剖分的概念以及如何在Android应用中实现这种动画效果。 首先，我们来理解Android的动画系统。Android提供了多种动画机制，包括属性动画（Property ...
Android — 创建文件及文件夹
热门推荐
man_help的博客
08-25 1万+
Android 中创建文件及文件夹，实际上用的都是基本的 java 语法，和普通的 java 程序不同的是： 如果要访问 SD 卡，需要配置权限，而且在 API 23 上，需要考虑运行时权限检查。
Android — 运行时权限检查
man_help的博客
08-25 1万+
在 Android 6.0 即 API 23 之前，我们用到的权限只需要在 AndroidManifest 文件中统一进行申请就可以了，而且用户不可取消！但是在 6.0 及以上，出于安全性考虑，开始由用户掌握了部分主动权！动态权限检查就成了必经之路...
Android — 之百度地图定位+添加Mark+InfoWindow
man_help的博客
03-10 1万+
前言：　　新手上路，这几天在弄百度地图SDK的使用（吐槽 : 官网上的开发指南简直就是实力坑爹，可能是开发人员太忙，维护不及时吧），我对本次学习的要求也不高：能正常显示地图，能定位，能添加mark(覆盖物)，点击mark时能提示当前位置信息就行，再深的东西，以后有时间再去研究吧，毕竟新手还是欠火候。
Android — 跳转到系统安装应用界面
man_help的博客
08-25 6555
调用系统的安装界面来安装 apk ，也就是说需要跳转 activity ，而且只能隐式启动，那就需要使用 Intent 并设置 action 和 data 等，这里需要的为 Intent 作如下设置....
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值