如何将 FAB 转换为弹出菜单？答案

【问题标题】：How to transform a FAB into a popup menu?如何将 FAB 转换为弹出菜单？
【发布时间】：2018-01-04 17:07:43
【问题描述】：

根据material design guideline “浮动操作按钮可以转换为包含所有操作的单张材料”。

我想在不使用第三方库的情况下创建以下动画。

【问题讨论】：

你好。你达到你想要的了吗？如果你分享它会很酷（：

标签： android android-animation

【解决方案1】：

首先，您需要将动画分成小部分。在那个例子中，我可以推断出 3 个步骤：

点击事件触发的 FAB 上的波纹效果。
适用于 FAB 的左侧翻译。
应用于卡片的循环显示动画。

所以你需要创建一个 FAB (visible) 和一张卡片 (invisible)。初始位置的 FAB 和最后一个位置的卡。在触发 FAB 上的涟漪效果（第 1 步）并再次在 FAB 上移动事件结束时（第 2 步结束），您只需要关闭 FAB 并在卡上启动 Reveal 动画（第 3 步） .

要启动循环显示动画，只需调用ViewAnimationUtils.createCircularReveal 方法。传递您的卡片视图、X、Y 起始坐标、半径，仅此而已！困难肯定是找到每个动画之间的最佳持续时间和开始/结束坐标，以使其尽可能平滑。

如果您愿意，可以在这里查看我的帖子https://stackoverflow.com/a/41957295/1053880。我使用循环显示动画来创建两个工具栏之间的切换。您的代码的某些部分将与我的相似（最后我也恢复了我的动画）。

GitHub 上的示例项目

https://github.com/fbourlieux/android-material-circular_reveal_animation

希望对您有所帮助！

弗朗索瓦

有用的链接：

【讨论】：