开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

如何使BottomAppBar的浮动操作按钮透明？

要使BottomAppBar的浮动操作按钮透明，可以通过以下步骤实现：

首先，需要在布局文件中定义BottomAppBar和浮动操作按钮。例如：

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bottom_app_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:fabAlignmentMode="center"
    app:fabCradleMargin="8dp"
    app:fabCradleRoundedCornerRadius="16dp"
    app:fabCradleVerticalOffset="8dp">

    <!-- 添加BottomAppBar的其他内容 -->

</com.google.android.material.bottomappbar.BottomAppBar>

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    app:layout_anchor="@id/bottom_app_bar" />

接下来，在代码中找到BottomAppBar和浮动操作按钮的实例，并设置浮动操作按钮的背景为透明。例如：

BottomAppBar bottomAppBar = findViewById(R.id.bottom_app_bar);
FloatingActionButton fab = findViewById(R.id.fab);

fab.setBackgroundTintList(ColorStateList.valueOf(Color.TRANSPARENT));

最后，为了使浮动操作按钮能够正常显示，需要将BottomAppBar的fabAlignmentMode属性设置为end。例如：

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bottom_app_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:fabAlignmentMode="end"
    app:fabCradleMargin="8dp"
    app:fabCradleRoundedCornerRadius="16dp"
    app:fabCradleVerticalOffset="8dp">

    <!-- 添加BottomAppBar的其他内容 -->

</com.google.android.material.bottomappbar.BottomAppBar>

这样，浮动操作按钮就会变为透明，并且位于BottomAppBar的右下角。

关于腾讯云相关产品和产品介绍链接地址，由于要求不能提及具体的品牌商，建议您访问腾讯云官方网站或搜索引擎进行相关产品的了解和查询。

相关搜索:修复了碎片中的浮动操作按钮可移动的浮动操作按钮移出屏幕如何从浮动操作按钮android获取布局如何使div透明并将其浮动在图像上？如何使Materialize的工具提示粘贴到浮动操作按钮上？如何使Overview按钮透明如何使切换按钮透明如何使用列表中的浮动操作按钮？如何使用浮动操作按钮创建底部导航如何停止按钮和图片框的重叠？(使它们透明)

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

java SWT:基于Composite定制背景透明的浮动图像按钮(image button)

是没办法做出好看的图形按钮的....如果不指定SWT.TRANSPARENT样式，当按钮在有图像的组件之上时这样的效果 ?...这一行也很重要，如果没有这样，当按钮所在组件改变背景色的时候(setBackground)，透明色就失效了。...SWT对图像背景透明的设置有几种方式，本文中我选择了最简单的一种，就是指定图像中某种颜色(本例为白色)为透明色。...，修正按钮在图像上浮云时效果不正确的问题关于图像透明色的设置参考: 《Java Source Code: com.asprise.books.javaui.ch15.Transparency》

1.9K2 0

在 Flutter 中创建可拖动的浮动操作按钮

Flutter 允许您使用FloatingActionButton小部件添加浮动操作按钮。但是，它不允许您拖动按钮。如果你想让它可拖动怎么办。...本教程有一个示例，说明您需要做什么才能创建浮动操作按钮，只要它位于父小部件内，就可以将其拖动到屏幕周围的任何位置。创建可拖动的浮动操作按钮我们将为这样的小部件创建一个类。...我们需要处理的第一件事是使按钮可跟随指针拖动的能力。可以使用的小部件之一是Listener，它能够检测指针移动事件并提供移动细节。基本上，按钮需要包装为Listener....下面是用于创建可拖动浮动操作按钮的类。它有一些参数，包括child（要设置为按钮的小部件）、initialOffset（移动前的初始偏移量）和onPressed（单击按钮时调用的回调）。...Flutter 中创建可拖动的浮动操作按钮。

5.4K1 0

fastadmin如何在列表的操作中添加其他按钮

fastadmin默认的列表操作中只有编辑和删除按钮，如果我们需要添加其他按钮，需要先找到对应的js文件。...我们需要在初始化表格中添加buutons属性，原来的js代码如下：{ field: 'operate', title: __('Operate'), table: table, ...events: Table.api.events.operate, formatter: Table.api.formatter.operate}添加后的代码如下：{ field: 'operate... ], events: Table.api.events.operate, formatter: Table.api.formatter.operate}增加了一个"一键创建开店任务"的操作按钮

3.7K2 0

Flutter布局基础——自定义BottomNavigationBar

和BottomAppBar floatingActionButton floatingActionButton用于创建一个浮动的按钮，有两种样式：一种是圆形的纯图标的；一种是椭圆的带有图标或文案的。...要实现的效果如下： --> [simulator screen shot - iphone 12 pro max - 2021-08-19 at 13.54.17.png] 下面来分析如何实现...再然后是 BottomAppBar 如下： <!

1.9K2 0

fastadmin如何隐藏单元格中的部分操作按钮

一、隐藏修改，删除按钮法一：简单暴力的隐藏(但可能会影响外部删除的操作) 直接在表格参数配置部分进行隐藏法二：根据代码进行隐藏代码位置：public/assets/js/backend/pim/test.js...$(table).data("operate-edit",null);//隐藏操作中的编辑按钮， $(table).data("operate-del",null);//隐藏操作中的删除按钮...$(table).data("operate-edit",null);//隐藏操作中的编辑按钮， $(table).data("operate-del",null);//隐藏操作中的删除按钮...， $(table).data("operate-dragsort",null);//隐藏操作中的移动按钮， that.table = table; return...，未经允许不得转载：肥猫博客 » fastadmin如何隐藏单元格中的部分操作按钮

5724 0

Flutter 全栈式——页面框架

，按钮text等 localeListResolutionCallback LocaleListResolutionCallback 该回调负责在应用启动时以及用户更改设备的区域设置时选择应用的区域设置...FloatingActionButtonLocation 设定悬浮按钮的位置 floatingActionButtonAnimator FloatingActionButtonAnimator 悬浮按钮动画...persistentFooterButtons List 在底部显示的一组按钮 drawer Widget 开始部分的（左边）抽屉菜单 endDrawer Widget 结束部分的（右边...resizeToAvoidBottomInset bool 页面浮动控件部分自动调整，以避免被弹出键盘所遮盖，默认为true primary bool 是否填充顶部栏，默认为true drawerDragStartBehavior...flexibleSpace显示在AppBar的下方，高度和AppBar高度一样，可以实现一些特殊的效果 [cf22fa2aav.png] 文档地址示例 BottomAppBar BottomAppBar

2.8K3 0

探索 Android Design Support Library v28 新增内容

accent colour 填充按钮的背景颜色, 同时使用白色作为按钮的文字颜色....如果该按钮未被填充, 则主题的 accent colour 将作为按钮的文本颜色, 透明背景色....如果我们希望自己添加一些更高级的样式, 那么我们可以通过使用 MaterialButton 样式中的一组属性来完成此操作. app:icon: 用于定义在按钮开始时显示的 drawable ?...BottomAppBar 可以通过类似于下面的方式添加到你的布局中: <android.support.design.bottomappbar.BottomAppBar android:layout_width...这可以通过编码方式完成,如下所示: bottom_app_bar.replaceMenu(R.menu.main) 当涉及到定义底部应用栏的样式时, 可以使用几个属性来完成此操作. app:fabAttached

1.8K2 0

如何使vmware虚拟机中的Redflag Linux操作系统能够上网？

第一种情况：主机使用PPPOE拨号上网方法一：NAT方式 1、先关闭虚拟机中的操作系统，回到虚拟机主界面双击主界面右上方的的“Ethernet”，弹出“Network Adapter”对话框，选择...“NAT” 2、启动虚拟机操作系统，设置IP为动态获取，即通过DHCP获得。...此时虚拟机中的操作系统用的是主机的IP，主机能够上网，那么虚拟机也能。...方法二：Host-only方式 1、先关闭虚拟机中的操作系统，回到虚拟机主界面双击主界面右上方的的“Ethernet”，弹出“Network Adapter”对话框，选择“Host－only” 2、右击拨号上网的连接...，且不用再拨号方法三：Bridge方式这种方式，虚拟机最接近一台真实的机器 1、先关闭虚拟机中的操作系统，回到虚拟机主界面双击主界面右上方的的“Ethernet”，弹出“Network Adapter

1.4K3 0

Windows Phone 8.1 新特性 - 控件之应用程序栏

接下来我们会用几篇文章来了解一下这些变化给开发者带来的影响，以及我们如何更好的利用WP8.1 的新特性。...下面我们来看在WP8.1 中如何实现应用程序栏：在Windows Store App 中，应用程序栏分为两种，TopAppBar 和 BottomAppBar，分别用做顶部导航栏和底部命令栏。...而在WP8.1 中只有BottomAppBar，它起到的作用跟WP8 中的ApplicationBar是相同的。...BottomAppBar 可以包含CommandBar, 而CommandBar 中可以使用两种命令元素，主命令元素和辅助命令元素。这两种元素在作用上类似于WP8 中的按钮和菜单项。...总体来说新的应用程序栏给我们带来了更多的可选择性和便利，按钮可以有多种表现方式，而不是单一的图片方式；按钮可选择是否显示文字标签，等等。

7015 0

Flutte部件目录-基本部件（三）顶

BottomAppBar,这是一个水平条，通常使用bottomNavigationBar属性显示在应用程序的底部 ....final resizeToAvoidBottomPadding → bool 主体（和其它浮动部件）是否应该自己调整大小以避免窗口的底部填充. [...]...final bottomOpacity → double 应用栏底部的不透明度如何. [...] final brightness → Brightness 应用栏材质的亮度。...它的高度将与应用栏的整体高度相同. [...] final iconTheme → IconThemeData 用于应用程序栏图标的颜色，不透明度和大小。...final toolbarOpacity → double 应用栏的工具栏部分的透明度如何. [...]

6.3K1 0

Flutter沉浸式状态栏AppBar导航栏仿咸鱼底部凸起导航栏效果

如下图：状态栏是指android手机顶部显示手机状态信息的位置。 android 自4.4开始新加入透明状态栏功能，状态栏可以自定义颜色背景，使titleBar能够和状态栏融为一体，增加沉浸感。...如上图Flutter状态栏默认为黑色半透明，那么如何去掉这个状态栏的黑色半透明背景色，让其和标题栏颜色一致，通栏沉浸式，实现如下图效果呢？且继续看下文讲述。 ? ?...，被称之为 Android 世界的Swift，由 JetBrains 设计开发并开源。...如上图：BottomAppBar组件凸起凹陷导航栏配置 int _selectedIndex = 0; // 创建数组引入页面 List pglist = [HomePage(), FindPage()...: pglist[_selectedIndex], // 抽屉菜单 // drawer: new Drawer(), // 底部凸起凹陷导航栏 bottomNavigationBar: BottomAppBar

5K4 1

第3天：CSS浮动、定位、表格、表单总结

今天学的是浮动、定位、表格、表单等内容，这些是CSS中最容易混淆的知识，有许多小技巧在写代码过程中需要注意。...下面是主要知识点：一、float浮动 1、块元素在一行显示 2、内联元素支持宽高 3、默认内容撑开宽度 4、脱离文档流 5、提升层级半层二、clear清除浮动 1、加高（扩展性不好）给浮动元素的父级设置同样的高度...、提升层级绝对定位（absolute） 1、使元素完全脱离文档流 2、使内嵌支持宽高 3、块属性内容撑开宽度 4、如果有定位父级相对于定位父级发生偏移，没有定位父级相对于document发生偏移 5、...opacity:(0~1);透明度参数从0到1（标准浏览器）父级加了透明度，子级也会继承透明度； IE滤镜：filter:alpha(opacity=0~100);（IE6、IE7浏览器透明度设置）...file"/> hidden 隐藏不让用户看到，需要存储 button 按钮最后做了个定位的小练习： <!

1.6K4 0

Flutter 入门指北之快速搭建界面(含Flutter知识体系)

// 背景 title: Text('AppBar Demo', style: TextStyle(color: Colors.red)), // 标题内容 // 末尾的操作按钮列表...，未点击右侧按钮如左侧所示，点击右侧按钮会弹出相应的 mune ?...main() { runApp(DemoApp()); // 添加如下代码，使状态栏透明 if (Platform.isAndroid) { var style = SystemUiOverlayStyle...半透明蒙层」没有了 ?...(8.0), this.child, // 用于自定义按钮的内容 this.icon, // 按钮的图标 this.offset = Offset.zero, // 展示时候的便宜

1.7K2 0

HTML+CSS高级

: hidden; 清除浮动 --》右下角等需要的元素将不可见（比如分享到、回到顶部等按钮） 2.7.1 overfloat: [ hidden | scroll...1.1 它是一个独立的渲染区域，只有Block-level box参与，它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。...，默认值“按钮” 1.1.1.5 reset 不需要设置name，不用提交，value是显示的值，默认值“重置” 1.1.1.6 button...: hidden; 清除浮动 --》右下角等需要的元素将不可见（比如分享到、回到顶部等按钮） 2.7.1 overfloat: [ hidden | scroll...1.1 它是一个独立的渲染区域，只有Block-level box参与，它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。

5.8K6 1

Android Compose 新闻App（六）导航动画、WebView、浮动按钮、底部导航

正文一些应用有一些花里花哨的操作就会让人眼前一亮，大部分花里胡哨的操作就是动画，那么作为Compose的导航也是可以使用动画的，下面我们来使用一下：一、导航动画 ① 添加依赖导航动画是需要一个依赖库的...三、FloatingActionButton使用浮动按钮在日常开发中，也是很常见的，下面在我们的EpidemicNewsListPage中添加一个浮动按钮。...因为页面使用了Scaffold，因此可以直接通过Scaffold去添加浮动按钮。...添加浮动按钮的同时，我把TopAppBar中多余的内容清除掉了，下面我们运行一下：点击时弹出Toast，默认显示在页面的右下角。那如果要改位置呢？...floatingActionButtonPosition = FabPosition.End 这里疫情详情页面已经是写完了，你会看到当前页面中有一个浮动按钮，那么这个按钮就是用来返回主页面的，App现在还没有主页面的

4.1K2 0

如何操作SAP UI5应用Footer区域工具栏按钮的背景颜色

Recently I get a customer requirement to remove the background color of edit but...

1K3 0

Material的布局原则

应用的背景类似于一张平坦、不透明质地的纸片，应用的行为也模仿纸片，可以改变大小、拖动及把多个纸片粘合在一起。在本规范中，构成应用的表面被成为材料或材料片。...应用之外的元素，例如系统状态栏，和应用内容是分开的，不会被视为材料。更多关于材料的细节，详见材料属性。接缝两片材料的公共边缘被成为接缝。当通过接缝连接时，它们会一起移动。...两片材料的接缝阶层两个 Z 轴位置不同的材料片重叠时，会形成阶层。这两个材料会相互独立移动。两片重叠的材料构成的阶层浮动操作按钮浮动操作按钮浮动操作按钮是和工具栏分离的圆形纸片。...它表示单个被提升的操作。如果它和阶层中的内容创建有关，则可以跨越一个阶层。跨阶层的浮动操作按钮如果浮动操作按钮与两个材料的内容都有关，则可以跨越接缝。...不要引入一个装饰用的接缝，来为浮动操作按钮提供锚点。跨接缝的浮动操作按钮

1K4 0

Flutter lesson 7: Flutter组件之基础组件（三）

centerTitle 标题是否居中显示，默认值根据不同的操作系统，显示方式不一样。安卓可能在左侧，IOS则是居中。 body 主题内容区域，这个区域就不介绍了，body可以设置各种Widget。...floatingActionButton 这是一个浮动按钮，注意参数就是一个child（一般是一个Icon），其次就是 onPressed 点击事件。...在右下角增加一个浮动按钮 floatingActionButton: FloatingActionButton( child: Icon(Icons.add), onPressed: () =...> {}, ), floatingActionButtonLocation 前面讲的是设置一个浮动按钮，这个浮动按钮的位置默认是在右下角。...如果是要设置这个浮动按钮的位置，就需要用到FloatingActionButtonLocation floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked

1.5K5 0

Flutter：AnimatedOpacity 示例

前言顾名思义，AnimatedOpacity的目的是在给定的持续时间内为其子项的不透明度设置动画： AnimatedOpacity({ Key? key, Widget?...预览 image-20220519081942888 我们要构建的示例应用程序有一个浮动按钮。...第一次按下此按钮时，图片、琥珀色框和绿色框将从不可见变为完全可见。当第二次按下浮动按钮时，这些东西会从可见变为不可见。...'Show' : 'Hide'), )); } } 参考不透明度（维基百科） AnimatedOpacity 类(flutter.dev) 曲线类(flutter.dev) 曲线类...它使小部件的外观或离开更加自然和美丽。

4832 0

《iOS Human Interface Guidelines》——Designing for iOS服从内容指示清晰通过深度来传达

这里有一些方法可以使最重要的内容和功能变得清晰和易于交互。使用大量的负空间。负空间可以使重要的内容和功能更加的明显和易于理解。负空间还会传达一种宁静的感觉，使app看上去更加的专注和有效。...无论你使用San Francisco还是自定义的字体，确保使用动态类型，这样你的app可以在用户选择了不同的文本尺寸时做出响应。采取没有边界的按钮。在默认情况下，所有的按钮都是无边界的。...在内容区域，一个无边界的按钮通过上下文、颜色和一个呼唤操作的标题来表明交互。当它起作用时，一个内容区域的按钮可以展示一个稀薄的边界或者有颜色的背景来使其有差异。...通过使用半透明的背景和在主屏幕上浮动出现，文件夹将自己的内容和屏幕上其余部分区分开来了。提醒事件像所展示的那样在层级中显示了清单。当用户操作一个清单时，其余清单会一起收拢到屏幕的底部去。...今天的日期依然高亮，年份则在返回按钮上显示，所以用户可以清楚的知道他们在哪个视图，从哪个视图来到这个视图的，以及如何回到原来的视图。

5383 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭