浮动按钮的弹出菜单动画

将几个按钮重叠摆放,使用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. hiho1804 - 整数分解、组合数、乘法逆元

    题目链接 题目叙述很啰嗦,可以简化为:n个球[1-1e5],放到m个不同的桶里,一共多少种不同的放法.[桶里可以不放] ---------------------------------------- ...

  2. 项目随笔之springmvc中freemark如何获取项目路径

    转载:http://blog.csdn.net/whatlookingfor/article/details/51538995 在SpringMVC框架中使用Freemarker试图时,要获取根路径的 ...

  3. javaEE_maven_struts2_tomcat_first

    1 .eclipse中新建项目

  4. VMware 虚拟化技术 创建虚拟机

    原文地址:https://www.linuxidc.com/Linux/2017-03/141972.htm 云最成熟的架构是IaaS(Infrastructure as a Service),其中用 ...

  5. BZOJ 1725: [Usaco2006 Nov]Corn Fields牧场的安排 状压动归

    Description Farmer John新买了一块长方形的牧场,这块牧场被划分成M列N行(1<=M<=12; 1<=N<=12),每一格都是一块正方形的土地.FJ打算在牧 ...

  6. python与图灵机器人交互(ITCHAT版本)

    #!/usr/bin/env python#-*- coding:utf-8 -*- @Author : wujf @Time:2018/9/5 17:42import requestsimport ...

  7. nginx获取经过层层代理后的客户端真实IP(使用正则匹配)

    今天帮兄弟项目搞了一个获取客户端真实IP的问题,网上这种问题很多,但是对于我们的场景都不太合用,现把我的解决方案share给大家,如有问题,请及时指出. 场景: 在请求到达后端服务之前,会经过层层代理 ...

  8. appium不能获取webview内容的解决办法

    在用appium对小猿搜题app进行自动化测试时,准备用page_source打印出文章的xml内容 但是发现只能打印出外部结构内容,实际的文章内容却没有显示 截图如下 查询之后,得知需要通过cont ...

  9. [luogu P2756 ] 飞行员配对方案问题 (最大流)

    强行做裸题做了两个小时..我果然太水了QAQ 题目背景 第二次世界大战时期.. 题目描述 英国皇家空军从沦陷国征募了大量外籍飞行员.由皇家空军派出的每一架飞机都需要配备在航行技能和语言上能互相配合的2 ...

  10. vue与animate.css的结合使用

    在vue项目中,由于页面需要动画效果,使用动画其实有多种方式,可以使用vue中的过渡transition,可以使用animate动画与transition配合使用,也可以单独使用animate动画库. ...