按钮 - MRTK3

按钮主

按钮为用户提供了触发即时操作的方法。 它是混合现实中最基础的组件之一,提供令人满意且可靠的按钮交互对于高质量的混合现实体验至关重要。 MRTK 提供两类按钮预制:基于画布和非基于画布的预制。 这两种配置都使用 PressableButton 脚本(扩展的 StatefulInteractable 子类)包括特定于按钮的行为。

详细了解混合画布 UI 系统的工作原理。

示例场景

如果使用开发模板项目,可以使用多个示例场景来演示可用的按钮预制。

CanvasUITearSheet.unity 显示 MRTK 中所有基于画布的按钮预制变量。

画布泪表

CanvasExample.unity 演示了使用基于画布的组件生成更大布局的一些示例。

画布示例场景

UITearSheet.unity 显示 MRTK 中所有可用的非基于画布的按钮预制变量。

按钮示例场景

Prefabs (Canvas)

基于画布 的按钮灵活且可配置,可调整为任何维度或比例。 因此,仅提供了几个按钮预制件。

  • EmptyButton 提供可按下的表面/前板、全息背板和发光效果。 没有文本、图标、标签或其他内容。 如此抽象的类似按钮的控件可以生成为此预制的变体,而不会干扰文本或图标内容。
  • ActionButton 是一个简单的按钮,其中包含图标、文本和标签。 这些各个组件可以启用或禁用,布局系统将相应地进行调整。

可以将其他增强功能添加到按钮,例如切换开关指示器。 不应随前板一起移动的功能应附加到背板组件。

添加切换开关

预制件 (非画布)

非画布按钮不可调整大小;因此,大量按钮预制件在大小和功能的许多排列中提供。 这些预制符号采用以下格式命名: PressableButton_SIZE_STYLE。 例如,

  • PressableButton_32x32mm_IconAndText:带有图标和文本的 32x32mm 大小按钮
  • PressableButton_128x32mm_SinglelineTextWithSubtitle:128x32mm 尺寸宽按钮,带有单行文本 + 副标题文本

结构 (Canvas)

可以打开/关闭 ActionButton 的不同部分,以自定义按钮的外观和行为方式。 我们剖析了两种不同的可能配置,以显示按钮预制的不同部分。 这些屏幕截图中不显示“backglow”,因为该按钮未被主动按下。

首先,一个更大的配置,其中主文本对象处于活动状态,并使用内联样式显示标头和子文本。 大型画布按钮结构 其次,一个较小的配置,该配置处于活动状态,用于显示图标下方的操作的说明。 主 Text 对象处于禁用状态。 小画布按钮结构

结构 (非画布)

以下屏幕截图显示了非基于画布的按钮的结构。

非画布按钮结构

PressableButton

PressableButton 类派生自 StatefulInteractable 特定于按钮的新函数和重写函数。 在 检查器中,除了所有其他可配置设置之外,还可以配置与卷压相关的设置 StatefulInteractablePressableButton 检查器屏幕截图

使用按钮构造 UI

使用多个按钮创建菜单或 UI 面板时,建议使用共享的背板几何图形。 通过使用共享背板,我们可以降低视觉干扰并提高可用性。 下面是在共享背板顶部布局按钮的一些示例。

构造 UI 1

构造 UI 2

构造 UI 3