有没有办法在支持库的FloatingActionButton
中为图标设置动画?我想在收件箱应用中为其设置动画,当您点击它时,它会从plus
转换为pencil
。
答案 0 :(得分:2)
执行此操作的最佳方法可能是使用AnimatedVectorDrawable
但在5.0之前不向后兼容。我通常只将两个FloatingActionButton
放在彼此的顶部,然后在旋转两个时淡出顶部的一个。{/ p>
例如,您可以将FloatingActionButton
两个FrameLayout
放入<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:layout_gravity="bottom|end|right">
<android.support.design.widget.FloatingActionButton
android:id="@id/fab_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/icon_edit"/>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/icon_add"/>
</FrameLayout>
,如下所示:
FloatingActionButton
FrameLayout
中的底部// This animation rotates and hides the top Button
final Animator hideTopFabAnimation = ObjectAnimator.ofPropertyValuesHolder(fabAdd,
PropertyValuesHolder.ofFloat(View.ALPHA, 1.0f, 0.0f),
PropertyValuesHolder.ofFloat(View.ROTATION, 0.0f, 360.0f)
);
// This animation just rotates the bottom Button while it is being revealed
final Animator revealBottomFabAnimation = ObjectAnimator.ofPropertyValuesHolder(fabEdit,
PropertyValuesHolder.ofFloat(View.ROTATION, 0.0f, 360.0f)
);
// This AnimatorSet combines both animations and also has a listener
// attached to set the visibility of the top Button to View.GONE when
// the animation is done so the user can actually click through to the
// lower Button
final AnimatorSet revealAnimation = new AnimatorSet();
revealAnimation.setInterpolator(new AccelerateDecelerateInterpolator());
revealAnimation.playTogether(
hideTopFabAnimation,
revealBottomFabAnimation
);
revealAnimation.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
fabAdd.setVisibility(View.GONE);
}
});
revealAnimation.start();
将位于另一个// Set the visibility of the top Button back to VISIBLE
fabAdd.setVisibility(View.VISIBLE);
// This animation fades the top Button back in and rotates it back
final Animator showTopFabAnimation = ObjectAnimator.ofPropertyValuesHolder(fabAdd,
PropertyValuesHolder.ofFloat(View.ALPHA, 0.0f, 1.0f),
PropertyValuesHolder.ofFloat(View.ROTATION, 360.0f, 0.0f)
);
// This animation just rotates the bottom Button while the top Button
// fades back in
final Animator hideBottomFabAnimation = ObjectAnimator.ofPropertyValuesHolder(fabEdit,
PropertyValuesHolder.ofFloat(View.ROTATION, 360.0f, 0.0f)
);
// Again we have an AnimatorSet which plays both animations together
final AnimatorSet hideAnimation = new AnimatorSet();
revealAnimation.setInterpolator(new AccelerateDecelerateInterpolator());
revealAnimation.playTogether(
showTopFabAnimation,
hideBottomFabAnimation
);
revealAnimation.start();
之上。然后,您可以旋转并淡出底部的一个,同时只旋转顶部的动画以创建类似于Google应用中的动画的动画,该动画将显示最顶层的动画。例如,您可以像这样实现动画:
US -> [X -> 55, Y -> 5 , Z -> 10, ...] as one object
UK -> [X -> 99, Y -> 1, Z -> 50, W-> 23, ...] as other object
要回到原来的状态,你只需要做相反的事情:
//structure to store a map of key/value for a key
Map<String, Map<String, Integer>> hashmap = new HashMap<String, Map<String, Integer>>();
//key/value map
Map<String, Integer> US = new HashMap<String, Integer>();
US.put("X", 1200);
US.put("Y", 50);
US.put("Z", 25552);
//can add any number, doesn't have to be three
Map<String, Integer> UK = new HashMap<String, Integer>();
UK.put("X", 222);
UK.put("Y", 52);
UK.put("Z", 18);
hashmap.put("USA", US);
hashmap.put("UK", UK);
//loop through main keys (i.e. US, UK, Africa, etc.)
for (String key : hashmap.keySet()) {
Map<String, Integer> temp = hashmap.get(key);
System.out.println("Calculating for " + key);
Integer sum = 0;
//for each key i.e. UK loop through its properties
for(String otherKey: temp.keySet()) {
sum = sum + temp.get(otherKey);
}
System.out.println("Sum for " + key + " is " + sum);
}