HoloLens2开发-MRTK2.5-按钮

按钮为用户提供了一种触发立即动作的方法。它是混合现实中最基础组件之一。MRTK提供各种类型的按钮预制件。

MRTK中的按钮预设

MRTK/SDK/Features/UX/Interactable/Prefabs 文件夹下的按钮预制件示例

基于Unity UI 图像/图形 的按钮

• UnityUIInteractableButton.prefab
• PressableButtonUnityUI.prefab
• PressableButtonUnityUICircular.prefab
• PressableButtonHoloLens2UnityUI.prefab

基于3D触碰的按钮

Button（Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/Button.prefab）是基于可交互的概念是提供一种用于按钮或其他类型的交互式表面的容易UI控件。基础按钮支持所有可用的输入方法，包括用于近距离交互的关节手输入以及用于远距离交互的凝视+轻击。您也可以使用语音命令来触发按钮。

PressableButtonHoloLens2（Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonHoloLens2.prefab）是HoloLens 2的外壳样式按钮，支持直接手跟踪输入的按钮精确移动。它结合了Interactable脚本和PressableButton脚本。

对于HoloLens 2，建议使用带不透明背板的按钮。由于以下可用性和稳定性问题，不建议使用透明按钮：

• 图标和文字很难在实际环境中阅读
• 当事件触发时很难理解
• 通过HoloLens 2的深度LSR稳定功能，通过透明平面显示的全息图可能会不稳定

如何使用按钮

基于Unity UI的按钮

在您的场景中创建画布（GameObject-> UI-> Canvas）。在“画布”的“检查器”面板中：

• 单击“转换为MRTK画布”
• 点击“添加 NearInteractionTouchableUnityUI”
• 设置Rect Transform 组件X，Y，Z设置为0.001

然后，拖动PressableButtonUnityUI（Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonUnityUI.prefab），PressableButtonUnityUICircular（Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonUnityUICircular.prefab）或PressableButtonHoloLens2UnityUI（Assets/MRTK/SDK/Features/UX/Interactable/Prefabs/PressableButtonHoloLens2UnityUI.prefab）添加到Canvas上。

基于 3D 触碰的按钮

只需将PressableButtonHoloLens2（Assets / MRTK / SDK / Features / UX / Interactable / Prefabs / PressableButtonHoloLens2.prefab）或PressableButtonHoloLens2Unplated（Assets / MRTK / SDK / Features / UX / Interactable / Prefabs / PressableButtonHoloLens2Unplated.prefab）拖动到场景中即可。这些按钮预制件已经配置为对各种类型的输入（包括铰接的手部输入和注视）提供视听反馈。

预设本身以及可交互组件中暴露的事件可用于触发其他操作。HandInteractionExample场景中的可按下按钮使用Interactable的OnClick事件来触发立方体颜色的更改。不同类型的输入方法（如注视，轻敲，手动射线以及可按下按钮脚本中的物理按钮按下）将触发此事件。

您可以通过按钮上的来配置可按下按钮何时触发OnClick事件PhysicalPressEventRouter。例如，你可以设置的OnClick Event 时，首先按下按钮，而不是按下并释放，通过设置可交互点击到事件在按下。

利用特定于关节手输入的状态信息，您可以使用按压的按键事件-触摸开始，触摸结束，按钮按下，按钮来释放。但是，这些事件不会响应轻击，手动射线或眼睛输入而触发。为了支持近距离和远距离交互，建议使用Interactable的OnClick事件。

互动状态

在空闲状态下，按钮的前面板不可见。当手指靠近或视线输入的光标对准表面时，前面板的发光边框变得可见。前面板表面上的指尖位置还有其他突出显示。用手指推动时，前板会用指尖移动。当指尖触摸前面板的表面时，它会显示出细微的脉冲效果，以提供触摸点的视觉反馈。

在HoloLens 2外壳样式按钮中，有许多视觉提示和辅助功能可增加用户对交互的信心。

接近灯	重点突出	压缩笼	触发脉冲

微妙的脉冲效果由可按下的按钮触发，该按钮查找存在于当前交互指针上的ProximityLight。如果找到任何接近灯，则将ProximityLight.Pulse调用该方法，该方法将自动为着色器参数设置动画以显示脉冲。

检查器属性

Box Collider 按钮前面板的 Box Collider。

Pressable Button 按钮通过手按互动进行按钮移动的逻辑。

Physical Press Event Router 此脚本将事件从手新闻互动发送到Interactable。

Interactable  交互可处理各种类型的交互状态和事件。此脚本直接处理HoloLens的注视，手势和语音输入以及沉浸式耳机运动控制器输入。

Audio Source 音频反馈剪辑的Unity音频源。

NearInteractionTouchable.cs 使关节运动的手可触摸任何对象时需要。

预制布局

所述 ButtonContent 对象包含前板，文本标签和图标。该前板响应使用索引指尖附近 Button_Box 着色器。它显示发光的边框，接近光和触摸时的脉冲效果。文本标签是使用 TextMesh Pro 制作的。SeeItSayItLabel的可见性由Interactable 的主题控制。

如何更改图标和文字

MRTK 按钮使用一个 ButtonConfigHelper 组件来帮助您更改按钮的图标，文本和标签。（请注意，如果所选按钮上没有元素，则可能缺少某些字段。）

创建和修改图标集

的图标集是一组共享的由所使用的图标资产的 ButtonConfigHelper 组件。支持三种图标样式。

• 使用图标在四边形上渲染四边形图标 MeshRenderer。这是默认的图标样式。
• 精灵图标使用渲染 SpriteRenderer。如果您希望将图标导入为Sprite工作表，或者希望与Unity UI组件共享图标资源，这将非常有用。要使用此样式，您将需要安装Sprite Editor软件包（ Windows- > Package Manager-> 2D Sprite）
• 字符图标使用 TextMeshPro 组件呈现。如果您更喜欢使用图标字体，这将很有用。要使用HoloLens图标字体，您将需要创建 TextMeshPro 字体资源。

要更改按钮使用的样式，请在ButtonConfigHelper中展开“图标”下拉列表，然后从“图标样式”下拉列表中进行选择。

您可以使用资产菜单创建新的按钮图标集：“创建”>“混合现实工具箱”>“图标集”。要添加方形图标和精灵图标，只需将它们拖到各自的数组中即可。要添加字符图标，必须首先创建并分配字体资源。

在MRTK 2.4及更高版本中，建议将自定义图标纹理移到 IconSet 中。要将项目中所有按钮上的资产升级为新的建议格式，请使用ButtonConfigHelperMigrationHandler。（混合现实工具包->实用程序->迁移窗口->迁移处理程序选择-> Microsoft.MixedReality.Toolkit.Utilities.ButtonConfigHelperMigrationHandler）

导入升级按钮所需的Microsoft.MixedRealityToolkit.Unity.Tools程序包。

如果在迁移过程中默认图标集中未找到图标，则将在MixedRealityToolkit.Generated / CustomIconSets中创建自定义图标集。将出现一个对话框，表明已经发生了。

创建 HoloLens 图标字体资产

首先，将图标字体导入Unity。在Windows计算机上，您可以在Windows / Fonts / holomdl2.ttf中找到默认的HoloLens字体。将此文件复制并粘贴到您的Assets文件夹中。

接下来，通过窗口> TextMeshPro>字体资产创建器打开TextMeshPro字体资产创建器。这是用于生成HoloLens字体图集的推荐设置。要包括所有图标，请将以下Unicode范围粘贴到“字符序列”字段中：

E700 - E702，E706，E70D - E70E，E710 - E714，E718，E71A，E71D - E71E，E720，E722，E728，E72A - E72E，E736，E738，E73F，E74A - E74B，E74D，E74F - E752，E760 - E761，E765，E767- E769，E76B - E76C，E770，E772，E774，E777，E779 - E77B，E782 - E783，E785 - E786，E799，E7A9 - E7AB，E7AF - E7B1，E7B4，E7C8，E7E8 - E7E9，E7FC，E80F，E821，E83F，E850 -E859，E872 - E874，E894 - E895，E8A7，E8B2，E8B7，E8B9，E8D5，E8EC，E8FB，E909，E91B，E92C，E942，E95B，E992 - E995，E9E9 - E9EA，EA37，EA40，EA4A，EA55，EA96，EB51 - EB52，EB65，EB9D - EBB5，EBCB - EBCC，EBCF - EBD3，EC03，EC19，EC3F，EC7A，EC8E - EC98，ECA2，ECD8 - ECDA，ECE0，ECE7 - ECEB，ED17，EE93，EFA9，F114 - F120，F132，F181，F183 -F186

生成字体资产后，将其保存到您的项目中，并将其分配给Icon Set的Char Icon Font字段。现在将填充“可用图标”下拉列表。要使按钮可以使用图标，请单击它。它将被添加到“选定的图标”下拉列表中，并现在显示在“ButtonConfigHelper.您可以为该图标添加标签”中。这样可以在运行时设置图标。

公共 无效 SetButtonToAdjust（）
{
    ButtonConfigHelper  buttonConfigHelper  = 游戏物体。GetComponent < ButtonConfigHelper >（）;
    buttonConfigHelper。SetCharIconByName（“ AppBarAdjust ”）;
}

要使用图标集，请选择一个按钮，展开中的图标下拉列表ButtonConfigHelper并将其分配给图标集字段。

如何更改按钮的大小

HoloLens 2的外壳样式按钮的尺寸为32x32mm。要自定义尺寸，请在预制按钮中更改这些对象的尺寸：

1. 前面板
2. 四背板下
3. 根上的Box Collider

然后，在按钮根目录中的NearInteractionTouchable脚本中单击“修复边界”按钮。

更新FrontPlate的大小 

更新四边形的大小 

更新Box Collider的尺寸 

点击“修复界限” 

语音命令（“见即说”）

语音输入处理程序Pressable Button中 的Interactable脚本已经实现IMixedRealitySpeechHandler。可以在此处设置语音命令关键字。

语音输入配置文件 此外，您需要在全局语音命令配置文件中注册语音命令关键字。

即按即说标签 预制按钮可按按钮在SeeItSayItLabel对象下具有占位符TextMesh Pro标签。您可以使用此标签将按钮的语音命令关键字传达给用户。

如何从头开始制作按钮

您可以在PressableButtonExample场景中找到这些按钮的示例。

1.创建带有立方体的可按下按钮（仅在交互作用附近）

1. 创建一个Unity多维数据集（“游戏对象”>“ 3D对象”>“多维数据集”）
2. 添加PressableButton.cs脚本
3. 添加NearInteractionTouchable.cs脚本

在PressableButton“检查器”面板中，将多维数据集对象分配给“移动按钮外观”。

选择多维数据集时，您将在对象上看到多个彩色图层。这样可以在“压力设置”下可视化距离值。使用手柄，可以配置何时开始按下（移动对象）以及何时触发事件。

当您按下按钮时，它将移动并生成PressableButton.cs脚本中公开的适当事件，例如TouchBegin（），TouchEnd（），ButtonPressed（），ButtonReleased（）。

2.将视觉反馈添加到基本的多维数据集按钮

MRTK标准着色器提供了多种功能，可轻松添加视觉反馈。创建材质并选择明暗器Mixed Reality Toolkit/Standard。或者，您可以使用或复制/SDK/StandardAssets/Materials/使用MRTK标准着色器的现有材料之一。

选中Hover Light并Proximity Light在Fluent选项下。这将为近手（接近光）和远指针（悬停光）交互提供视觉反馈。

3.将音频反馈添加到基本的多维数据集按钮

由于PressableButton.cs脚本公开了诸如TouchBegin（），TouchEnd（），ButtonPressed（），ButtonReleased（）之类的事件，因此我们可以轻松分配音频反馈。只需将Unity添加Audio Source到多维数据集对象，然后通过选择AudioSource.PlayOneShot（）分配音频剪辑。您可以在/SDK/StandardAssets/Audio/文件夹下使用MRTK_Select_Main和MRTK_Select_Secondary音频剪辑。

4.添加视觉状态并处理远距离交互事件

Interactable是一个脚本，可轻松为各种类型的输入交互创建可视状态。它还处理远距离交互事件。添加Interactable.cs和拖曳和多维数据集对象拖放到目标场下配置文件。然后，使用ScaleOffsetColorTheme类型创建一个新主题。在此主题下，您可以为特定的交互状态（例如Focus和Pressed）指定对象的颜色。您也可以控制缩放和偏移。选中缓动并设置持续时间以使视觉过渡平滑。

您将看到对象对远（手光线或凝视光标）和近（手）交互都做出响应。

自定义按钮示例

在HandInteractionExample场景中，查看同时使用的钢琴和圆形按钮示例PressableButton。

每个钢琴键都有一个PressableButton和NearInteractionTouchable分配的脚本。确认“本地转发”方向NearInteractionTouchable正确是很重要的。它在编辑器中由白色箭头表示。确保箭头指向远离按钮正面的位置：

也可以看看

• Interactable（可互动的）
• 视觉主题