Android初级开发笔记 - FloatingButton

记录一下项目近期遇到的跟FloatingButton相关的一个小问题。
背景:需要画一个固定在某个位置,不随其他控件移动而移动的按钮。
设计稿:


Android初级开发笔记 - FloatingButton_第1张图片
在这里插入图片描述

第一阶段:
拿到蓝湖的切图,发现不仅有白边还有很大一部分的透明背景。
直接在FloatingButton设置backgroundTint后图片显得很小,一点也不美观。而且形状是圆形的。
切图:


Android初级开发笔记 - FloatingButton_第2张图片
在这里插入图片描述

作为FloatingButton背景:
Android初级开发笔记 - FloatingButton_第3张图片
在这里插入图片描述

代码:
 

第二阶段:
介于对FloatingButton的不熟悉,上网了解了一下它。发现我并没有办法找到使他变成各种形状的办法,所以最后只能说应该是它就是长成圆形的。

第三阶段:
使图片和按钮比例协调!这个的实现网上搜得到很多答案,最多的一种是说图片要24dp24dp,加android:scaleType=”center”。也有人说, app:fabSize="normal" android:scaleType=”center” 同时存在,就可以打破图片的尺寸限制。但是我都试了,打破限制的没有,设置了24dp24dp之后,比例确实和谐了,但是因为分辨率的问题,字体显得很模糊。(也可能是我不会用ps调...)
代码还是跟上面的一样,效果:

Android初级开发笔记 - FloatingButton_第4张图片
在这里插入图片描述

第四阶段:
反正里面的箭头也不明显,不如直接在里面写字好了。试了一下。FloatingButton没有text属性。很自然地我想到了加个textview。
听起来好像没毛病,可是这个textview死活就是藏在FloatingButton下面不上来。经过几番百度,终于在stackflow找到了答案,在textview加上evalation属性。完美!
代码:


    

        

        

    

效果:


Android初级开发笔记 - FloatingButton_第5张图片
在这里插入图片描述

第五阶段:
领导觉得还是有点丑,所以我又改成了酱紫。这个实现很容易,就不多说啦~
代码:


    

效果:


Android初级开发笔记 - FloatingButton_第6张图片
在这里插入图片描述

在这贴一下FloatingButton的几个属性:
1、app:borderWidth=""------------------边框宽度,通常设置为0 ,用于解决Android 5.X设备上阴影无法正常显示的问题。
2、app:backgroundTint=""---------------设置按钮的背景颜色或者背景图片,不设置,默认使用theme中colorAccent的颜色。
3、app:rippleColor=""--------------------点击的边缘阴影颜色。
4、app:elevation=""----------------------边缘阴影的宽度。
5、 app:fabSize=“”----------------------设置按钮大小。

昨儿个偶然得知了一个叫CircularReveal的家伙,可以做一下点击按钮之后跳转activity的动画。回头弄完再撸篇文章,等我~0

内推信息

  • 我们正在招募小伙伴,有兴趣的小伙伴可以把简历发到 [email protected],备注:来自社区
  • 详情可以戳这里--> 广州芦苇信息科技

你可能感兴趣的:(Android初级开发笔记 - FloatingButton)