其它名称：变形控件。

一、问题总结

仅向用户显示应用系统当前模式下可用的控件。

二、截图示例

image.png

三、参考用法

  • 用于当某些控件不需要同时显示时。
  • 用于想清理程序窗口中不必要和用不到的控件时[1]。
  • 用于程序中存在多种用户体验模式（播放/暂停、开/关）时。

四、解决方案

在用户界面中，能够显示什么信息，能够进行什么操作，这取决于应用程序当前的模式。例如，当视频暂停时，播放操作应该可用，但停止操作就不应当能用。

在每种模式中，只显示最常用和用户最想要的操作。在模式之间，强调提供的信息和操作的不对称性、不完整性、有问题，促使用户在模式之间切换。

确定可变形的控件在不同模式中保持一致的外观，控件中的文体字体和文本大小可以相同，但文本颜色在不同模式中可以不一样。

本模式适用于存在相反动作的模式，例如

  • 开/关
  • 喜欢/不喜欢
  • 关注/取消关注
  • …

附录

[1] Use when you want to declutter the screen with unnecessary and unavailable controls.
[2] Information presented and actions available in a user interface element depend on its mode.
[3] Design affordance in each mode toward the most common or wanted interactions and emphasize asymmetry, incompleteness, or something being wrong to push users toward changing modes.
[4] Morphing Controls work well with binary actions.
[5] 原文地址