需要图片集和源码请点赞关注收藏后评论区留言~~~
一、插值器和估值器
插值器用来控制属性值的变化速率,也可以理解为动画播放的速度,默认是先加速再减速。若要给动画播放指定某种速率形式,调用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; // 声明四个属性动画对象
@Override
protected 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<String> 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();
// 构造一个从四周向中间裁剪的属性动画,同时指定了矩形估值器RectEvaluator
animLinear = 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(); // 开始播放属性动画
}
// 在属性动画开始播放时触发
@Override
public void onAnimationStart(Animator animation) {}
// 在属性动画结束播放时触发
@Override
public 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(); // 开始播放属性动画
}
}
// 在属性动画取消播放时触发
@Override
public void onAnimationCancel(Animator animation) {}
// 在属性动画重复播放时触发
@Override
public void onAnimationRepeat(Animator animation) {}
}
XML文件
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="插值器类型:"
android:textColor="@color/black"
android:textSize="17sp" />
<Spinner
android:id="@+id/sp_interpolator"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"
android:spinnerMode="dialog" />
</LinearLayout>
<TextView
android:id="@+id/tv_interpolator"
android:layout_width="match_parent"
android:layout_height="200dp"
android:gravity="center"
android:background="@color/gold"
android:text="看看插值器的效果是什么"
android:textColor="@color/black"
android:textSize="20sp" />
</LinearLayout>
二、利用估值器实现弹幕动画
弹幕想必大家都不陌生,虽然弹幕效果可以使用平移动画实现,但是平移动画比较单调,而且只能控制位移不能控制速率,文字大小,文字颜色等要素,想同时操纵视图的多种属性要素的时候,需要采用属性动画加以实现 分为以下三步
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 = {"武夷山", "仙霞岭", "阿里山", "白云山", "九华山",
"长白山", "峨眉山", "五台山", "太白山", "昆仑山",
"六盘山", "乌蒙山", "井冈山", "武当山", "普陀山",
"祁连山", "贺兰山", "太行山", "双鸭山", "五指山"};
@Override
protected 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文件
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.example.animation.widget.BarrageView
android:id="@+id/bv_comment"
android:layout_width="match_parent"
android:layout_height="200dp" />
<Button
android:id="@+id/btn_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="添加评论"
android:textColor="@color/black"
android:textSize="17sp" />
</LinearLayout>
创作不易 觉得有帮助请点赞关注收藏~~~