Android踩坑日记:FloatingActionButton的设置大小问题

2024-04-26 11:58

本文主要是介绍Android踩坑日记:FloatingActionButton的设置大小问题,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

FloatingActionButton(FAB) 是 Android 5.0 新特性——Material Design 中的一个控件,是一种悬浮的按钮。FloatingActionButton 是 ImageView 的子类,因此它具备ImageView的全部属性

  • 基本使用

1,需要在gradle文件中先注册依赖:

compile 'com.android.support:design:25.0.0'

2,FAB基本属性

  <android.support.design.widget.FloatingActionButtonandroid:id="@+id/fab"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_margin="20.0dip"android:onClick="click"android:src="@mipmap/ic_launcher"app:backgroundTint="#30469b"app:borderWidth="0.0dip"app:elevation="5.0dip"app:fabSize="normal"app:layout_anchor="@id/container"app:layout_anchorGravity="right|bottom"app:pressedTranslationZ="10.0dip"app:rippleColor="#a6a6a6" />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。
android:src - 设置FAB的图标,Google建议符合Design设计的该图标大小为24dp。
app:layout_anchor - 设置FAB的锚点,即以哪个控件为参照点设置位置。
app:layout_anchorGravity - 设置FAB相对锚点的位置,值有 bottom、center、right、left、top等。

3,我的问题
咋一看,就是把FloatingActionButton添加到布局文件设置好位置和图标就行,在项目中,设计给了这样的切图标注。

项目中的浮动按钮

然后我把那个大笔的切图放进FloatingActionButton中时,发现现实不对劲
这里写图片描述

图片严重缩小了我的xml代码

    <android.support.design.widget.FloatingActionButtonandroid:id="@+id/m_main_fab"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_margin="16dp"android:src="@drawable/m_main_new_article_icon"app:borderWidth="0.0dip"app:fabSize="normal"app:backgroundTint="@color/m_main_green"android:clickable="true"app:layout_anchor="@id/m_main_recycleview"app:layout_anchorGravity="bottom|right"/>

后来查阅Material Design规范http://wiki.jikexueyuan.com/project/material-design/components/buttons-floating-action-button.html ,https://material.io/guidelines/components/buttons-floating-action-button.html#,
可以看出官方推荐中间建议使用24x24dp的小图,如加号,分享,叉叉等
根据谷歌的设计规范,drawable的尺寸应该是24dp。

fabSize=normal
fabSize=mini

本来以为设计给的图不对,后来发现及时设计将那个笔的图切成24dp*24dp,我放进去页会显得很小,不好看,后来经过师父帮忙发现设置android:scaleType=”center”会把中间的小图放到最大。

 <android.support.design.widget.FloatingActionButton
        android:id="@+id/m_main_fab"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_margin="16dp"android:src="@drawable/m_main_new_article_icon"app:borderWidth="0.0dip"app:fabSize="normal"app:backgroundTint="@color/m_main_green"android:clickable="true"app:layout_anchor="@id/m_main_recycleview"app:layout_anchorGravity="bottom|right"android:scaleType="center"/><!--  添加android:scaleType="center"会把中间的小图放到最大-->

效果图:

添加android:scaleType="center"会把中间的小图放到最大

官方建议,使用FloatingActionButton 结合 CoordinatorLayout 使用,即可实现悬浮在任意控件的任意位置。同时可以实现与CoordinatorLayout 内的其他view协调动画。

  • 协调动画
    暂更…
    查阅资源:
    1,Floating Action Button-Android M新控件
    2,【Android - 控件】之MD - FloatingActionButton的使用
    3,Android FloatingActionButton(FAB) 悬浮按钮

这篇关于Android踩坑日记:FloatingActionButton的设置大小问题的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/937529

相关文章

idea设置快捷键风格方式

《idea设置快捷键风格方式》在IntelliJIDEA中设置快捷键风格,打开IDEA,进入设置页面,选择Keymap,从Keymaps下拉列表中选择或复制想要的快捷键风格,点击Apply和OK即可使... 目录idea设www.chinasem.cn置快捷键风格按照以下步骤进行总结idea设置快捷键pyth

Springboot3统一返回类设计全过程(从问题到实现)

《Springboot3统一返回类设计全过程(从问题到实现)》文章介绍了如何在SpringBoot3中设计一个统一返回类,以实现前后端接口返回格式的一致性,该类包含状态码、描述信息、业务数据和时间戳,... 目录Spring Boot 3 统一返回类设计:从问题到实现一、核心需求:统一返回类要解决什么问题?

maven异常Invalid bound statement(not found)的问题解决

《maven异常Invalidboundstatement(notfound)的问题解决》本文详细介绍了Maven项目中常见的Invalidboundstatement异常及其解决方案,文中通过... 目录Maven异常:Invalid bound statement (not found) 详解问题描述可

MyBatis配置文件中最常用的设置

《MyBatis配置文件中最常用的设置》文章主要介绍了MyBatis配置的优化方法,包括引用外部的properties配置文件、配置外置以实现环境解耦、配置文件中最常用的6个核心设置以及三种常用的Ma... 目录MyBATis配置优化mybatis的配置中引用外部的propertis配置文件⚠️ 注意事项X

Android使用java实现网络连通性检查详解

《Android使用java实现网络连通性检查详解》这篇文章主要为大家详细介绍了Android使用java实现网络连通性检查的相关知识,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录NetCheck.Java(可直接拷贝)使用示例(Activity/Fragment 内)权限要求

idea粘贴空格时显示NBSP的问题及解决方案

《idea粘贴空格时显示NBSP的问题及解决方案》在IDEA中粘贴代码时出现大量空格占位符NBSP,可以通过取消勾选AdvancedSettings中的相应选项来解决... 目录1、背景介绍2、解决办法3、处理完成总结1、背景介绍python在idehttp://www.chinasem.cna粘贴代码,出

SpringBoot整合Kafka启动失败的常见错误问题总结(推荐)

《SpringBoot整合Kafka启动失败的常见错误问题总结(推荐)》本文总结了SpringBoot项目整合Kafka启动失败的常见错误,包括Kafka服务器连接问题、序列化配置错误、依赖配置问题、... 目录一、Kafka服务器连接问题1. Kafka服务器无法连接2. 开发环境与生产环境网络不通二、序

SpringSecurity中的跨域问题处理方案

《SpringSecurity中的跨域问题处理方案》本文介绍了跨域资源共享(CORS)技术在JavaEE开发中的应用,详细讲解了CORS的工作原理,包括简单请求和非简单请求的处理方式,本文结合实例代码... 目录1.什么是CORS2.简单请求3.非简单请求4.Spring跨域解决方案4.1.@CrossOr

nacos服务无法注册到nacos服务中心问题及解决

《nacos服务无法注册到nacos服务中心问题及解决》本文详细描述了在Linux服务器上使用Tomcat启动Java程序时,服务无法注册到Nacos的排查过程,通过一系列排查步骤,发现问题出在Tom... 目录简介依赖异常情况排查断点调试原因解决NacosRegisterOnWar结果总结简介1、程序在

2025最新版Android Studio安装及组件配置教程(SDK、JDK、Gradle)

《2025最新版AndroidStudio安装及组件配置教程(SDK、JDK、Gradle)》:本文主要介绍2025最新版AndroidStudio安装及组件配置(SDK、JDK、Gradle... 目录原生 android 简介Android Studio必备组件一、Android Studio安装二、A