FloatingActionButton 图标动画(Android FAB src 可绘制动画)
FloatingActionButton icon animation (Android FAB src drawable animation)
我试图找到有关如何创建 FAB(设计支持库)的图标动画的文档,搜索了一段时间后我找不到任何关于它的信息和 android 中的 AnimationDrawable 参考即使 class 是 ImageView 的子项,开发人员也不会为 FAB 工作。
但设法找到了一个工作正常的解决方法。
我使用的技术与 DrawableAnimation documentation, and using the Property Animation API 文档中公开的技术相似。
首先,我使用 ValueAnimator class 和一个包含您将在动画中使用的可绘制对象 ID 的 int 数组。
final int[] ids = {R.drawable.main_button_1,R.drawable.main_button_2,R.drawable.main_button_3,R.drawable.main_button_4,R.drawable.main_button_5,R.drawable.main_button_6, R.drawable.main_button_7};
fab = (FloatingActionButton) findViewById(R.id.yourFabID);
valueAnimator = ValueAnimator.ofInt(0, ids.length - 1).setDuration(yourAnimationTime);
valueAnimator.setInterpolator( new LinearInterpolator() /*your TimeInterpolator*/ );
然后设置一个AnimationUpdateListener,并使用FloatinActionButton.setImageDrawable(Drawable yourDrawable)方法定义图标行为的变化。
但是 ValueAnimator 默认情况下更新每个可用帧(取决于硬件负载),但是如果已经绘制了图标,我们不需要重新绘制图标,所以这就是为什么我使用变量 "i";所以每个图标只绘制一次。 (时间取决于您定义的插值器)
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
int i = -1;
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int animatedValue = (int) animation.getAnimatedValue();
if(i!=animatedValue) {
fab.setImageDrawable(getResources().getDrawable(ids[animatedValue]));
i = animatedValue;
}
}
});
此实现允许您使用 ValueAnimator.reverse();
方法向后播放动画
我知道这不是一个专业的解决方案,但它是我想出的唯一一个可以处理所有 API 支持 PropertyAnimation 的解决方案。请,如果你知道更好的解决方案 post 就在这里,如果不知道我希望这个 post 对你有帮助
您可以实现 FAB 的 src 可绘制动画,这与使用 background
用于 AnimationDrawable
的其他视图非常相似。
有关一般视图的背景可绘制动画,请参阅Use AnimationDrawable。
但是,您不能调用 getBackground()
来获取 FAB 的 src
。
而是使用 getDrawable()
。
示例:
FloatingActionButton loginButton = findViewById(R.id.loginButton);
loginAnimation = (AnimationDrawable) loginButton.getDrawable();
loginButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
loginAnimation.start();
}
});
我试图找到有关如何创建 FAB(设计支持库)的图标动画的文档,搜索了一段时间后我找不到任何关于它的信息和 android 中的 AnimationDrawable 参考即使 class 是 ImageView 的子项,开发人员也不会为 FAB 工作。
但设法找到了一个工作正常的解决方法。
我使用的技术与 DrawableAnimation documentation, and using the Property Animation API 文档中公开的技术相似。
首先,我使用 ValueAnimator class 和一个包含您将在动画中使用的可绘制对象 ID 的 int 数组。
final int[] ids = {R.drawable.main_button_1,R.drawable.main_button_2,R.drawable.main_button_3,R.drawable.main_button_4,R.drawable.main_button_5,R.drawable.main_button_6, R.drawable.main_button_7};
fab = (FloatingActionButton) findViewById(R.id.yourFabID);
valueAnimator = ValueAnimator.ofInt(0, ids.length - 1).setDuration(yourAnimationTime);
valueAnimator.setInterpolator( new LinearInterpolator() /*your TimeInterpolator*/ );
然后设置一个AnimationUpdateListener,并使用FloatinActionButton.setImageDrawable(Drawable yourDrawable)方法定义图标行为的变化。
但是 ValueAnimator 默认情况下更新每个可用帧(取决于硬件负载),但是如果已经绘制了图标,我们不需要重新绘制图标,所以这就是为什么我使用变量 "i";所以每个图标只绘制一次。 (时间取决于您定义的插值器)
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
int i = -1;
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int animatedValue = (int) animation.getAnimatedValue();
if(i!=animatedValue) {
fab.setImageDrawable(getResources().getDrawable(ids[animatedValue]));
i = animatedValue;
}
}
});
此实现允许您使用 ValueAnimator.reverse();
我知道这不是一个专业的解决方案,但它是我想出的唯一一个可以处理所有 API 支持 PropertyAnimation 的解决方案。请,如果你知道更好的解决方案 post 就在这里,如果不知道我希望这个 post 对你有帮助
您可以实现 FAB 的 src 可绘制动画,这与使用 background
用于 AnimationDrawable
的其他视图非常相似。
有关一般视图的背景可绘制动画,请参阅Use AnimationDrawable。
但是,您不能调用 getBackground()
来获取 FAB 的 src
。
而是使用 getDrawable()
。
示例:
FloatingActionButton loginButton = findViewById(R.id.loginButton);
loginAnimation = (AnimationDrawable) loginButton.getDrawable();
loginButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
loginAnimation.start();
}
});