扩展悬浮按钮 (Extended FAB)
扩展悬浮按钮 (Extended FAB) 是 FAB 的进阶版,它包含文本标签,可以提供更清晰的操作指向。

核心结构 (Anatomy)

- 容器 | 2. 文本标签 | 3. 图标 (可选)
代码实现
类名差异
ExtendedFloatingActionButton 实际上是 MaterialButton 的子类,而不是 FloatingActionButton 的子类。因此它的属性(如 app:icon)与 MaterialButton 一致。
xml
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:id="@+id/extendedFab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="开始撰写"
app:icon="@drawable/ic_edit"
app:layout_anchor="@id/recyclerView"
app:layout_anchorGravity="bottom|end" />kotlin
// 展开:显示图标和文字
extendedFab.extend()
// 折叠:只显示图标,变成圆形的 FAB
extendedFab.shrink()最佳实践
自动缩放
一个常见的交互模式是:当列表向下滚动时调用 shrink(),当向上滚动或到达顶部时调用 extend()。这能平衡操作的可见性与内容的展示空间。
核心属性
| 属性 | 描述 | 默认值 |
|---|---|---|
app:icon | 按钮图标 | null |
app:iconPadding | 图标与文字的间距 | 12dp |
app:collapsedSize | 折叠状态下的大小 | 自动计算 |