安卓：浮动操作按钮内部的详细动画

Question

我正在尝试熟悉Android Lollipop的新设计指南。所以特别是对于动画，我尝试实现像这些详细的图标或按钮动画：http://www.google.com/design/spec/animation/delightful-details.html

我想知道他们是怎么做到的？

在我的特殊情况下，我有一个浮动操作按钮，用于将物品放入购物车中。用户按下该按钮后，我想要动画显示该按钮内的图标可绘制对象。动画应具有滑动效果，其中购物车从按钮底部移出，而勾选标记则从按钮顶部移入。

我找到了一个ViewFlipper (http://www.inter-fuser.com/2009/07/android-transistions-slide-in-and-slide.html)，但我想保持按钮的位置，只动画按钮内的图标。

另一方面，我发现AnimationDrawables (http://developer.android.com/reference/android/graphics/drawable/AnimationDrawable.html)，但在那里，我必须手动创建每个帧，这也很奇怪。

实现这个最好的方法是什么？

- Denis Loh

---

你已经有了布局吗？ - Danil Onyanov

最好自己创建一个fab按钮。使用CardView，通过corner属性使其变圆。确保它的宽度和高度相等。然后给cardElevetion，现在你的cardview将会浮动。添加一个ImageView，然后给CardView一些填充，这样你就可以看到类似于FAB的东西。现在你可以根据自己的需要在CardView内部对ImageView进行动画处理。在动画结束时，你可以更改ImageView的图标。 - Muhammad Adil

Answer 1

我想知道现在是否支持 fab，但是你总可以自己创建。

创建包含图像视图的自定义线性布局。使其类似于 FAB round。然后，您可以查看此动画 examples。

希望能有所帮助，编码愉快。

- ralphgabb

Answer 2

你可以使用帧动画： 创建15-20个帧来制作所需的动画。 创建一个动画列表可绘制对象，例如animation_list.xml:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true">
<item
    android:duration="50"
    android:drawable="@drawable/frame_01"/>
<item
    android:duration="50"
    android:drawable="@drawable/frame_02"/>
<item
    android:duration="50"
    android:drawable="@drawable/frame_03"/>
<item
    android:duration="50"
    android:drawable="@drawable/frame_04"/>
<item
    android:duration="50"
    android:drawable="@drawable/frame_05"/>
<item
    android:duration="50"
    android:drawable="@drawable/frame_06"/></animation-list>

然后将此可绘制对象作为自定义FAB中的src。 现在，您可以通过逐帧动画开始框架（当FAB动画完成时）：

ImageView mImageViewFilling = (ImageView) findViewById(R.id.animated_imageview);
((AnimationDrawable) mImageViewFilling.getBackground()).start();

- Santacrab