【Android -- 动画】Tween 动画

已于 2022-06-28 15:41:34 修改
阅读量3.2k 收藏 2
点赞数 1
分类专栏： Android -- 动画 文章标签： android 动画 补间动画
于 2017-03-08 17:10:04 首次发布
本文为博主原创文章，未经博主允许不得转载。
本文链接：https://blog.csdn.net/duoduo_11011/article/details/60876233
版权

一、前言

Tween 动画是 Android 最早的动画框架，从 Android1.0 就开始提供。Tween 动画使用简单，功能也不强，支持代码和 xml 两种方式编写动画。

二、原理

通过确定开始的视图样式、结束的视图样式、中间动画变化过程由系统补全来确定一个动画。根据不同的效果，分为四种动画：

  • 平移动画（Translate）
  • 缩放动画（scale）
  • 旋转动画（rotate）
  • 透明度动画（alpha）

三、代码实现

在这里插入图片描述

1. 平移动画（Translate）

1. 动画效果 xml 文件,/res/anim/translate_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000"
    android:startOffset ="1000"
    android:fillBefore = "true"
    android:fillAfter = "false"
    android:fillEnabled= "true"
    android:repeatMode= "restart"
    android:repeatCount = "0"
    android:fromXDelta="0"
    android:toXDelta="500"
    android:fromYDelta="0"
    android:toYDelta="500" />

2. 代码

public class MainActivity extends AppCompatActivity {
    private TextView mAnim;
    private Button mPlay;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);

        initView();
        initEvent();

        // 方式二：通过 TranslateAnimation 实现
        Animation animation = new TranslateAnimation(0,500,0,500);
        animation.setDuration(3000);
        mAnim.startAnimation(animation);
    }

    private void initView() {
        mAnim = findViewById(R.id.tv_anim);
        mPlay = findViewById(R.id.btn_play);
    }

    private void initEvent() {
        mPlay.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 方式一：通过加载 xml 文件实现
                Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.translate_anim);
                mAnim.startAnimation(animation);
            }
        });
    }
}

2. 缩放动画（Scale）

1. 动画效果 xml 文件,/res/anim/scale_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000"
    android:startOffset ="1000"
    android:fillBefore = "true"
    android:fillAfter = "false"
    android:fillEnabled= "true"
    android:repeatMode= "restart"
    android:repeatCount = "0"

    android:fromXScale="0.0"
    android:toXScale="2.0"
    android:fromYScale="0.0"
    android:toYScale="2.0"
    android:pivotX="50%"
    android:pivotY="50%"/>

2. 代码

public class MainActivity extends AppCompatActivity {
    private TextView mAnim;
    private Button mPlay;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);

        initView();
        initEvent();

        // 方式二：通过 ScaleAnimation 实现
        Animation animation = new ScaleAnimation(0,2,0,2,Animation.RELATIVE_TO_SELF,
                0.5f,Animation.RELATIVE_TO_SELF,0.5f);
        animation.setDuration(3000);
        mAnim.startAnimation(animation);
    }

    private void initView() {
        mAnim = findViewById(R.id.tv_anim);
        mPlay = findViewById(R.id.btn_play);
    }

    private void initEvent() {
        mPlay.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 方式一：通过加载 xml 文件实现
                Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.scale_anim);
                mAnim.startAnimation(animation);
            }
        });
    }
}

3.旋转动画（Rotate）

1. 动画效果 xml 文件,/res/anim/rotate_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromDegrees="0"
    android:toDegrees="+360"
    android:repeatCount="10"
    android:repeatMode="restart"
    android:pivotX="50%"
    android:pivotY="50%"
    android:interpolator="@android:anim/overshoot_interpolator" />

2. 代码

public class MainActivity extends AppCompatActivity {
    private TextView mAnim;
    private Button mPlay;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);

        initView();
        initEvent();

        // 方式二：通过 RotateAnimation 实现
        Animation animation = new RotateAnimation(0,270,Animation.RELATIVE_TO_SELF,
                0.5f,Animation.RELATIVE_TO_SELF,0.5f);
        animation.setDuration(3000);
        mAnim.startAnimation(animation);
    }

    private void initView() {
        mAnim = findViewById(R.id.tv_anim);
        mPlay = findViewById(R.id.btn_play);
    }

    private void initEvent() {
        mPlay.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 方式一：通过加载 xml 文件实现
                Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.rotate_anim);
                mAnim.startAnimation(animation);
            }
        });
    }
}

4.透明度动画（Alpha）

1. 动画效果 xml 文件,/res/anim/alpha_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000"
    android:startOffset ="1000"
    android:fillBefore = "true"
    android:fillAfter = "false"
    android:fillEnabled= "true"
    android:repeatMode= "restart"
    android:repeatCount = "0"
    android:interpolator="@android:anim/overshoot_interpolator"
    android:fromAlpha="1.0"
    android:toAlpha="0.0"/>

2. 代码

public class MainActivity extends AppCompatActivity {
    private TextView mAnim;
    private Button mPlay;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);

        initView();
        initEvent();

        // 方式二：通过 AlphaAnimation 实现
        Animation animation = new AlphaAnimation(1,0);
        animation.setDuration(3000);
        mAnim.startAnimation(animation);
    }

    private void initView() {
        mAnim = findViewById(R.id.tv_anim);
        mPlay = findViewById(R.id.btn_play);
    }

    private void initEvent() {
        mPlay.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 方式一：通过加载 xml 文件实现
                Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.alpha_anim);
                mAnim.startAnimation(animation);
            }
        });
    }
}

5. 组合动画

上面讲的都是单个动画效果，但实际中很多需求都需要同时使用平移、缩放、旋转 & 透明度4种动画，即组合动画。
1. 动画效果 xml 文件,/res/anim/combination_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000"
    android:startOffset ="1000"
    android:fillBefore = "true"
    android:fillAfter = "false"
    android:fillEnabled= "true"
    android:repeatMode= "restart"
    android:repeatCount = "0"
    android:interpolator="@android:anim/overshoot_interpolator"
    >
    <!--设置旋转动画，语法同单个动画-->
    <rotate
        android:duration="1000"
        android:fromDegrees="0"
        android:toDegrees="360"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatMode="restart"
        android:repeatCount="infinite"
        />

    <!--设置平移动画，语法同单个动画-->
    <translate
        android:duration="10000"
        android:startOffset = "1000"
        android:fromXDelta="-50%p"
        android:fromYDelta="0"
        android:toXDelta="50%p"
        android:toYDelta="0" />

    <!--设置透明度动画，语法同单个动画-->
    <alpha
        android:startOffset="7000"
        android:duration="3000"
        android:fromAlpha="1.0"
        android:toAlpha="0.0" />

    <!--设置缩放动画，语法同单个动画-->
    <scale
        android:startOffset="4000"
        android:duration="1000"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0.5"
        android:toYScale="0.5" />

</set>

2. 代码

public class MainActivity extends AppCompatActivity {
    private TextView mAnim;
    private Button mPlay;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);

        initView();
        initEvent();

        // 方式二：通过 AnimationSet 实现
        AnimationSet animation = new AnimationSet(true);
        animation.setRepeatMode(Animation.RESTART);
        animation.setRepeatCount(1);

        //子动画1: 旋转动画
        Animation rotate = new RotateAnimation(0,360,Animation.RELATIVE_TO_SELF,
                0.5f,Animation.RELATIVE_TO_SELF,0.5f);
        rotate.setDuration(1000);
        rotate.setRepeatMode(Animation.RESTART);
        rotate.setRepeatCount(Animation.INFINITE);

        // 子动画2:平移动画
        Animation translate = new TranslateAnimation(TranslateAnimation.RELATIVE_TO_PARENT, -0.5f,TranslateAnimation.RELATIVE_TO_PARENT,
                0.5f,TranslateAnimation.RELATIVE_TO_SELF,0,TranslateAnimation.RELATIVE_TO_SELF,0);
        translate.setDuration(10000);

        // 子动画3:透明度动画
        Animation alpha = new AlphaAnimation(1,0);
        alpha.setDuration(3000);
        alpha.setStartOffset(7000);

        // 子动画4:缩放动画
        Animation scale = new ScaleAnimation(1,0.5f,1,0.5f,Animation.RELATIVE_TO_SELF,
                0.5f,Animation.RELATIVE_TO_SELF,0.5f);
        scale.setDuration(1000);
        scale.setStartOffset(4000);

        animation.addAnimation(rotate);
        animation.addAnimation(translate);
        animation.addAnimation(alpha);
        animation.addAnimation(scale);
        mAnim.startAnimation(animation);
    }

    private void initView() {
        mAnim = findViewById(R.id.tv_anim);
        mPlay = findViewById(R.id.btn_play);
    }

    private void initEvent() {
        mPlay.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 方式一：通过加载 xml 文件实现
                Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.combination_anim);
                mAnim.startAnimation(animation);
            }
        });
    }
}
Kevin-Dev
关注
专栏目录
Android动画之一：Tween Animation（补间动画）示例详解
CoderEthan的博客
11-09 1781
摘要 今天花了一天时间学习了Android动画的一种——View Animation（视图动画），好记性不如烂笔头，赶紧写篇博客记录下吧！知识点新鲜出炉，欢迎大家交流研讨！ 本篇博客除了简单介绍Android动画知识外，会通过示例代码重点介绍**View Animation（视图动画）**的使用方法及特点。 Android动画的分类 动画的使用是Android开发中常用的知识，今天就带大家一起了解...
Android---Tween动画
10-24
Android---Tween动画 运用了4种Tween的动画效果，包括： rotate(旋转）,scale（伸缩）, alpha（透明度）,translate（平移） 以及tween（综合4种效果）
【Android动画】之Tween动画 (渐变、缩放、位移、旋转)
热门推荐
幻影浪子
04-12 17万+
Android 平台提供了两类动画。 一类是Tween动画，就是对场景里的对象不断的进行图像变化来产生动画效果（旋转、平移、放缩和渐变）。第二类就是 Frame动画，即顺序的播放事先做好的图像，与gif图片原理类似。下面就讲一下Tweene Animations。主要类：Animation  动画AlphaAnimation 渐变透明度RotateAnimation 画面旋转ScaleAnimation 渐变尺寸缩放TranslateAnimation 位置移动AnimationSet  动画
Android-PickerView 使用教程
最新发布
gitblog_00474的博客
08-09 443
Android-PickerView 使用教程 Android-PickerView项目地址:https://gitcode.com/gh_mirrors/and/Android-PickerView 1. 项目的目录结构及介绍 Android-PickerView 项目的目录结构如下： Android-PickerView/ ├── app/ │ ├── build.gradle │ ...
Android 动画详解之Tween动画
Mobile Internet developer
05-31 1万+
一个Tween动画将对于View对象的内容进行一系列简单的转换，在animation提供了所以关于Tween动画的类，主要有四个常用的类，AlphaAnimation(透明度渐变)，RotateAnimation(旋转动画)，ScaleAnimation(图片缩放动画)，TranslateAnimation(移动动画)，AnimationSet(一个动画的集合类），以下是对常用动画特效类的构造方法
android之tween动画详解
weixin_30556161的博客
05-13 188
android中一共提供了两种动画，其一便是tween动画，tween动画通过对view的内容进行一系列的图像变换（包括平移，缩放，旋转，改变透明度）来实现动画效果，动画效果的定义可以使用xml，也可以使用编码来实现。 下面我们逐一查看tween能够实现的动画效果。 先看看工程的整体结构吧： 我们要实现的效果图如图 点击按钮则执行相应的动画操作。 布局文件act...
android Tween Animation四种动画
weixin_33709590的博客
12-07 95
AlphaAnimation 控制渐变透明的动画效果 　　1.android: fromAlpha 动画起始时的透明度 　　2.android: toAlpha 动画结束时的透明度 ScaleAnimation 控制尺寸伸缩的动画效果 　　1.android:fromXScale 动画起始时x坐标的伸缩尺寸 　　2.android:toXScale 动画结束时X坐标的伸...
Android-Android密码动画
08-12
2. **动画框架**：Android提供了多种动画框架，如Tween动画、帧动画以及属性动画。在密码动画中，通常会用到属性动画（Property Animation），通过改变密码输入框中字符的状态（如透明度、大小、位置等）来实现动画...
Java代码-Android-动画效果.zip-综合文档
05-19
首先，Android提供了两种主要类型的动画：补间动画（Tween Animation）和帧动画（Frame Animation）。补间动画用于改变视图的属性，如位置、大小、透明度等，而帧动画则类似于传统的卡通播放，通过连续显示一系列...
android-animation-collections:android动画集合
05-02
"android-animation-collections" 是一个专注于Android动画的项目集合，其中包含了多种动画效果的实现，旨在帮助开发者更好地理解和运用Android动画系统。下面将详细介绍其中的两个主要组件：ShakeAnimation 和 ...
Android-安卓动画Interpolators的可视化
08-12
本篇文章将深入探讨Android动画中的Interpolators，并通过可视化的方式帮助开发者更好地理解它们的工作原理。 动画在Android中主要分为两种类型：补间动画（Tween Animation）和视图动画（View Animation）。补间...
tween动画演示
03-21
tween 动画效果，图片的移动，渐隐，放大，旋转等效果
TWEEN动画
weixin_30496751的博客
06-26 123
TWEEN动画黄金法则四条: 一.边界判断加步长 二.清掉没有用的定时器 三.在大move要传参的情况下在里面写一个 小_move来避免不销毁作用域的累积 四.把定时器的返回值放在自定义属性上,来防止一个元素同时有多个动画来运行 需求:实现一个匀速运动,在指定时间内完成动画:计算出总距离\总时间,根据总距离和总时间求出对应的步长(每走10ms走一步的话需要走多远) 设置一个定时器,让元素每一次...
Tween动画介绍
pointerfree的专栏
09-15 2万+
Tween动画又称“补间动画”、“中间动画”，这并不重要，就好像很多人都知道鲁迅，却不知道他叫：周树人。    Tween动画在Android中分为4类，它们分别是：AlphaAnimation(透明度动画)、TranslateAnimation(平移动画)、ScaleAnim
Tween动画
gswdzh的博客
06-20 406
动画：Tween动画（Animation）、Frame动画（AnimationDrawable）、属性动画（Animator）Tween动画通过对一个视图不断的进行平移、旋转、放大、缩小、透明变换所形成的动画透明度动画//创建动画对象 AlphaAnimation anim = new AlphaAnimation(1.0f,0); //设置时间 anim.setDuration(1000); //
android 动画 -- tween动画
snailpeople的博客
08-20 391
先看一下android动画框架： tween动画详解：tween动画可以实现让某个控件展现出旋转，渐变，移动，缩放的一种转换过程，当然，这些单独的动画也可以组合一起来使用，可以打造一些适用的效果。主要类 Animation AlphaAnimation--渐变透明度 RotateAnimation --旋转 ScaleAnimation --缩放 TranslateAnimation
Android Tween动画
Sunshine的专栏
11-26 398
闲来无事，说说动画吧，之前也用过简单的动画，但每次都是上网查，不是很方便，想想还是写写吧。 说到Android 动画，能想到的就是Animations,它提供了一系列动画效果，旋转，平移，渐变等等。Animations大概可以分为两类： 一是Tween动画 即TweenedAnimations它提供了动画的 1、旋转RotateAnimation,2、平移TranslateAnimation,
Android中的Tween Animation
jinxinglin的博客
10-05 225
Tween Animation：提供了旋转、移动、伸展和淡出等效果。Alpha——淡入淡出，Scale——缩放效果，Rotate——旋转，Translate——移动效果。 在res文件夹下新建一个anim文件夹，为其添加set动画：     android:fillAfter="true"     android:interpolator="@android:anim/accel
Android动画之Tween动画
timshinlee的博客
08-01 249
Tween动画是补间动画，系统根据指定的初始状态以及结束状态对状态值进行改变，实现动画。顾名思义，View动画只能作用于View上面，可以通过java代码方式和xml方式进行设置。xml方式在res/anim/目录下创建动画文件，文件应该只有一个根元素，<alpha><scale><translate><rotate><set>或者interpolator，<set>之中又可以包含<set>。默认所
Android Tween动画详解与实现
"本文将介绍Android中的tween动画基础，包括tween动画的概念、应用场景以及如何在项目中实现这种动画效果。" 在Android开发中，动画是提升用户体验的关键元素之一。Android提供了两种主要的动画类型：tween动画和帧...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Kevin-Dev

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值