自Google推出Material Design设计规范之后，现在越来越多的App设计在参考它，Material Design中的FAB(Floating Action Button) 大家一定已经使用过了，那么，FloatingActionMenu呢？这篇文章就带大家一起来了解一下FloatingActionMenu以及它的使用。
1、 什么是FAB(Floating Action Button) ？
一个Floating Action Button（以下简称FAB）位于当前屏幕的最上层（覆盖于屏幕之上），用来执行最常见或者最重要的操作。它的UI表现形式为一个圆形容器和一个位于圆圈中心的icon。
1 ：圆形容器 2 ：Icon
FAB 有两种尺寸，标准和mini，按照Material Design标准规定，两种尺寸对应的size如下：
1、标准 (56 x 56dp) 2、Mini (40 x 40dp) 如下图所示：
FAB 既可以在当前界面触发一些动作，也可以执行一个动作去创建一个新的界面，比如：创建、编辑、收藏、分享、刷新等等操作，都可以使用FAB。
2、 FloatingActionMenu 的作用
有时候，FAB 并不能满足我们的需求，比如我们有2个或者3个比较关键的操作，也想用Floating Action Button 这种方式来实现，该怎么呢？这个时候FloatingActionMenu 就登场了。
FloatingActionMenu： 当我们点击FAB的时候，FAB 能发射出3-6个相关操作的菜单，如果超过了6个或者不足2个菜单，那么就不在适合使用FAB这种方式来实现了。
推荐使用FAB场景(2-6个)：
不推荐使用场景（操作不足2个或者多余6个）：
3、 FloatingActionMenu 实现
很遗憾，Material Design 虽然给出了FloatingActionMenu的设计规范，但是Google却没有给出官方的FAM控件。那如果想用，该怎么办呢？答案是：自己去实现啊。 看到这儿，估计你想骂娘了，这不是废话嘛。
别慌，骚年，这里已经有比较强大的三方实现库了，完全遵循Material Design设计，相当于官方控件。
1、 android-floating-action-button
Github: https://github.com/futuresimple/android-floating-action-button
android-floating-action-button 是基于MD规范实现的FloatingActionnu,有如下特性：
- 支持
常规和mini2种尺寸
- 自定义Button 常规、按压状态的背景色和Icon
-
可以在
xml添加菜单也可以在代码中添加菜单 -
有展开/收起2中状态
-
可以选择是否同时显示标签
-
可以向四个方向弹出菜单，上、下、左、右。
使用
dependencies { compile 'com.getbase:floatingactionbutton:1.10.1'}复制代码 如果想直接在xml 中添加FloatingActionButon 的话，直接写在FloatingActionsMenu标签内就好。FloatingActionsMenu 是一个自定义容器，继承自ViewGroup。
xml 中使用如下：
复制代码
代码中使用如下：
复制代码
通过findViewById()获取到FloatingActionsMenu之后,直接调用addButton方法。
FloatingActionButton buttonBW = new FloatingActionButton(context);buttonBW.setTitle(context.getResources().getString(R.string.tab_blood_weight));buttonBW.setIcon(R.drawable.floating_action_weight_icon);buttonBW.setSize(FloatingActionButton.SIZE_MINI);buttonBW.setColorNormal(context.getResources().getColor(R.color.white)); buttonBW.setColorPressed(context.getResources().getColor(R.color.white));buttonBW.setTag(TAG_BW); // 将button添加到FloatingActionMenumActionsMenu.addButton(button);复制代码
代码中可以控制展开或者收起：
if (mActionsMenu != null && mActionsMenu.isExpanded()) { mActionsMenu.collapse(); }复制代码 项目使用效果图：
总结：android-floating-action-button 基本满足90%的需求，只要是按照material design 规范设计来的，基本都能覆盖，但是如果设计师比较奇葩的话，想任意更改尺寸、阴影等等，那么就需要自己下载源码按照自己的需求更改。比如，在真实项目中需要在代码中改变+的颜色，需要自己修改源码：
/** * 代码中设置 + 的颜色 * * @param color */ public void setButtonPlusColor(@ColorInt int color) { mAddButtonPlusColor = color; if (mAddButton != null) { //removeButton(mAddButton); mAddButton.setPlusColor(color); } else { createAddButton(getContext()); invalidate(); } }复制代码 2、 开源库FloatingActionButton
Github:https://github.com/Clans/FloatingActionButton
这个库是在前面这个库android-floating-action-button的基础上修改的，增加了一些更强大和实用的特性。
特性：
-
Android 5.0 以上点击会有水波纹效果
-
可以选择自定义normal/pressed/ripple 的颜色
-
可以选择设置FAB的阴影和阴影的大小
-
可以选择取消标签和按钮的阴影
-
可以自定义动画
-
可以自定义Icon
-
按钮支持
56dp标准尺寸和40dp的mini尺寸 -
可以自定义 FloatingActionMenu icon 动画
-
菜单支持从上到下或者从下到上
-
标签可以显示在左边或者右边
-
可以为
FloactinActionButton显示进度 -
可以在代码中为
FloatingActionMenu添加按钮
使用
dependencies { compile 'com.github.clans:fab:1.6.4'}复制代码 xml 中添加：
复制代码
FloatingActionMenu 的一些自定义属性：
复制代码
效果图：
3、总结
这个两个库都非常优秀，遵循Material Design设计规范，动画效果很酷，使用简单。FloatingActionButton是对android-floating-action-button的扩展，功能更加强大，但是实现也要复杂一些。如果你要自己修改源码，android-floating-action-button更好一点，逻辑简单。需要使用哪一个根据自己的需求选择就好。
Material Design 系列文章：
