Flutter 速度拨号

Flutter 包，用于渲染Material Design 速度拨号。

GitHub release License Classic API Docs Usage

用法

SpeedDial 小部件旨在放置在 Scaffold.floatingActionButton 参数中，取代 FloatingActionButton 小部件。您可以使用 Scaffold.floatingActionButtonLocation 参数设置其位置。它也可以与 Scaffold.bottomNavigationBar 和 Snackbar 一起使用。

空安全 从版本 3.0.5 开始可用（它也向后兼容，这意味着您也可以将其与非空安全代码一起使用）

标签

SpeedDial 可以接受任何小部件作为 label如果指定了 label，SpeedDial 将使用 Extended FloatingActionButton 属性。它还具有 activeLabel 属性，您可以使用该属性指定 SpeedDial 打开时显示的 label。它还带有其 labelTransitionBuilder，默认为淡入淡出过渡。

此外，每个子按钮都有 label 属性，该属性接受 String，可以使用 labelStyle 进行样式设置。如果您想指定一个小部件，则可以使用 labelWidget。如果未提供 label 参数，则不会渲染 label。

SpeedDial 的子类型（按优先级排序）

使用 animatedIcon 属性的动画图标

SpeedDial 的 AnimatedIcon 具有两个特定参数

  • animatedIcon 接受一个 AnimatedIconData 小部件
  • animatedIconTheme 接受 IconThemeData
使用 child & activeChild 属性的小部件

SpeedDial 的 Widget 有两个特定参数

  • child 接受一个小部件，是拨号未打开时的默认占位符。
  • activeChild 接受一个 Widget，是拨号打开时使用的小部件，非必需。
使用 icon & activeIcon 属性的 IconData

SpeedDial 的 IconData 有三个特定参数

  • icon 接受一个 IconData，是拨号未打开时的默认占位符。
  • activeIcon 接受一个 IconData，是拨号打开时使用的子 IconData，非必需。
  • iconTheme 接受其 IconThemeData，包括颜色和大小。

该包将自行处理动画。

处理间距

SpeedDial 有各种属性，您可以调整间距

  1. spacing – 此参数处理拨号与其子项之间的间距。

  2. spaceBetweenChildren – 顾名思义，用于调整每个子元素之间的间距

  3. childPadding – 这将调整子 SpeedDial 按钮的填充，这将帮助您更有效地控制子按钮的大小。

  4. childMargin – 这将帮助您调整子 SpeedDial 按钮与其 label 之间的边距。

按 WillPop 关闭

如果拨号已打开，按下返回按钮会自动关闭。如果您不想要此行为，只需将 closeDialOnPop 的值更改为 false 即可。

如何使用 openCloseDial 属性

  1. 创建一个名为 isDialOpen 的值通知器
ValueNotifier<bool> isDialOpen = ValueNotifier(false);
  1. 然后在 SpeedDial 中将 openCloseDial 设置为 isDialOpen

SpeedDial(
  ...
  openCloseDial: isDialOpen,
  ...
)
  1. 现在您可以更改拨号打开的状态
isDialOpen.value = false;

用法示例

有关更多信息，请参阅示例代码。

问题与反馈

如果您想提供反馈或报告错误，请提交一个issue。如果您想提问或建议想法，您可以发起讨论。谢谢！

贡献

欢迎所有 pull request。

GitHub

查看 Github