Java 单击制作晶圆厂动画(放大/缩小)
我试图模仿动画和以下浮动动作按钮的颜色变化 浮动动作按钮的工作方式是白色为off,蓝色为on 然而,我一直不成功的动画和改变颜色 这些都是我在做这件事的尝试,正如你所看到的,我已经注释掉了我尝试过的所有不同的方法 这是我的代码:Java 单击制作晶圆厂动画(放大/缩小),java,android,animation,android-animation,floating-action-button,Java,Android,Animation,Android Animation,Floating Action Button,我试图模仿动画和以下浮动动作按钮的颜色变化 浮动动作按钮的工作方式是白色为off,蓝色为on 然而,我一直不成功的动画和改变颜色 这些都是我在做这件事的尝试,正如你所看到的,我已经注释掉了我尝试过的所有不同的方法 这是我的代码: @SuppressWarnings("unused") @OnClick(R.id.fabMovieFavourite) public void addMovieFavourite(View view) { /* final An
@SuppressWarnings("unused")
@OnClick(R.id.fabMovieFavourite)
public void addMovieFavourite(View view) {
/* final Animator animator = AnimatorInflater.loadAnimator(getActivity(), R.animator.add_favourite_movie);
animator.setTarget(view);)
animator.start();
*/
/*
AnimatorSet animatorSet = new AnimatorSet();
PropertyValuesHolder propertyValuesHolderX = PropertyValuesHolder.ofFloat(View.SCALE_X, 1.1f);
PropertyValuesHolder propertyValuesHolderY = PropertyValuesHolder.ofFloat(View.SCALE_Y, 1.1f);
ObjectAnimator objectAnimator = ObjectAnimator.ofPropertyValuesHolder(view, propertyValuesHolderX, propertyValuesHolderY);
objectAnimator.setDuration(300);
objectAnimator.setInterpolator(new OvershootInterpolator(10f));
*/
/*
objectAnimator.setRepeatCount(1);
objectAnimator.setRepeatMode(ObjectAnimator.REVERSE);
*/
/*
PropertyValuesHolder propertyValuesHolderX2 = PropertyValuesHolder.ofFloat(View.SCALE_X, 0.9f);
PropertyValuesHolder propertyValuesHolderY2 = PropertyValuesHolder.ofFloat(View.SCALE_Y, 0.9f);
ObjectAnimator objectAnimator2 = ObjectAnimator.ofPropertyValuesHolder(view, propertyValuesHolderX2, propertyValuesHolderY2);
objectAnimator.setDuration(300);
objectAnimator2.setInterpolator(new OvershootInterpolator(10f));
animatorSet.playSequentially(objectAnimator, objectAnimator2);
objectAnimator.start();
*/
// view.BackgroundTintList(ContextCompat.getColorStateList(getContext(), R.color.primary));
//view.setBackgroundColor(ContextCompat.getColor(getActivity(), R.color.primary));
if(Build.VERSION.SDK_INT > Build.VERSION_CODES.LOLLIPOP) {
Timber.d("start translationZ");
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(view, View.TRANSLATION_Z, 12f);
objectAnimator.setDuration(300);
objectAnimator.setInterpolator(new OvershootInterpolator(10f));
objectAnimator.setTarget(view);
objectAnimator.start();
}
}
非常感谢您的建议。本动画分为两个阶段。第一个缩放X轴和Y轴,第二个缩小。因此,我们可以将它们分成两个
AnimatorSet
s并按顺序播放
动画的关键是为第二个AnimatorSet
找到合适的插值器,因为它不是标准的插值器
请看,我们希望fab先过冲,然后过冲,最后在动画中达到指定的值
幸运的是,有一个非常方便的PathInterpolator
,它将使用提供的Path
为我们创建一个插值器
Path path = new Path();
path.moveTo(0.0f, 0.0f);
path.lineTo(0.5f, 1.3f);
path.lineTo(0.75f, 0.8f);
path.lineTo(1.0f, 1.0f);
PathInterpolator pathInterpolator = new PathInterpolator(path);
那么,让我们创建第一个动画:
final float from = 1.0f;
final float to = 1.3f;
ObjectAnimator scaleX = ObjectAnimator.ofFloat(fab, View.SCALE_X, from, to);
ObjectAnimator scaleY = ObjectAnimator.ofFloat(fab, View.SCALE_Y, from, to);
ObjectAnimator translationZ = ObjectAnimator.ofFloat(fab, View.TRANSLATION_Z, from, to);
AnimatorSet set1 = new AnimatorSet();
set1.playTogether(scaleX, scaleY, translationZ);
set1.setDuration(100);
set1.setInterpolator(new AccelerateInterpolator());
set1.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
fab.setImageResource(isActive ? R.drawable.heart_active : R.drawable.heart_passive);
fab.setBackgroundTintList(ColorStateList.valueOf(isActive ? colorActive : colorPassive));
isActive = !isActive;
}
});
我们正在缩放x和y。此外,我们正在更改z平移以获得适当的阴影效果。当动画结束时,我们希望更改晶圆厂的状态(心脏和晶圆厂背景的颜色)
现在,让我们创建一个动画,让我们回到原点:
ObjectAnimator scaleXBack = ObjectAnimator.ofFloat(fab, View.SCALE_X, to, from);
ObjectAnimator scaleYBack = ObjectAnimator.ofFloat(fab, View.SCALE_Y, to, from);
ObjectAnimator translationZBack = ObjectAnimator.ofFloat(fab, View.TRANSLATION_Z, to, from);
AnimatorSet set2 = new AnimatorSet();
set2.playTogether(scaleXBack, scaleYBack, translationZBack);
set2.setDuration(300);
set2.setInterpolator(pathInterpolator);
在这里,我们使用了前面创建的pathInterpolator
我们希望按顺序播放这两个AnimatorSet
s:
final AnimatorSet set = new AnimatorSet();
set.playSequentially(set1, set2);
set.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
fab.setClickable(true);
}
@Override
public void onAnimationStart(Animator animation) {
fab.setClickable(false);
}
});
此外,我们希望禁用对晶圆厂的点击,同时动画它。因此,我们将根据动画状态打开/关闭它
最后,我们在单击时启动动画:
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
set.start();
}
});
结果:
我会尝试使用两个晶圆厂。淡出并隐藏一个,而淡入并显示另一个。@AngelKoh我正在寻找一个解决方案,只使用1fab@ant2009我在图书馆的帮助下完成了这件事如果你想实现这个…我可以帮助…它…@PN10谢谢,我会看一看的,如果不是我见过的最好的动画设置。谢谢你用这么长的篇幅来回答这个问题,这是一个很大的帮助。嘿@azizbekian你能帮我吗?上面的代码在lolipop和以上设备上运行良好,但在kitkat中不工作