浮动操作按钮 (FAB) 表示页面中的主要操作。但是，它并不仅限于单个操作。也可以包含任意数量的子操作。更重要的是，它也可以在你的页面或布局中内联使用。
¥A Floating Action Button (FAB) represents the primary action in a Page. But, it’s not limited to only a single action. It can contain any number of sub-actions too. And more importantly, it can also be used inline in your Pages or Layouts.
请注意，你无需 QLayout 即可使用 FAB。
¥Note that you don’t need a QLayout to use FABs.
用法(Usage)
¥Usage
FAB 有两种类型：可扩展（包含子操作）和不可扩展。
¥There are two types of FABs: expandable (has sub-actions) and non-expandable.
提示
要查看选项的详尽列表，请阅读 API 卡片（位于本页面顶部）。
¥For an exhausting list of options, please read the API cards (at the top of this page).
不可扩展(Non-Expandable)
¥Non-Expandable
如果你想要一个不可扩展的 FAB，你只需要一个圆形按钮 - 如果在 QLayout 上使用，则需要用 QPageSticky 包裹。
¥If you want a non-expandable FAB, all you need is a round button – wrapped in QPageSticky if used on a QLayout.
可扩展(Expandable)
¥Expandable
内部标签(Internal labels)
¥Internal labels
当标签位于内部且 QFab 垂直打开（向上或向下）时，你还可以选择如何垂直对齐子操作：
¥When the labels are internal and your QFab opens up vertically (up or down) then you also have the ability to choose how to vertically align the sub-actions:
外部标签(External labels)
¥External labels
默认情况下，当标签位于主 QFab（而非子操作）的外部时，它仅在 QFab 打开时显示。但是，你可以通过为 hide-label 属性设置布尔值来覆盖它。
¥By default, when the label is external on the main QFab (not the sub-actions), it gets shown only when QFab is opened. However, you can override that by setting a Boolean value for hide-label prop.
隐藏图标(Hide icons)
¥Hide icons
如果我们隐藏图标（通过特定属性），我们至少应该使用内部标签：
¥If we hide the icon (through specific prop), we should at least use an internal label:
填充(Padding)
¥Padding
QFab 的默认填充为 “md”，QFabAction 的默认填充为 “sm”。但是，你可以使用 padding 属性来自定义它（也接受 CSS 单位）：
¥The default padding for QFab is “md” and for QFabAction is “sm”. However, you can use padding prop to customize it (accepts CSS units too):
方形样式(Square style)
¥Square style
插槽v2.4+(Slots v2.4+)
¥Slots
注意下面 QFab 的插槽和 QFabAction 的插槽：
¥Notice the slots for QFab and the slots for QFabAction below:
使用 QPageSticky(With QPageSticky)
¥With QPageSticky
可拖动(Draggable)
¥Draggable
下面是一个使用 TouchPan 使 QFab 可在屏幕上拖动的优秀示例。
¥Below is a nice example of using TouchPan for making the QFab draggable across the screen.