Material Design学习-----FloatingActionButton
FloatingActionButton是悬浮操作按钮,它继承自imageview,所以说它具备有imageview所有的方法和属性。与其他按钮不同的是,FloatingActionButton默认就是圆形的,只要设置背景色和背景图片,展现出来的就圆形按钮,FloatingActionButton常用的属性有:
- app:backgroundTint - 设置FAB的背景颜色。
- app:rippleColor - 设置FAB点击时的背景颜色。
- app:borderWidth - 该属性尤为重要,如果不设置0dp,那么在4.1的sdk上FAB会显示为正方形,而且在5.0以后的sdk没有阴影效果。所以设置为borderWidth="0dp"。
- app:elevation - 默认状态下FAB的阴影大小。
- app:pressedTranslationZ - 点击时候FAB的阴影大小。
- app:fabSize - 设置FAB的大小,该属性有两个值,分别为normal和mini,对应的FAB大小分别为56dp和40dp。
- src - 设置FAB的图标,Google建议符合Design设计的该图标大小为24dp。
- app:layout_anchor - 设置FAB的锚点,即以哪个控件为参照点设置位置。
- app:layout_anchorGravity - 设置FAB相对锚点的位置,值有 bottom、center、right、left、top等。
实现的代码如下:
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="@mipmap/icon"
app:backgroundTint="#ff87ffeb"
app:rippleColor="#33728dff"
app:elevation="6dp"
app:pressedTranslationZ="12dp" />
同时有时为了实现和背面控件的同步滑动(如:有时候要调用Snackbar的时候,不同步滑动会有相互遮挡的问题),这个时候就需要把需要同步滑动的控件都放在CollapsingToolbarLayout控件中,关于CollapsingToolbarLayout的使用方式,在前面的博客中介绍过。
5.x存在的一些问题
- 木有阴影
记得设置app:borderWidth="0dp"
。
- 按上述设置后,阴影出现了,但是竟然有矩形的边界(未设置margin时,可以看出)
需要设置一个margin的值。在5.0之前,会默认就有一个外边距(不过并非是margin,只是效果相同)。
so,良好的实践是:
- 添加属性
app:borderWidth="0dp"
- 对于5.x设置一个合理的margin
不是闷骚的程序员算不上程序员。我的微信公众号“那点鼻事”,在这里周一到周五每天一篇文章,与技术无关,只哈牛逼。
Material Design学习-----FloatingActionButton的更多相关文章
- Android Material Design的FloatingActionButton,Snackbar和CoordinatorLayout
如果是为了兼容低版本的Android系统,则需要引用Android Material Design的扩展支持库,我在之前的一篇文章张,较为详细的说明了如何导入Android Material Desi ...
- Material Design学习之 Button(具体分析,传说中的水滴动画)
转载请注明出处:王亟亟的大牛之路 上一篇大致介绍了Material Design的一些基本概念传送门:http://blog.csdn.net/ddwhan0123/article/details/5 ...
- Material Design学习笔记
Wiki->移动开发->Android->Material Design-原质化设计 (友情链接:http://wiki.jikexueyuan.com/project/materi ...
- Material Design学习
前言: 最为一个用习惯了bootstrap的前端小菜,今天偶然听闻material design 这个从未听闻的前端框架,带着好奇开始了新的尝试,并将bootstrap跟material design ...
- Android Material Design 学习笔记 - Matrial Theme
google在2014年 I/O大会上推出了一种新的设计设计语言—Material design,这种设计语言语言旨在为手机.平板电脑.台式机和“其他平台”提供更一致.更广泛的“外观和感觉”(附上官方 ...
- Material Design之FloatingActionButton的使用
FloatingActionButton是继承至ImageView,所以FloatingActionButton拥有ImageView的全部属性. CoordinatorLayout能够用来配合Flo ...
- Material Design学习之 ProgreesBar
转载奇怪注明出处:王亟亟的大牛之路 继续我们Material Design的内容,这一篇讲的是进度条,上一篇是Switch地址例如以下:http://blog.csdn.net/ddwhan0123/ ...
- Material Design学习之 Camera
转载请注明出处:王亟亟的大牛之路 年后第一篇,自从来了某司产量骤减,这里批评下自己,这一篇的素材来源于老牌Material Design控件写手afollestad的 https://github.c ...
- Material Design学习之 Bottom navigation
转载请注明出处:王亟亟的大牛之路 礼拜4一天由于事假没有去单位然后礼拜3由于生日也没写文章,今天一早上班就补一篇MD的内容.这一篇是关于颇有争议的Bottom navigation相关内容(主要是翻译 ...
随机推荐
- ios framework 开发 之 实战 一,合并失败了
保证public 文件目录独立 在 XCode 7 中,这一条已经自动实现了 Build Settings>Public Headers Folder Path "$(PROJECT_ ...
- OpenCV点滴2
明天回家了-- 昨天去见了老师,去之前告诉自己不要紧张,去了后还是紧张了,语无伦次,很没礼貌--(不敢看老师的眼睛) 刚才妈打电话说让我早点回去,不知道为什么,在空荡荡的宿舍里听到妈的声音,眼泪会夺眶 ...
- 漂亮的PHP验证码
<?php class Imagecode{ private $width ; private $height; private $counts; private $distrubcode; p ...
- Struts2框架学习(三) 数据处理
Struts2框架学习(三) 数据处理 Struts2框架框架使用OGNL语言和值栈技术实现数据的流转处理. 值栈就相当于一个容器,用来存放数据,而OGNL是一种快速查询数据的语言. 值栈:Value ...
- C++ STL算法系列1---unique , unique_copy函数
一.unique函数 类属性算法unique的作用是从输入序列中“删除”所有相邻的重复元素. 该算法删除相邻的重复元素,然后重新排列输入范围内的元素,并且返回一个迭代器(容器的长度没变,只是元素顺序 ...
- Tamper Data 安装与使用
Tamper Data概览 注意:我将会讲述一些有关Tamper Data的基本常识,包括它的基本功能,如何安装等. Tamper Data是什么? Tamper Data 的真实含义,即&q ...
- MySQL导出以H开头的表
情景:我有上百张以H开头的表,我需要备份出这些以H开头的表. mysqldump不支持*或者%这种通配符,所以没法实现备份以xx开头的表这种,这里算是个小技巧,利用文本编辑器来实现. [root@HE ...
- Spring AOP切面的时候参数的传递
Spring AOP切面的时候参数的传递 Xml: <?xml version="1.0" encoding="UTF-8"?> <beans ...
- python关于列表的操作
列表是Python中最基本的数据结构,列表是最常用的Python数据类型,列表的数据项不需要具有相同的类型.列表中的每个元素都分配一个数字 - 它的位置,或索引,第一个索引是0,第二个索引是1,依此类 ...
- 我的音乐盒子(nodejs7 + koa2 + vue + vuex + vue-router)
你们知道的,nodejs对jser来说,是个好东西,快快的,自从接触nodejs后,总想弄点东西. 这弄个啥了,一天打开百度音乐盒,哟,自己弄一个如何了,好啊好啊. 后台: nodejs 7 + ko ...