为什么捐赠
API 浏览器
联系站长
浮动操作按钮

浮动操作按钮 (FAB) 代表应用程序中的主要操作。但是,它不仅限于一个单一的行动。它也可以包含任意数量的子操作。更重要的是,它还可以在页面或布局中内联使用。

注意,不需要 QLayout 您也可以使用 FAB。

正在加载 QFab API...
正在加载 QFabAction API...

用法

FAB 有两种类型:可展开的(有子操作)和不可展开的。

TIP

关于完整的选项列表,请参考 API 卡片部分。

不可展开的

如果您想要一个不可展开的 FAB,您只需要一个圆形按钮 - 如果在 QLayout 上使用,则包装在 QPageSticky 中。

不可展开的



可展开的

可展开的



内部标签

内部标签



切换内部标签



当标签是内部的,并且您的 QFab 垂直打开(向上或向下)时,您还可以选择如何垂直对齐子操作:

垂直操作对齐



外部标签

默认情况下,当主 QFab(不是子操作)上的标签是外部的时,它只在 QFab 打开时显示。但是,您可以通过为 hide-label 属性设置布尔值来覆盖它。

外部标签



自定义样式的外部标签



切换外部标签



隐藏图标

如果我们隐藏图标(通过特定属性),我们至少应该使用内部标签:

隐藏图标



内边距

QFab 的默认内边距是 “md”,QFabAction 的默认内边距是 “sm”。但是,您可以使用 padding 属性来自定义它(也接受 CSS 单位):

调整内边距



方形样式

方形样式



插槽
v2.4+

注意下面 QFab 的插槽和 QFabAction 的插槽:

插槽:icon, active-icon 和 label



与 QPageSticky 一起使用

与 QPageSticky 一起使用



可拖动的

下面是一个使用 TouchPan 使 QFab 可以在屏幕上拖动的很好的例子。

可拖动的