浮动按钮的弹出菜单动画

将几个按钮重叠摆放,使用ValueAnimator更新按钮的坐标实现。

布局

<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"> <android.support.design.widget.FloatingActionButton
android:id="@+id/float_btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="20dp"
android:layout_marginEnd="10dp"
android:src="@mipmap/fav_2"
app:elevation="5dp"
app:fabSize="normal" /> <android.support.design.widget.FloatingActionButton
android:id="@+id/float_btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="20dp"
android:layout_marginEnd="10dp"
android:src="@mipmap/idea"
app:elevation="5dp"
app:fabSize="normal" /> <android.support.design.widget.FloatingActionButton
android:id="@+id/float_btn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="20dp"
android:layout_marginEnd="10dp"
android:src="@mipmap/faxian"
app:elevation="5dp"
app:fabSize="normal" /> <android.support.design.widget.FloatingActionButton
android:id="@+id/float_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="20dp"
android:layout_marginEnd="10dp"
android:src="@mipmap/menu"
app:elevation="5dp"
app:fabSize="normal" /> </FrameLayout>

控制

private FloatingActionButton actionButton, actionButton1, actionButton2, actionButton3;
private boolean menuOpen = false;
private void showMenu() {
menuOpen = true;
int x = (int) actionButton.getX();
int y = (int) actionButton.getY();
ValueAnimator v1 = ValueAnimator.ofInt(x, x - DISTANCE);
v1.setDuration(500);
v1.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int l = (int) animation.getAnimatedValue();
int t = (int) actionButton1.getY();
int r = actionButton1.getWidth() + l;
int b = actionButton1.getHeight() + t;
actionButton1.layout(l, t, r, b);
}
});
ValueAnimator v2x = ValueAnimator.ofInt(x, x - DISTANCE2);
ValueAnimator v2y = ValueAnimator.ofInt(y, y - DISTANCE2);
v2x.setDuration(500).addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int l = (int) animation.getAnimatedValue();
int t = (int) actionButton2.getY();
int r = actionButton2.getWidth() + l;
int b = actionButton2.getHeight() + t;
actionButton2.layout(l, t, r, b);
}
});
v2y.setDuration(500).addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int t = (int) animation.getAnimatedValue();
int l = (int) actionButton2.getX();
int r = actionButton2.getWidth() + l;
int b = actionButton2.getHeight() + t;
actionButton2.layout(l, t, r, b);
}
});
ValueAnimator v3 = ValueAnimator.ofInt(y, y - DISTANCE);
v3.setDuration(500).addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int t = (int) animation.getAnimatedValue();
int l = (int) actionButton3.getX();
int r = actionButton3.getWidth() + l;
int b = actionButton3.getHeight() + t;
actionButton3.layout(l, t, r, b);
}
});
v1.start();
v2x.start();
v2y.start();
v3.start();
} private void hideMenu() {
menuOpen = false;
int x = (int) actionButton1.getX();
ValueAnimator v1 = ValueAnimator.ofInt(x, (int) actionButton.getX());
v1.setDuration(500);
v1.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int l = (int) animation.getAnimatedValue();
int t = (int) actionButton1.getY();
int r = actionButton1.getWidth() + l;
int b = actionButton1.getHeight() + t;
actionButton1.layout(l, t, r, b);
}
});
x = (int) actionButton2.getX();
int y = (int) actionButton2.getY();
ValueAnimator v2x = ValueAnimator.ofInt(x, (int) actionButton.getX());
ValueAnimator v2y = ValueAnimator.ofInt(y, (int) actionButton.getY());
v2x.setDuration(500).addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int l = (int) animation.getAnimatedValue();
int t = (int) actionButton2.getY();
int r = actionButton2.getWidth() + l;
int b = actionButton2.getHeight() + t;
actionButton2.layout(l, t, r, b);
}
});
v2y.setDuration(500).addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int t = (int) animation.getAnimatedValue();
int l = (int) actionButton2.getX();
int r = actionButton2.getWidth() + l;
int b = actionButton2.getHeight() + t;
actionButton2.layout(l, t, r, b);
}
});
y = (int) actionButton3.getY();
ValueAnimator v3 = ValueAnimator.ofInt(y, (int) actionButton.getY());
v3.setDuration(500).addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int t = (int) animation.getAnimatedValue();
int l = (int) actionButton3.getX();
int r = actionButton3.getWidth() + l;
int b = actionButton3.getHeight() + t;
actionButton3.layout(l, t, r, b);
}
});
v1.start();
v2x.start();
v2y.start();
v3.start();
}

FloatActionButton弹出菜单的更多相关文章

  1. 向上弹出菜单jQuery插件

    插件名:柯乐义英文名:Keleyijs文件名称:jquery.keleyi.js插件功能:该插件可以让你轻易地在页面上构建一个向上弹出的二级菜单. 示例查看:http://keleyi.com/kel ...

  2. html5手机端遮罩弹出菜单代码

    效果体验:http://hovertree.com/texiao/html5/17/ 效果图: 代码如下: <!doctype html> <html lang="zh&q ...

  3. DIV+CSS制作二级横向弹出菜单,略简单

    没有使用JavaScript控制二级菜单的显示,结果如上图所示. 代码如下: <!DOCTYPE html> <html> <head> <meta char ...

  4. vc++ 如何添加右键弹出菜单

    一.创建新工程 二.编辑菜单资源 1.添加菜单 按"Ctrl+R",双击"Menu"图标 2.于菜单编辑器内编辑菜单 四.添加代码(红色部分) void CCM ...

  5. 创建 iPhone/iOS8 弹出菜单(窗口)

    基本步骤 添加视图:主视图与弹出视图 关联视图 配置弹出视图 编码实现:弹出菜单样式及控制器委托 override func prepareForSegue(segue: UIStoryboardSe ...

  6. android 单选、多选弹出菜单

    菜单单选窗口: import android.app.Activity;import android.app.AlertDialog;import android.content.DialogInte ...

  7. [Flex] PopUpButton系列 —— 弹出菜单的行高设置

    <?xml version="1.0" encoding="utf-8"?> <!--Flex中如何通过variableRowHeight样式 ...

  8. [Flex] PopUpButton系列 —— 控制弹出菜单的透明度、可用、可选择状态

    <?xml version="1.0" encoding="utf-8"?><!--控制弹出菜单的透明度.可用.可选择状态 PopUpButt ...

  9. [Flex] PopUpButton系列 —— 设置弹出菜单与主按钮之间的间隔

    <?xml version="1.0" encoding="utf-8"?><!--设置弹出菜单与主按钮之间的间隔 PopUpButtonPo ...

随机推荐

  1. ORACLE 11g 导出数据

    ORACLE 11g 导出 表的时候 不会导出空表 导出空表操作步骤 :(使用PLSQL) 1.打开SQL window 执行下面的 SQL Select 'alter table '||table_ ...

  2. (转)基于MVC4+EasyUI的Web开发框架经验总结(4)--使用图表控件Highcharts

    http://www.cnblogs.com/wuhuacong/p/3736564.html 在我们做各种应用的时候,我们可能都会使用到图表统计,以前接触过一些不同的图表控件,在无意中发现了图表控件 ...

  3. JS 封装一个求n~m的求和函数

    var a = 0;    cc(2,10);    function cc(n,m){        for(var i =n;i<(m+1);i++){            a = a + ...

  4. Codeforces Round #471 (Div. 2)B. Not simply beatiful strings

    Let's call a string adorable if its letters can be realigned in such a way that they form two conseq ...

  5. WEBGL学习【十四】利用HUD技术在网页上方显示三维物体

    关键点: <!--实现原理:要保证这两个canvas相互重叠;z-index表示了两个画布的上下层关系--> <!--是WEBGL的三维图形Canvas(主要用于绘制三维场景)--& ...

  6. [NoiPlus2016]天天爱跑步

    巨坑 树剖学的好啊!---sfailsth 把一段路径拆成两段,向上和S->LCA,向下LCA->T 用维护重链什么的操作搞一下. sfailsth学长真不容易啊...考场上rush了4. ...

  7. 备份/还原mysql数据库

    有木有遇到过这种情况?电脑或者服务器需要重装系统?可是你电脑上存着n多个网站的数据库,怎么办?把数据库文件夹拷贝出来,重装系统之后再拷回去?如果你使用了InnoDB引擎,恐怕那样做会出麻烦的,一个一个 ...

  8. redis 零散知识

    1.单线程 2.默认 16 个库.0~15 3.select :切换数据库 4.DBsize :查看当前数据库的数量 5.keys * :查看当前库的所有 key 6.keys k? :问号是占位符 ...

  9. Oracle里schema理解

    在Oracle中,一个用户就是一个Schema,表都是建立在Schema中的,也可以理解为每个用户拥有不同的表.一个用户想访问另外一个用户,也就是另外一个schema的表的时候,可以用 usernam ...

  10. SDWebImage源代码解析(二)

    上一篇:SDWebImage源代码解析(一) 2.缓存 为了降低网络流量的消耗.我们都希望下载下来的图片缓存到本地.下次再去获取同一张图片时.能够直接从本地获取,而不再从远程server获取.这样做的 ...