以下内容为原创,欢迎转载,转载请注明

来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/4474748.html

RapidFloatingActionButton

Google推出了MaterialDesign的设计语言,其中FloatingActionButton就是一部分,但是Google却没有提供一个官方的FloatingActionButton控件,网上找了几个试用了下,但是始终没有找到合适的,所以,自己动手丰衣足食了。

RapidFloatingActionButton(以下简称RFAB)是Floating Action Button的快速实现。

Github地址:https://github.com/wangjiegulu/RapidFloatingActionButton

 

 

使用方式:

依赖:
AndroidBucket(https://github.com/wangjiegulu/AndroidBucket):基础工具包
AndroidInject(https://github.com/wangjiegulu/androidInject):注解框架

NineOldAndroids(https://github.com/JakeWharton/NineOldAndroids):兼容低版本的动画框架

activity_main.xml:

 1 <com.wangjie.rapidfloatingactionbutton.RapidFloatingActionLayout
 2       xmlns:rfal="http://schemas.android.com/apk/res-auto"
 3       android:id="@+id/activity_main_rfal"
 4       android:layout_width="match_parent"
 5       android:layout_height="match_parent"
 6       rfal:rfal_frame_color="#ffffff"
 7       rfal:rfal_frame_alpha="0.7"
 8       >
 9   <com.wangjie.rapidfloatingactionbutton.RapidFloatingActionButton
10           xmlns:rfab="http://schemas.android.com/apk/res-auto"
11           android:id="@+id/activity_main_rfab"
12           android:layout_width="wrap_content"
13           android:layout_height="wrap_content"
14           android:layout_alignParentRight="true"
15           android:layout_alignParentBottom="true"
16           android:layout_marginRight="15dp"
17           android:layout_marginBottom="15dp"
18           android:padding="8dp"
19           rfab:rfab_size="normal"
20           rfab:rfab_drawable="@drawable/rfab__drawable_rfab_default"
21           rfab:rfab_color_normal="#37474f"
22           rfab:rfab_color_pressed="#263238"
23           rfab:rfab_shadow_radius="7dp"
24           rfab:rfab_shadow_color="#999999"
25           rfab:rfab_shadow_dx="0dp"
26           rfab:rfab_shadow_dy="5dp"
27           />
28 </com.wangjie.rapidfloatingactionbutton.RapidFloatingActionLayout>

在需要增加RFAB最外层使用<com.wangjie.rapidfloatingactionbutton.RapidFloatingActionLayout>,按钮使用<com.wangjie.rapidfloatingactionbutton.RapidFloatingActionButton>

属性解释

RapidFloatingActionLayout:

  rfal_frame_color: 展开RFAB时候最外覆盖层的颜色,默认是纯白色
  rfal_frame_alpha: 展开RFAB时候最外覆盖层的透明度(0 ~ 1),默认是0.7

RapidFloatingActionButton:

 rfab_size: RFAB的尺寸大小,只支持两种尺寸(Material Design规范):
          normal: 直径56dp
          mini: 直径40dp
  rfab_drawable: RFAB中间的图标,默认是一个"+"图标
  rfab_color_normal: RFAB背景的普通状态下的颜色。默认是白色
  rfab_color_pressed: RFAB背景的触摸按下状态的颜色。默认颜色是"#dddddd"
  rfab_shadow_radius: RFAB的阴影半径。默认是0,表示没有阴影
  rfab_shadow_color: RFAB的阴影颜色。默认是透明,另外如果rfab_shadow_radius为0,则该属性无效
  rfab_shadow_dx: RFAB的阴影X轴偏移量。默认是0
  rfab_shadow_dy: RFAB的阴影Y轴偏移量。默认是0

MainActivity:

 1 @AILayout(R.layout.activity_main)
 2 public class MainActivity extends AIActionBarActivity implements RapidFloatingActionContentLabelList.OnRapidFloatingActionContentListener {
 3
 4     @AIView(R.id.activity_main_rfal)
 5     private RapidFloatingActionLayout rfaLayout;
 6     @AIView(R.id.activity_main_rfab)
 7     private RapidFloatingActionButton rfaBtn;
 8     private RapidFloatingActionButtonHelper rfabHelper;
 9
10     @Override
11     protected void onCreate(Bundle savedInstanceState) {
12         super.onCreate(savedInstanceState);
13
14         RapidFloatingActionContentLabelList rfaContent = new RapidFloatingActionContentLabelList(context);
15         rfaContent.setOnRapidFloatingActionContentListener(this);
16         List<RFACLabelItem> items = new ArrayList<>();
17         items.add(new RFACLabelItem<Integer>()
18                         .setLabel("Github: wangjiegulu")
19                         .setResId(R.drawable.ic_launcher)
20                         .setIconNormalColor(0xffd84315)
21                         .setIconPressedColor(0xffbf360c)
22                         .setWrapper(0)
23         );
24         items.add(new RFACLabelItem<Integer>()
25                         .setLabel("tiantian.china.2@gmail.com")
26                         .setResId(R.drawable.ic_launcher)
27                         .setIconNormalColor(0xff4e342e)
28                         .setIconPressedColor(0xff3e2723)
29                         .setWrapper(1)
30         );
31         items.add(new RFACLabelItem<Integer>()
32                         .setLabel("WangJie")
33                         .setResId(R.drawable.ic_launcher)
34                         .setIconNormalColor(0xff056f00)
35                         .setIconPressedColor(0xff0d5302)
36                         .setWrapper(2)
37         );
38         items.add(new RFACLabelItem<Integer>()
39                         .setLabel("Compose")
40                         .setResId(R.drawable.ic_launcher)
41                         .setIconNormalColor(0xff283593)
42                         .setIconPressedColor(0xff1a237e)
43                         .setWrapper(3)
44         );
45         rfaContent
46                 .setItems(items)
47                 .setIconShadowRadius(ABTextUtil.dip2px(context, 5))
48                 .setIconShadowColor(0xff999999)
49                 .setIconShadowDy(ABTextUtil.dip2px(context, 5))
50         ;
51
52         rfabHelper = new RapidFloatingActionButtonHelper(
53                 context,
54                 rfaLayout,
55                 rfaBtn,
56                 rfaContent
57         ).build();
58
59     }
60
61     @Override
62     public void onRFACItemLabelClick(int position, RFACLabelItem item) {
63         Toast.makeText(getContext(), "clicked label: " + position, Toast.LENGTH_SHORT).show();
64         rfabHelper.toggleContent();
65     }
66
67     @Override
68     public void onRFACItemIconClick(int position, RFACLabelItem item) {
69         Toast.makeText(getContext(), "clicked icon: " + position, Toast.LENGTH_SHORT).show();
70         rfabHelper.toggleContent();
71     }
72 }

除了xml中设置的RapidFloatingActionLayoutRapidFloatingActionButton之外,还需要RapidFloatingActionContent的实现类来填充和指定RFAB的内容和形式。
这里提供了一个快速的RapidFloatingActionContent的实现解决方案:RapidFloatingActionContentLabelList。你可以加入多个item(RFACLabelItem,当然,不建议加太多的item,导致超过一个屏幕),然后设置每个item的颜色、图标、阴影、label的背景图片、字体大小颜色甚至动画。
它的效果可参考最上面的效果图片或者Google的Inbox的效果。
除此之外,你还需要使用RapidFloatingActionButtonHelper来把以上所有零散的组件组合起来。

关于扩展:

如果你不喜欢默认提供的RapidFloatingActionContentLabelList,理论上你可以扩展自己的内容样式。方法是继承com.wangjie.rapidfloatingactionbutton.RapidFloatingActionContent,然后初始化内容布局和样式,并调用父类的setRootView(xxx);方法即可。如果你需要增加动画,可以重写如下方法:

public void onExpandAnimator(AnimatorSet animatorSet);
public void onCollapseAnimator(AnimatorSet animatorSet);

把需要的Animator增加到animatorSet中即可
另外,作者也会不定期增加更多的RapidFloatingActionContent的扩展

License

Copyright 2015 Wang Jie

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

RapidFloatingActionButton框架正式出炉的更多相关文章

  1. [Android]RapidFloatingActionButton框架正式出炉

    以下内容为原创,欢迎转载,转载请注明 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/4474748.html RapidFloatingActionB ...

  2. 2015 PHP框架调查结果出炉,Laravel最受欢迎!

    日前,SitePoint花了一个月时间进行了有关PHP框架使用情况的调查,通过调查结果所示,无论是在团队项目还是个人项目:无论是国家或是年龄层次,Laravel都是使用最多的一款框架. 其中,最流行的 ...

  3. 开启云时代,银狐H5游戏云通迅框架解决方案出炉!

    没有时间开发服务器? 不懂服务器开发? 还在为WEB SOCKET烦恼?还在为网络卡,负载承受能力小烦恼? 银狐H5游戏云通迅框架,集成通讯SDK和开放API,1天即可完成 它也是开放平台,提供游戏需 ...

  4. 刚写完的商城erp + 这个商城前台,新鲜出炉。自己1个人写, 包括php框架和前端html页面.

    刚写完的商城erp + 这个商城前台,新鲜出炉.自己1个人写, 包括php框架和前端html页面. 刚写完的商城erp + 这个商城前台,新鲜出炉.自己1个人写, 包括php框架和前端html页面.

  5. Onsen UI – 新鲜出炉的 PhoneGap 界面框架

    Onsen UI 是一个基于元素自定义的 HTML5 UI 框架,用于构建你的移动前端.这个一个基于 Web 组件的概念的框架,让构建应用程序变得更加轻松.Onsen UI 专门针对 PhoneGap ...

  6. UWP Windows历史上最漂亮的UWP框架出炉!!!

    UWP Windows历史上最漂亮的UWP框架出炉!!! 本框架基于微软的开源项目WTS开发,并在其基础上增加了FDS(流畅设计元素,高光.亚克力等).多语言系统.沉浸式体验(扩展内容到标题栏) 同时 ...

  7. 微信小程序开发视频教程新鲜出炉

    微信小程序开发公测了,可是对于新手来说,不同的框架不同的开发机制,如何快速适应呢?微信小程序开发视频教程新鲜出炉了,从零开始一步一步搭建微信小程序,每个章节都会涉及到不同的知识点,等教程学习完你不但掌 ...

  8. 2017年11月GitHub上最热门的Java项目出炉

    2017年11月GitHub上最热门的Java项目出炉~ 一起来看看这些项目你使用过哪些呢? 1分布式 RPC 服务框架 dubbohttps://github.com/alibaba/dubbo S ...

  9. [转帖]2018年JVM生态系统报告出炉

    很多未解之谜终于有答案了——2018年JVM生态系统报告出炉 https://blog.csdn.net/hollis_chuang/article/details/84134298   2018年1 ...

随机推荐

  1. 【BZOJ-4197】寿司晚宴 状压DP

    4197: [Noi2015]寿司晚宴 Time Limit: 10 Sec  Memory Limit: 512 MBSubmit: 694  Solved: 440[Submit][Status] ...

  2. amd和CMD

    AMD(Modules/Asynchronous-Definition).CMD(Common Module Definition)规范区别? Asynchronous Module Definiti ...

  3. Android实现XML解析技术

    转载:Android实现XML解析技术 本文介绍在Android平台中实现对XML的三种解析方式. XML在各种开发中都广泛应用,Android也不例外.作为承载数据的一个重要角色,如何读写XML成为 ...

  4. python-模块系列

    --> 模块,用一砣代码实现了某个功能的代码集合. 类似于函数式编程和面向过程编程,函数式编程则完成一个功能,其他代码用来调用即可,提供了代码的重用性和代码间的耦合.而对于一个复杂的功能来,可能 ...

  5. 不使用webview,用手机浏览器的android app

    需求:wap站在手机上以App的形式打开,但不要嵌套WebView,只能以浏览器打开 package com.gzz.whyinzi; import android.net.Uri; import a ...

  6. Putty设置自己主动两次登录

    有时你想登录到serverA,但serverA白名单,你刚刚从山寨机B登录了,所以每次你要登录到serverA.您必须先登录到山寨机B.然后登录到serverA. 我们能够用Putty的local p ...

  7. log4j.properties全配置 (转)

    ###############################log4j.properties############################### ##### Global Log Leve ...

  8. ROS_Kinetic_29 kamtoa simulation学习与示例分析(一)

    致谢源代码网址:https://github.com/Tutorgaming/kamtoa-simulation kamtoa simulation学习与示例分析(一) 源码学习与分析是学习ROS,包 ...

  9. 经典视觉SLAM框架

    经典视觉SLAM框架 整个视觉SLAM流程包括以下步骤: 1. 传感器信息读取.在视觉SLAM中主要为相机图像信息的读取和预处理. 2. 视觉里程计(Visual Odometry,VO).视觉里程计 ...

  10. 框架tensorflow3

    tensorflow3 tensorflow 可视化好帮手: tf.train.SummaryWriter报错,改为tf.summary.FileWriter 软件包安装yum install sql ...