Android App开发动画特效中插值器和估值器的讲解以及利用估值器实现弹幕动画实战(附源码和演示视频 可直接使用)
创始人
2024-02-04 17:16:46

需要图片集和源码请点赞关注收藏后评论区留言~~~

一、插值器和估值器

插值器用来控制属性值的变化速率,也可以理解为动画播放的速度,默认是先加速再减速。若要给动画播放指定某种速率形式,调用setInterpolator方法设置对应的插值器实现类即可,无论是补间动画,集合动画,属性动画还是属性动画组合,都可以设置插值器。

估值器专用于属性动画,主要描述该属性的数值变化要采用什么单位,比如整数类型的渐变数值要取整,颜色的渐变数值为ARGB格式的颜色对象,矩形的渐变数值为Rect对象等等。要给属性动画设置估值器,调用属性动画对象的setEvaluator方法即可。

一般情况下 无须单独设置属性动画的估值器,使用系统默认的估值器即可。

演示效果如下 可以在下拉框中选择不同的演示效果

演示视频已上传至个人主页  有需要可自行前往观看

插值器和估值器演示

 

 

 代码如下

Java类

package com.example.animation;import android.animation.Animator;
import android.animation.Animator.AnimatorListener;
import android.animation.ArgbEvaluator;
import android.animation.FloatEvaluator;
import android.animation.ObjectAnimator;
import android.animation.RectEvaluator;
import android.graphics.Color;
import android.graphics.Rect;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import android.view.View;
import android.view.animation.AccelerateInterpolator;
import android.view.animation.BounceInterpolator;
import android.view.animation.DecelerateInterpolator;
import android.view.animation.LinearInterpolator;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.TextView;public class InterpolatorActivity extends AppCompatActivity implements AnimatorListener {private TextView tv_interpolator; // 声明一个图像视图对象private ObjectAnimator animAcce, animDece, animLinear, animBounce; // 声明四个属性动画对象@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_interpolator);tv_interpolator = findViewById(R.id.tv_interpolator);initObjectAnim(); // 初始化属性动画initInterpolatorSpinner(); // 初始化插值器类型的下拉框}// 初始化插值器类型的下拉框private void initInterpolatorSpinner() {ArrayAdapter interpolatorAdapter = new ArrayAdapter<>(this,R.layout.item_select, interpolatorArray);Spinner sp_interpolator = findViewById(R.id.sp_interpolator);sp_interpolator.setPrompt("请选择插值器类型");sp_interpolator.setAdapter(interpolatorAdapter);sp_interpolator.setOnItemSelectedListener(new InterpolatorSelectedListener());sp_interpolator.setSelection(0);}private String[] interpolatorArray = {"背景色+加速插值器+颜色估值器", "旋转+减速插值器+浮点型估值器","裁剪+匀速插值器+矩形估值器", "文字大小+震荡插值器+浮点型估值器"};class InterpolatorSelectedListener implements OnItemSelectedListener {public void onItemSelected(AdapterView arg0, View arg1, int arg2, long arg3) {showInterpolator(arg2); // 根据插值器类型展示属性动画}public void onNothingSelected(AdapterView arg0) {}}// 初始化属性动画private void initObjectAnim() {// 构造一个在背景色上变化的属性动画animAcce = ObjectAnimator.ofInt(tv_interpolator, "backgroundColor", Color.RED, Color.GRAY);// 给属性动画设置加速插值器animAcce.setInterpolator(new AccelerateInterpolator());// 给属性动画设置颜色估值器animAcce.setEvaluator(new ArgbEvaluator());// 构造一个围绕中心点旋转的属性动画animDece = ObjectAnimator.ofFloat(tv_interpolator, "rotation", 0f, 360f);// 给属性动画设置减速插值器animDece.setInterpolator(new DecelerateInterpolator());// 给属性动画设置浮点型估值器animDece.setEvaluator(new FloatEvaluator());// 构造一个在文字大小上变化的属性动画animBounce = ObjectAnimator.ofFloat(tv_interpolator, "textSize", 20f, 60f);// 给属性动画设置震荡插值器animBounce.setInterpolator(new BounceInterpolator());// 给属性动画设置浮点型估值器animBounce.setEvaluator(new FloatEvaluator());}// 根据插值器类型展示属性动画private void showInterpolator(int type) {ObjectAnimator anim = null;if (type == 0) { // 背景色+加速插值器+颜色估值器anim = animAcce;} else if (type == 1) { // 旋转+减速插值器+浮点型估值器anim = animDece;} else if (type == 2) { // 裁剪+匀速插值器+矩形估值器int width = tv_interpolator.getWidth();int height = tv_interpolator.getHeight();// 构造一个从四周向中间裁剪的属性动画,同时指定了矩形估值器RectEvaluatoranimLinear = ObjectAnimator.ofObject(tv_interpolator, "clipBounds",new RectEvaluator(), new Rect(0, 0, width, height),new Rect(width / 3, height / 3, width / 3 * 2, height / 3 * 2),new Rect(0, 0, width, height));// 给属性动画设置匀速插值器animLinear.setInterpolator(new LinearInterpolator());anim = animLinear;} else if (type == 3) { // 文字大小+震荡插值器+浮点型估值器anim = animBounce;// 给属性动画添加动画事件监听器。目的是在动画结束时恢复文字大小anim.addListener(this);}anim.setDuration(2000); // 设置动画的播放时长anim.start(); // 开始播放属性动画}// 在属性动画开始播放时触发@Overridepublic void onAnimationStart(Animator animation) {}// 在属性动画结束播放时触发@Overridepublic void onAnimationEnd(Animator animation) {if (animation.equals(animBounce)) { // 震荡动画// 构造一个在文字大小上变化的属性动画ObjectAnimator anim = ObjectAnimator.ofFloat(tv_interpolator, "textSize", 60f, 20f);// 给属性动画设置震荡插值器anim.setInterpolator(new BounceInterpolator());// 给属性动画设置浮点型估值器anim.setEvaluator(new FloatEvaluator());anim.setDuration(2000); // 设置动画的播放时长anim.start(); // 开始播放属性动画}}// 在属性动画取消播放时触发@Overridepublic void onAnimationCancel(Animator animation) {}// 在属性动画重复播放时触发@Overridepublic void onAnimationRepeat(Animator animation) {}}

XML文件

二、利用估值器实现弹幕动画

弹幕想必大家都不陌生,虽然弹幕效果可以使用平移动画实现,但是平移动画比较单调,而且只能控制位移不能控制速率,文字大小,文字颜色等要素,想同时操纵视图的多种属性要素的时候,需要采用属性动画加以实现 分为以下三步

1:定义一个间距估值器

2:调用ValueAnimator类的ofObject方法 

3:调用属性动画对象的addUpdateListenter方法设置刷新监听器

效果如下 点击添加评论按钮就会添加弹幕数量

演示视频已上传至个人主页 有需要可自行观看

弹幕动画

 

 

 

 代码如下

Java类

package com.example.animation;import androidx.appcompat.app.AppCompatActivity;import android.os.Bundle;import com.example.animation.widget.BarrageView;import java.util.Random;public class BarrageActivity extends AppCompatActivity {private String[] mCommentArray = {"武夷山", "仙霞岭", "阿里山", "白云山", "九华山","长白山", "峨眉山", "五台山", "太白山", "昆仑山","六盘山", "乌蒙山", "井冈山", "武当山", "普陀山","祁连山", "贺兰山", "太行山", "双鸭山", "五指山"};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_barrage);BarrageView bv_comment = findViewById(R.id.bv_comment);findViewById(R.id.btn_comment).setOnClickListener(v -> {String comment = mCommentArray[new Random().nextInt(20)];bv_comment.addComment(comment); // 给弹幕视图添加评论});}
}

XML文件

创作不易 觉得有帮助请点赞关注收藏~~~

相关内容

热门资讯

埃菲尔铁塔在哪 中国仿建埃菲尔... 2019年4月26日,广西南宁市,街头惊现一座巨型山寨版埃菲尔铁塔,高约20米,白色塔身,造型逼真,...
北京的名胜古迹 北京最著名的景... 北京从元代开始,逐渐走上帝国首都的道路,先是成为大辽朝五大首都之一的南京城,随着金灭辽,金代从海陵王...
苗族的传统节日 贵州苗族节日有... 【岜沙苗族芦笙节】岜沙,苗语叫“分送”,距从江县城7.5公里,是世界上最崇拜树木并以树为神的枪手部落...
猫咪吃了塑料袋怎么办 猫咪误食... 你知道吗?塑料袋放久了会长猫哦!要说猫咪对塑料袋的喜爱程度完完全全可以媲美纸箱家里只要一有塑料袋的响...
长白山自助游攻略 吉林长白山游... 昨天介绍了西坡的景点详细请看链接:一个人的旅行,据说能看到长白山天池全凭运气,您的运气如何?今日介绍...
应用未安装解决办法 平板应用未... ---IT小技术,每天Get一个小技能!一、前言描述苹果IPad2居然不能安装怎么办?与此IPad不...
脚上的穴位图 脚面经络图对应的... 人体穴位作用图解大全更清晰直观的标注了各个人体穴位的作用,包括头部穴位图、胸部穴位图、背部穴位图、胳...
demo什么意思 demo版本... 618快到了,各位的小金库大概也在准备开闸放水了吧。没有小金库的,也该向老婆撒娇卖萌服个软了,一切只...
世界上最漂亮的人 世界上最漂亮... 此前在某网上,选出了全球265万颜值姣好的女性。从这些数量庞大的女性群体中,人们投票选出了心目中最美...
埃菲尔铁塔在哪 中国仿建埃菲尔... 2019年4月26日,广西南宁市,街头惊现一座巨型山寨版埃菲尔铁塔,高约20米,白色塔身,造型逼真,...
苗族的传统节日 贵州苗族节日有... 【岜沙苗族芦笙节】岜沙,苗语叫“分送”,距从江县城7.5公里,是世界上最崇拜树木并以树为神的枪手部落...
北京的名胜古迹 北京最著名的景... 北京从元代开始,逐渐走上帝国首都的道路,先是成为大辽朝五大首都之一的南京城,随着金灭辽,金代从海陵王...
长白山自助游攻略 吉林长白山游... 昨天介绍了西坡的景点详细请看链接:一个人的旅行,据说能看到长白山天池全凭运气,您的运气如何?今日介绍...