Android动画(帧动画、补间动画、属性动画)讲解

首先我们来看看啥是帧动画、补间动画、属性动画。

介绍:

帧动画:是一种常见的动画形式(Frame By Frame),其原理是在“连续的关键帧”中分解动画动作,也就是在时间轴的每帧上逐帧绘制不同的内容,使其连续播放而成动画。

补间动画:指的是做FLASH动画时,在两个关键帧中间需要做“补间动画”,才能实现图画的运动;

属性动画:帧动画与补间动画实现了对View进行移动、缩放、旋转和淡入淡出的效果。但对于android开发师来说是不够的,同时移动、缩放、旋转和淡入淡出的效果也不再只是一种视觉上的动画效果了。所以从Android 3.0版本开始,系统给我们提供了一种全新的动画模式,属性动画(property animation)。

所以今天我们来看看,这些动画是怎样实现的。

帧动画(我们先来看看效果)

首先我们创建我们要的素材,把他们导入到drawable文件夹下,如图。

然后在drawable文件新建from.xml文件,写入代码,这里的作用可以理解为,我们把图片
放到一个集合里面去了,要用的时候我们直接调用from。

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"><item android:drawable="@drawable/a" android:duration="120" /><item android:drawable="@drawable/b" android:duration="120" /><item android:drawable="@drawable/c" android:duration="120" /><item android:drawable="@drawable/d" android:duration="120" /><item android:drawable="@drawable/e" android:duration="120" /><item android:drawable="@drawable/f" android:duration="120" /><item android:drawable="@drawable/g" android:duration="120" /><item android:drawable="@drawable/h" android:duration="120" /></animation-list>

然后在activity_main.xml文件里写入

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/tl"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@drawable/from"></RelativeLayout>

然后在MainActivity.java文件写入代码

package com.example.a2022324;import androidx.appcompat.app.AppCompatActivity;import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.View;
import android.widget.RelativeLayout;public class MainActivity extends AppCompatActivity {private boolean flag;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);RelativeLayout relativelayout = findViewById(R.id.tl); //获取activity——main的RelativeLayout 的idAnimationDrawable anim = (AnimationDrawable) relativelayout.getBackground();// anim作用获取背景,这里我们的被禁就是我们设置的图片集合(from)relativelayout.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View view) {if(flag){//用开关来实现点击动与不动的效果anim.start();flag = false;}else{anim.stop();flag = true;}}});}
}

我们点击运行完成了效果。

补间动画

alpha:图片渐渐地显示,渐渐地消失的效果。
rotat:图片的以某一点为中心,旋转xx度
scale:图片的放大与缩小
translate:图片的平移

然后我们来看看补间动画,首先来看看效果。

我们在res文件先创建amin目录在分别创建alpha、rotate、scale、tranlslate.xml文件。

先看看alpha.xml和activity.xml文件

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"><alphaandroid:duration="2000"android:fromAlpha="0"android:toAlpha="1" /></set>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:ignore="MissingClass"><ImageViewandroid:id="@+id/iv"android:src="@drawable/background"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"//说明一下,第一个属性,只要你容器是RelativeLayout的时候才有。此时设置为RelativeLayout里的子控件属性为android:layout_centerInParent=”true“,就是水平垂直都居中。android:adjustViewBounds="true"//调整ImageView的边界,使得ImageView和图片有一样的长宽比例。android:maxHeight="300dp"android:maxWidth="300dp"/></RelativeLayout>

android:adjustViewBounds的用法这里可以看看这位小哥哥的我是连接(https://www.jianshu.com/p/49f8d5e5965b?utm_campaign=haruki)

再看看MainActivity.java文件,这里我把其他功能也加了上去,避免代码冗余,不过注释掉了,不会影响结果。

package com.example.a2022324;import androidx.appcompat.app.AppCompatActivity;import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.RelativeLayout;public class MainActivity extends AppCompatActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);ImageView imageview = findViewById(R.id.iv);//获取id值imageview.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View view) {//通过animation来加载alpha文件,下面的原理同理Animation animation = AnimationUtils.loadAnimation(MainActivity.this,R.anim.alpha);//                Animation animation = AnimationUtils.loadAnimation(MainActivity.this,
//                        R.anim.rotate);//                Animation animation = AnimationUtils.loadAnimation(MainActivity.this,
//                        R.anim.scale);//                Animation animation = AnimationUtils.loadAnimation(MainActivity.this,
//                        R.anim.translate);imageview.startAnimation(animation);}});}
}

属性动画

我们先来看看效果。

这里我们可以看出,文字渐隐出现,我们直接看代码

activity_main

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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:ignore="MissingClass"><TextViewandroid:id="@+id/tv"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="快看我,我要变化了"android:textSize="20sp"app:layout_constraintLeft_toLeftOf="parent"app:layout_constraintRight_toRightOf="parent"app:layout_constraintTop_toTopOf="parent"app:layout_constraintBottom_toBottomOf="parent"/></androidx.constraintlayout.widget.ConstraintLayout>

这里我们用到了androidx.constraintlayout.widget.ConstraintLayout这一坨玩意,
如果你的包红了,那是因为没用引入库。在app->的build.gradle文件的dependencies写入==implementation ‘androidx.constraintlayout:constraintlayout:1.1.3’==这一坨玩意。如图。

我们再来看看,mainactivity代码:

package com.example.a2022324;import androidx.appcompat.app.AppCompatActivity;import android.animation.ObjectAnimator;
import android.animation.ValueAnimator;
import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;public class MainActivity extends AppCompatActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);ValueAnimator valueAnimator = ValueAnimator.ofFloat(0f, 1f);//改变float的值,0f是透明的,1f是不透明的// ValueAnimator.ofArgb()valueAnimator.setDuration(2000);valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator valueAnimator) {float value = (float) valueAnimator.getAnimatedValue();}});valueAnimator.start();TextView textView = findViewById(R.id.tv);ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView, "alpha",0f, 1f);//objectAnimator 作用是  让我们的textView的透明度从0f到1fobjectAnimator.setDuration(4000);//从0f到1f要4秒objectAnimator.start();//启动}
}

ValueAnimator的用法可以看看这位大佬的用法我是连接
(https://blog.csdn.net/u011043551/article/details/65938908)

效果完成。(求关注)

Android动画(帧动画、补间动画、属性动画)讲解相关推荐

  1. Android—逐帧、补间、属性动画

    1.Tween Animation 补间动画 这类动画比较简单,一般就是平移.缩放.旋转.透明度,或者其组合,可以用代码或者xml文件的形式,推荐使用xml文件形式,因为可以复用. 四个动画效果实现类 ...

  2. Android动画学习记录一(Android动画种类、补间动画和帧动画)

    Android动画学习记录一(动画种类.补间动画和帧动画) 动画种类.补间动画和帧动画 Android动画学习记录一(动画种类.补间动画和帧动画) 一.动画种类 二.View动画 2.1 补间动画 补 ...

  3. Android中四种补间动画的使用示例(附代码下载)

    场景 Android中四种补间动画. 透明度渐变动画 旋转动画 缩放动画 平移动画 注: 博客: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的 ...

  4. 形状补间动画和动作补间动画区别一览表

    形状补间动画和动作补间动画区别一览表 项目 形状补间动画 动作补间动画 概念 在一个关键帧中绘制一个形状,然后在另外一个关键帧更改或绘制另一个形状,FLASH据二者间形状创建的动画 在一个关键帧中设置 ...

  5. Android动画学习之补间动画和逐帧动画,移动互联网app开发

    | fromXScale | 指定动画开始时X轴上的缩放系数 | 值为1.0表示不再变化 | | fromYScale | 指定动画开始时Y轴上的缩放系数 | 值为1.0表示不再变化 | | toXS ...

  6. Android动画学习之补间动画

    补间动画简介 补间动画指的是做FLASH动画时,在两个关键帧中间需要做"补间动画",才能实现图画的运动:插入补间动画后两个关键帧之间的插补帧是由计算机自动运算而得到的. 补间动画分 ...

  7. Android属性动画完全解析(上),初识属性动画的基本用法

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/43536355 在手机上去实现一些动画效果算是件比较炫酷的事情,因此Android系 ...

  8. Android属性动画完全解析(上),初识属性动画的基本用法(转)

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/43536355 在手机上去实现一些动画效果算是件比较炫酷的事情,因此Android系 ...

  9. An动画优化之补间形状与传统补间的优化

    文章目录 一.补间形状的优化 (1)准备工作 1)写字 2)画圆 3)标明 (2)创建关键帧及动画 1)创建关键帧 2)创建补间形状 3)改变速度 (3)效果 二.传统补间的优化 (1)准备工作 1) ...

  10. Android实现蝴蝶动画,蝴蝶飞舞- (补间动画+逐帧动画)

    AnimationDrawable animationDrawable; //逐帧动画 //移动蝴蝶位置的定时器 Timer tmrTranslate; TimerTask timerTask; Im ...

最新文章

  1. 汤家凤高等数学基础手写笔记-曲线与曲面积分
  2. 请问1到10000之前,有多少升数字?(华图教育面试题)
  3. java 数组冒泡排序、转置(降序)
  4. nn.Dataparallel pytorch 平行计算的两种方法
  5. 错误:readline/readline.h:没有那个文件或目录解决方法
  6. python的列表方法_Python列表的常用方法
  7. java如何处理tcp异常断开_(转)TCP连接异常断开检测
  8. 【代码优化】考虑使用静态工厂方法代替构造器
  9. C# Cron表达式解析 .net 项目文件
  10. minium环境配置——微信开发者工具
  11. Java软件开发修炼过程
  12. 文件太多,台式电脑迁移数据到笔记本怎么操作?
  13. 初见安~这里是樱狸的博客目录~
  14. python打开qq并登录_python爬虫入门之qq登陆初探
  15. 解决TypeError: conv2d() received an invalid combination of arguments
  16. CTF 关于linux 7z解压的一点trick
  17. 机械祭天法力无边:练习3.4:编写一段程序读入两个字符串,比较其是否相等并输出结果。如果不相等,输出较大的那个字符串。改写上述程序,比较输入的两个字符串是否等长,如果不等长,输出长度较大的那个字符串。
  18. 第四章 06 打印星号
  19. 计算机域是什么概念,什么是域?域的相关概念
  20. 机器学习sklearn 计算recall , precison , F1

热门文章

  1. 基于网络爬虫的技术实现
  2. vmware12安装教程
  3. 关于“PFC离散元仿真核心技术与应用”你想要了解的都在这
  4. 在将公司“一拆六”后,阿里巴巴未来将释放出哪些投资价值?
  5. mymps蚂蚁分类信息系统电子邮箱服务器配置教程
  6. 物联网 MQTT 协议
  7. Web前端面试指导 四 面试前准备-有备而去百战百胜
  8. mysql空间函数计算坐标距离
  9. PAN3031 双工无线通信 低功耗远距离无线收发芯片
  10. FPGA视觉从入门到放弃——懒人的支持向量机