滑动以显示

允许用户滑动组件以显示额外操作。

滑动以显示组件允许您向芯片和卡片添加额外操作,尤其是在它们出现在列表中时。此组件使用户无需离开屏幕即可快速完成任务。

用户可以部分地向左滑动芯片和卡片以访问这些操作,然后点击操作以完成它。用户还可以完全向左滑动芯片和卡片以快速提交主要操作。

此组件有两个插槽用于这些操作

  1. 主要操作
  2. 次要操作(可选)

结构

显示的操作

开发者可以根据其独特的用例自定义操作。请考虑这些操作中使用的颜色和图标,以帮助用户了解其含义。

显示的操作在所有语言区域中都显示在同一侧。

  1. 主要操作
  2. 次要操作(可选)

提交主要操作

要提交主要操作,用户可以点击按钮或继续向左滑动。通过这种方式,按钮扩展到屏幕的整个宽度并显示标签。操作在选中后会淡出。

第一个示例显示了**单按钮选项**。第二个示例显示了**双按钮选项**。

撤消操作

对于破坏性操作,请添加撤消组件以允许用户撤消这些操作。将撤消功能添加到主要操作。

如果添加了撤消功能,则会显示撤消芯片按钮来代替已提交的操作。短暂时间后,撤消操作会淡出,系统会完成已提交的操作。

滑动阈值

滑动以显示组件的行为取决于用户在屏幕上滑动的距离。

  • 如果用户滑动的距离小于屏幕的 50%,则组件会弹回其起始位置,并且不会执行任何操作。
  • 如果用户滑动的距离在屏幕全宽的 50% 到 75% 之间,则组件会保持部分可见,并且会显示与组件关联的操作。
  • 如果用户滑动的距离超过屏幕全宽的 75%,则组件会消失,系统会自动执行主要操作。

以下材质主题组件实现了滑动以显示行为

在卡片上

以下屏幕截图显示了使用SwipeToRevealCard类时滑动以显示组件的外观

在芯片上

以下屏幕截图显示了使用SwipeToRevealChip类时滑动以显示组件的外观