Android——FloatingActionButton使用说明以及避坑

已于 2022-11-28 23:22:33 修改
阅读量3.5k 收藏 8
点赞数 1
分类专栏： android 文章标签： android android studio FAB 浮动按钮
于 2022-11-28 22:38:33 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yilvqingtai/article/details/128088131
版权

1、简介

1.1、 com.android.support库下

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

1.2、material库下

com.google.android.material.floatingactionbutton.FloatingActionButton 库下

implementation 'com.google.android.material:material:1.1.0'
 

 官方地址：  FloatingActionButton  |  Android Developers

1.3、 哪些操作推荐使用FloatingActionButton

如： 添加，收藏，编辑，分享，导航等，如下图：

2、属性介绍

XML 属性

android:src中心显示的图标
app:layout_anchor设置FAB的锚点，即以哪个控件为参照设置位置
app:layout_anchorGravityFAB相对于锚点的位置
app:backgroundTintFAB按钮边框颜色
app:borderWidthFAB按钮边框大小
android:backgroundTint是里面背景颜色
android:tint是里面图标背景
FloatingActionButton_elevationapp:elevation阴影的高度
FloatingActionButton_ensureMinTouchTargetSize
FloatingActionButton_fabCustomSize
FloatingActionButton_fabSizeapp:fabSize按钮大小，normal (56dp) mini（40dp）
FloatingActionButton_hideMotionSpec
FloatingActionButton_hoveredFocusedTranslationZ
FloatingActionButton_maxImageSize
FloatingActionButton_pressedTranslationZapp:pressedTranslationZ点击按钮时，按钮边缘阴影的宽度，通常设置比elevation的数值大!
FloatingActionButton_rippleColorapp:rippleColor按压水波纹颜色
FloatingActionButton_showMotionSpec
FloatingActionButton_useCompatPadding

3、使用例子

FloatingActionButton基本使用及踩坑记录_gaolhjy的博客-CSDN博客_floatingactionbutton

4、闭坑问题

4.1、 图标颜色无法改变

4.1.1、 复现场景

xml中引入图标后，默认是黑色或其他颜色，无法修改自己想要的颜色。

比如我们期望 白色的 中心图标，但是常常是 黑色或者其他颜色的中心图标

4.1.2、 其中一种方式colorOnSecondary

网上博客大多数说的是  theme中 colorOnSecondary的颜色决定了图标的颜色。

【Android】使用FloatingActionButton过程中底图颜色始终为黑色_victor-维克特的博客-CSDN博客_android floatingactionbutton 颜色

FloatingActionButton图标颜色更改不了_github_39465103的博客-CSDN博客

这位楼主直接让大家不要用某类主题，哈哈，这是头痛医脚

FloatingActionButton图标颜色无法修改 - 简书

上面的方法也不是万能，主要原因还是取决于 你是用的什么theme，并非所有主题都是通过 colorOnSecondary的颜色决定的。

4.1.3、 另一种方式android:tint

直接设置该属性，效果立竿见影
android:tint="@color/red_btn_bg_color" 是里面图片背景
 

青苔猿猿
关注
专栏目录
【Android笔记99】Android之悬浮按钮FloatingActionButton、Snackbar、CardView卡片式布局
✅ Java 开发工程师，从事 Web 应用程序的研发，擅长 Spring、SpringBoot 等技术。 ✅ 热爱编程，业余时间学习新知识，通过 CSDN 记录学习心得和笔记内容。
05-07 756
app:fabSize：设置悬浮按钮的大小，三个取值：auto、mini、normal。app:backgroundTint：设置悬浮按钮的背景颜色。app:rippleColor：设置悬浮按钮，点击时候，产生的涟漪颜色，也就是按钮点击时候会变成另外一种颜色。app:elevation：按钮悬浮的高度，高度越大，按钮显示的阴影越深。android:src：按钮显示的图标。android:layout_gravity：设置悬浮按钮显示的位置，
Android框架之路——FloatingActionButton使用与ToolBar进阶
等一杯咖啡的博客
04-23 3784
参考博客： 玩转AppBarLayout，更酷炫的顶部栏 FloatingActionButton的滚动隐藏和弹出特效的实现 Snackbar学习笔记 效果演示：FAB的相关： app:fabSize设置FloatingActionButton的大小，有两种赋值分别是 “mini” 和 “normal”，默认是normal； app:backgroundTint：FloatingActionButt
Android FloatingActionButton 所有属性
weixin_36493214的博客
07-10 42
Android FloatingActionButton 所有属性实现教程 流程图 #render_6_1575376355-svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#render_6_1575376...
Android FloatingActionButton 基础教程
最新发布
gitblog_00733的博客
09-01 829
Android FloatingActionButton 基础教程 android-FloatingActionButtonBasicThis sample has been deprecated/archived. Check this repo for related samples:项目地址:https://gitcode.com/gh_mirrors/an/android-Floatin...
FloatingActionButton的使用
07-19
Google提供的Design Library中FloatingActionButton的使用。 和配合Snackbar的使用
Material Design之FloatingActionButton的使用
MrFors的专栏
06-12 1577
原文地址:http://blog.csdn.net/u010687392/article/details/46954213 FloatingActionButton是继承至ImageView，所以FloatingActionButton拥有ImageView的所有属性。CoordinatorLayout可以用来配合FloatingActionButton浮动按钮，设置app：la
android FloatingActionButton 使用
weixin_41012196的博客
08-12 67
Android FloatingActionButton 使用指南 FloatingActionButton（FAB）是Android Material Design中一个非常重要的组件。它是一个圆形按钮，通常用于主功能的引导，比如添加内容、创建新项等。FAB的浮动设计使得它在用户界面中显得突出，且具备良好的用户体验。本文...
Android FloatingActionButton（浮动动作按钮的动画 ） 使用详情
向着太阳迎着光
08-19 5604
浮动动作按钮(FAB)已经成为最简单的组件之一，成为设计师和开发人员快速和必不可少的最爱。家人们，这篇文章将向您展示如何使您的应用程序FAB交互式，以及如何制作自己的动画。但是让我们从简单的开始，将浮动操作按钮添加到一个Android项目中。浮动动作按钮看起来像这样的布局文件，如果创建一个空白活动的项目，将自动生成；
Android Jetpack Compose —— FloatingActionButton
江小白的博客
06-19 924
无论是在移动应用程序还是在平板电脑或桌面应用程序中，FloatingActionButton 都是一种非常实用的设计元素，有助于提高应用程序的可用性和可访问性。FloatingActionButton 提供了一种简单而优雅的方式来引导用户进行主要的应用程序交互，例如开始一个新的任务、分享内容、启动一个动作等。5.在界面中使用 FloatingActionButton：将创建的 FloatingActionButton 添加到相应的界面中。例如，可以设置按钮的背景颜色、形状、图标、大小等。
Android学习——FloatingActionButton制作简易弹出菜单
qq_37656219的博客
02-16 2045
        又到了写博客的时候了，大过年的也算抽空复习了一下Android开发，今天来做个简单一点的弹出菜单，这里用到了FloatingActionButton，废话不多说直接上代码        第一步：File--Project Structure--app--Dependencies里添加design依赖。        第二步：修改XML为如下<?xml version="1.0...
Android特效——悬浮FloatingActionButton按钮
07-27
在Android应用开发中，`FloatingActionButton(Floating Action Button)`是一种设计模式，用于提供主要或频繁使用的操作。这个组件通常表现为一个圆形的按钮，漂浮在屏幕的底部边缘，或者在侧滑抽屉的一侧，其设计...
Android悬浮菜单按钮FloatingActionButton实现
09-04
Android悬浮菜单按钮FloatingActionButton实现，可直接拿到项目中集成使用。希望大家多多关注我的博客：https://blog.csdn.net/k571039838k 谢谢大家
android-floating-action-button
04-23
内容包含：android-floating-action-button.jar包，android-floating-action-button.src.zip源码，和示例代码。。 https://github.com/futuresimple/android-floating-action-button
Android代码-FloatingActionButton
08-06
Android中FloatingActionButton的显示与隐藏示例
08-29
FloatingActionButton（FAB）是Android 5.0 新特性——Material Design 中的一个控件，是一种悬浮的按钮，并且是 ImageView 的子类，因此它具备ImageView的全部属性。一般FloatingActionButton 结合 ...
Android Material 常用组件详解（三）—— SnackBar、FloatingActionButton 使用详解
weixin_42046829的博客
11-26 1596
1.SnackBar Snackbar显示在所有屏幕其它元素之上(屏幕最顶层)，同一时间只能显示一个snackbar。 Snackbar的基本使用很简单，与Toast类似。 //带按钮的 Snackbar.make(coordinatorLayout,"这是massage", Snackbar.LENGTH_LONG).setAction("这是action", new View.OnClickListener() { @Override public void onClick(View v
Android FloatingActionButton的使用（包含Snackbar，CoordinatorLayout）
0729Liang
06-19 585
1.属性android:src：                        FAB中显示的图标，最好是24dp的app:backgroundTint：          正常的背景颜色，颜色不透明度要为FF，即完全不透明app:rippleColor：                 按下时的背景颜色app:elevation：                    正常的阴影大小app:pr...
Android中FloatingActionButton的基本使用
leiming
06-20 674
Android中 FloatingActionButton的简单使用1.直接在app的build.gradle中添加引用 即可 compile 'com.android.support:design:25.3.1' 2.在XML布局中设置想要的悬浮样式 <android.support.design.widget.FloatingActionButton android:id="
Android——ViewPager多页面滑动切换以及动画效果
05-27
ViewPager是一个Android中的View容器，可以让用户在多个页面之间进行滑动切换。要实现多页面滑动切换以及动画效果，可以按照以下步骤： 1. 在XML布局文件中添加ViewPager控件，并添加对应的布局文件，例如： ``` <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="match_parent" /> ``` 2. 在Java代码中为ViewPager设置Adapter，用于显示多个页面。例如： ``` ViewPager viewPager = findViewById(R.id.viewPager); MyPagerAdapter adapter = new MyPagerAdapter(getSupportFragmentManager()); viewPager.setAdapter(adapter); ``` 其中，MyPagerAdapter是自定义的PagerAdapter类，需要继承自FragmentPagerAdapter或FragmentStatePagerAdapter。 3. 在自定义的PagerAdapter类中实现getItem()方法，用于返回每个页面的Fragment实例。例如： ``` @Override public Fragment getItem(int position) { switch (position) { case 0: return new Fragment1(); case 1: return new Fragment2(); case 2: return new Fragment3(); default: return null; } } ``` 其中，Fragment1、Fragment2、Fragment3是自定义的Fragment类，用于显示对应页面的内容。 4. 如果需要添加页面切换的动画效果，可以在Java代码中为ViewPager设置PageTransformer。例如： ``` viewPager.setPageTransformer(true, new DepthPageTransformer()); ``` 其中，DepthPageTransformer是自定义的PageTransformer类，用于实现页面切换时的动画效果。可以参考以下代码示例： ``` public class DepthPageTransformer implements ViewPager.PageTransformer { private static final float MIN_SCALE = 0.75f; public void transformPage(View view, float position) { int pageWidth = view.getWidth(); if (position < -1) { // [-Infinity,-1) // This page is way off-screen to the left. view.setAlpha(0f); } else if (position <= 0) { // [-1,0] // Use the default slide transition when moving to the left page view.setAlpha(1f); view.setTranslationX(0f); view.setScaleX(1f); view.setScaleY(1f); } else if (position <= 1) { // (0,1] // Fade the page out. view.setAlpha(1 - position); // Counteract the default slide transition view.setTranslationX(pageWidth * -position); // Scale the page down (between MIN_SCALE and 1) float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position)); view.setScaleX(scaleFactor); view.setScaleY(scaleFactor); } else { // (1,+Infinity] // This page is way off-screen to the right. view.setAlpha(0f); } } } ``` 以上就是实现Android中ViewPager多页面滑动切换以及动画效果的步骤。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

青苔猿猿

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值