1.開始使用電腦全像攝影遠端處理1. Getting started with PC Holographic Remoting

歡迎使用 HoloLens 2 教學課程。Welcome to the HoloLens 2 tutorials. 在這個兩部分的教學課程系列中,您將了解如何建立混合實境體驗示範,以及如何建立適用於全像攝影遠端的電腦應用程式。In this two-part tutorial series, you will learn how to create a mixed reality experience demonstration and how to create a PC app for Holographic Remoting.

在本教學課程中,您將了解如何建立混合實境體驗。In this tutorial, you'll learn how to create a mixed reality experience. 本教學課程將示範 UI 元素、3D 模型操作、模型裁剪,以及眼球追蹤功能。It will demonstrate UI elements, 3D model manipulation, model clipping, and eye-tracking features.

在第二個教學課程 (建立全像攝影遠端處理應用程式) 中,您將了解如何建立適用於全像攝影遠端處理的電腦應用程式。In the second tutorial, Create a Holographic Remoting application, you will learn how to create a PC app for Holographic Remoting. 並且隨時連線至 HoloLens 2,以提供在混合實境中視覺化 3D 內容的方法。And connect to HoloLens 2 at any point, providing a way to visualize 3D content in mixed reality.

目標Objectives

  • 匯入資產並設定場景Import assets and set up the scene
  • 使用 UI 元素和按鈕來與全像投影互動Interact with holograms using UI elements and buttons
  • 設定 3D 物件的裁剪功能Configure 3D objects for the clipping feature
  • 了解眼球追蹤的啟用工具提示Learn about activating tooltips with eye-tracking

必要條件Prerequisites

強烈建議 先完成 使用者入門教學課程系列或一些基本的 Unity 和 MRTK 體驗,再繼續執行。We strongly recommend completing the Getting started tutorials series or some basic prior experience with Unity and MRTK before continuing.

重要

  • 本教學課程系列的建議 Unity 版本是 Unity 2019 LTS。The recommended Unity version for this tutorial series is Unity 2019 LTS. 這個版本能取代上述連結必要條件中所述的任何 Unity 版本需求或建議。It supersedes any Unity version requirements or recommendations stated in the prerequisites linked above.
  • 透過 MRTK 專案進行全像攝影遠端處理只會使用舊版 XR。Holographic Remoting with MRTK projects will only work with legacy XR. 目前不支援 XR SDK。XR SDK is not supported at this time.

建立和準備 Unity 專案Creating and preparing the Unity project

在本節中,您將建立新的 Unity 專案,並使該專案準備好進行 MRTK 開發。In this section, you will create a new Unity project and get it ready for MRTK development.

為此,請先遵循初始化您的專案和第一個應用程式 (但不包括對您的裝置建置應用程式的指示),其中包括下列步驟:For this, first follow the Initializing your project and first application, excluding the Build your application to your device instructions, which includes the following steps:

  1. 建立 Unity 專案,並為其提供適當的名稱,例如「MRTK 教學課程」Creating the Unity project and give it a suitable name, for example, MRTK Tutorials

  2. 切換建置平台Switching the build platform

  3. 匯入 TextMeshPro 基本資源Importing the TextMeshPro Essential Resources

  4. 匯入混合實境工具組Importing the Mixed Reality Toolkit

  5. 設定 Unity 專案Configuring the Unity project

  6. 建立和設定場景並為場景提供適當的名稱,例如「電腦全像攝影遠端處理」Creating and setting the scene and give the scene a suitable name, for example, PC Holographic Remoting

然後遵循 變更空間感知顯示選項指示,將場景的 MRTK 設定檔變更為 DefaultHoloLens2ConfigurationProfileThen follow the Changing the Spatial Awareness Display Option instructions to change the MRTK configuration profile for your scene to the DefaultHoloLens2ConfigurationProfile. 將空間感知網格的顯示選項變更為 遮蔽Change the display options for the spatial awareness mesh to Occlusion.

匯入教學課程資產Importing the tutorial assets

下載並 匯入 MRTK.Tutorials.PCHolographicRemoting.unitypackageDownload and import the MRTK.Tutorials.PCHolographicRemoting.unitypackage.

提示

如需有關如何匯入 Unity 自訂套件的提示,您可以參閱匯入混合實境工具組 的指示。For a reminder on how to import a Unity custom package, you can refer to the Import the Mixed Reality Toolkit instructions.

匯入教學課程資產之後,您的 [專案] 視窗看起來應該會像這樣:After importing the tutorial assets, your Project window should look similar to this:

匯入教學課程資產後的 Unity 階層、場景和專案視窗

設定和準備場景Configuring and preparing the scene

在本節中,您將藉由新增一些教學課程 Prefab 來準備場景。In this section, you will prepare the scene by adding some of the tutorial prefabs.

在 [專案] 視窗中,瀏覽至 [資產] > [MRTK.Tutorials.PCHolograhicRemoting] > [Prefabs] 資料夾。In the Project window, navigate to Assets > MRTK.Tutorials.PCHolograhicRemoting > Prefabs folder. 按住 CTRL 鍵時,按一下下列六個 prefabs。While holding down the CTRL button, click on the below six prefabs.

  • ButtonParentButtonParent
  • ClippingObjectsClippingObjects
  • HandSpatialMapButtonHandSpatialMapButton
  • 指示Instructions
  • ModelParentModelParent
  • 平台Platform

Unity,已選取要新增至場景的 Prefabs

將這些模型從 [Prefabs] 資料夾拖放到 [階層] 視窗中。Drag-and-drop these models from the prefabs folder into the Hierarchy window.

新增的 Prefabs 仍保持選取狀態的 Unity

若要將焦點放在場景中的物件上,您可以按兩下 ModelParent 物件,然後再次將場景稍微縮小:To focus in on the objects in the scene, you can double-click on the ModelParent object, and then zoom slightly in again:

焦點位於 ModelParent 物件的 Unity

提示

如果您發現場景中的大圖示 (例如大型邊框的 'T' 圖示) 會造成干擾,您可以藉由切換 Gizmo 到關閉位置來將其隱藏。If you find the large icons in your scene, such as, the large framed 'T' icons distracting, you can hide these by toggling the Gizmos to the off position.

設定按鈕以操作場景Configuring the buttons to operate the scene

在本節中,您會將指令碼新增至場景中,以建立會示範模型切換和裁剪功能基本概念的按鈕事件。In this section, you will add scripts into the scene to create button events demonstrating the fundamentals of model switching and clipping functionality.

1.設定 Interactable (指令碼) 元件1. Configuring the Interactable (Script) component

在 [階層] 視窗中,展開 ButtonParent 物件,然後選取 NextButtonIn the Hierarchy window, expand the ButtonParent object and select the NextButton. 在 [偵測器] 視窗中,找出 Interactable (指令碼) 元件,然後按一下 OnClick ()+ 事件底下的 圖示。In the Inspector window, locate the Interactable (Script) component and click on + icon under OnClick () event.

已新增 NextButton OnClick 事件的 Unity

在 [階層] 視窗中保持選取 NextButton 物件,按一下 ButtonParent 物件並將其從 [階層] 視窗拖曳至您剛才所新增事件的空白 [無 (物件)] 欄位,讓 ButtonParent 物件可以從此按鈕接聽按下按鈕的事件:With the NextButton object still selected in the Hierarchy window, click-and-drag the ButtonParent object from the Hierarchy window into the empty None (Object) field of the event you just added to make the ButtonParent object listen for button click event from this button:

已設定 NextButton OnClick 事件接聽程式的 Unity

按一下相同事件的 [沒有函式] 下拉式清單。Click the No Function dropdown of the same event. 然後選取 [ViewButtonControl] > [NextModel ()],將 [NextModel ()] 函式設定為從這個按鈕引發按下按鈕事件時所觸發的動作:Then select ViewButtonControl > NextModel () to set the NextModel () function as the action that is triggered when the button pressed events is fired from this button:

具有 NextButton OnClick 事件動作選取路徑的 Unity

2.設定其餘按鈕2. Configuring the remaining buttons

針對其餘的每個按鈕,完成上述程序,將函式指派給 OnClick () 事件:For each of the remaining buttons, complete the process outlined above to assign functions to the OnClick () events:

  • 針對 PreviousButton 物件,指派 ViewButtonContro l > PreviousModel () 函式。For PreviousButton object, assign the ViewButtonContro l > PreviousModel () function.

  • 針對 ClippingButton,選取 ToggleButton > ToggleClipping () 函式。For ClippingButton select ToggleButton > ToggleClipping () function.

3.設定 View Button Control (指令碼) 和 Toggle Button (指令碼) 元件3. Configuring the View Button Control (Script) and Toggle Button (Script) components

現在您的按鈕已設定為示範模型切換和裁剪功能。Now your buttons are configured to demonstrate the model switching and clipping functionality. 現在可以將 3D 模型和裁剪物件新增至指令碼。It is time to add 3D models and the clipping objects to the script.

我們提供六種不同的 3D 模型作為示範,請展開 ModelParentobject 以公開這些 3D 模型。We have provided six different 3D models for demonstration, expand the *ModelParentobject _ to expose these 3D models.

在 [階層] 視窗中保持選取 ButtonParent 物件,在 [偵測器] 視窗中,找出 View Button Control (指令碼) 元件,然後展開 Models 變數。With the ButtonParent object still selected in the Hierarchy window, in the Inspector window, locate the _ View Button Control (Script)* component and expand the Models variable.

在 [大小] 欄位中,輸入您想要在場景中擁有的 3D 模型數目。In the Size field, enter the number of 3D models you would like to have in your scene. 在此案例中,此值會是 6。In this case, it would be six. 會建立欄位以新增新的 3D 模型。It will create fields for adding new 3D models.

具有 ViewButtonControl 指令碼元件欄位的 Unity

將 ModelParent 物件的每個子物件拖放到這些欄位。Drag and drop each child object of ModelParent Object into these fields.

已設定 ViewButtonControl 指令碼元件欄位的 Unity

從 [階層] 視窗中,將 ClippingObjects 物件拖放至 Toggle Button (指令碼) 元件的 [裁剪物件] 欄位。Drag and drop the ClippingObjects object from the Hierarchy window to the Toggle Button (Script) component Clipping Object field.

注意

只停留在按鈕父物件。Stay in button parent object only.

已設定 ToggleButton 指令碼元件欄位的 Unity

在 [階層] 視窗中,選取 [ClippingObjects] prefab,並在 [偵測器] 視窗中啟用以開啟裁剪物件。In the Hierarchy window, select the ClippingObjects prefab and enable it in the Inspector window to turn on the Clipping objects.

設定裁剪物件以啟用裁剪功能Configuring the clipping objects to enable clipping feature

在本節中,您會將 MarsCuriosityRover 物件的子物件轉譯器新增至個別的裁剪物件,以示範 MarsCuriosityRover 模型的裁剪。In this section, you will add MarsCuriosityRover object's child objects renderer into an individual clipping object to demonstrate the clipping of the MarsCuriosityRover model.

在 [階層] 視窗中,展開 ClippingObjects 物件,以公開您將在此專案中使用的三個不同裁剪物件。In the Hierarchy window, expand the ClippingObjects object to expose the three different clipping objects that you will be using in this project.

若要設定 ClippingSphere 物件,請按一下該物件,然後在 [偵測器] 視窗中,找出 Clipping Sphere (指令碼) 元件。To configure the ClippingSphere object, click on it, and in the Inspector window, locate the Clipping Sphere (Script) component. 在 [大小] 欄位中輸入您需要為 3D 模型新增的轉譯器數目。Enter the number of renderers in the size field that you need to add for your 3D model. 在此案例中,請為 MarsCuriosityRover 子物件新增 10 個。In this case, add 10 for MarsCuriosityRover child objects. 會建立欄位以新增轉譯器,並將 MarsCuriosityRover 物件的子模型物件拖放到這些欄位。It will create fields for adding renderers, drag and drop MarsCuriosityRover Object's child model objects into these fields.

已設定 ClippingSphere 指令碼元件欄位的 Unity

遵循相同的程序,並將 MarsCuriosityRover 的子物件轉譯器新增至 ClippingBoxClippingPlane 物件。Follow the same process and add MarsCuriosityRover's child objects renderers to the ClippingBox and ClippingPlane objects.

在本教學課程中,只會使用 MarsCuriosityRover 模型來示範裁剪功能。In this tutorial, only the MarsCuriosityRover model will be used for demonstrating the clipping feature. 這些模型會將裁剪功能新增至更多模型、增加轉譯器的大小,以及新增其個別的網格轉譯器。They were adding clipping features to more models, increasing the size of the renderer, and adding their individual mesh renderers.

設定眼球追蹤以醒目提示工具提示Configuring eye-tracking to highlight tooltips

在本節中,您將探索如何在專案中啟用眼球追蹤。In this section, you will explore how to enable eye tracking in your project. 例如,您將會實作功能以在查看 MarsCuriosityRover 組件時醒目提示附加至其中的工具提示,並且在您移開視線時將其隱藏。For example, you will implement the functionality to highlight tooltips attached to MarsCuriosityRover's parts while looking at them and hiding them, while you are looking away from them.

1.識別目標物件和相關聯的工具提示1. Identify target objects and associated tooltips

在 [階層] 視窗中,選取 [ModelParent] 物件。In the Hierarchy window, select the ModelParent object. 展開 [MarsCuriosity] -> [Rover],以尋找 MarsCuriosityRover 的五個主要部分: POI-CameraPOI-WheelsPOI-AntenaPOI-SpectrometerPOI-RUHF AntennaExpand the *MarsCuriosity -> Rover_ to find five main parts of the MarsCuriosityRover: _* POI-Camera**, POI-Wheels, POI-Antena, POI-Spectrometer, POI-RUHF Antenna.

  • 觀察與 [階層] 視窗中 MarsCuriosityRover 組件相關聯的五個對應工具提示物件。Observe five corresponding tooltip objects associated with MarsCuriosityRover parts in the Hierarchy window.
  • 當您查看 MarsCuriosityRover 組件時,將會設定這些物件以醒目提示體驗。You will be configuring these objects to highlight the experience when you look at the MarsCuriosityRover parts.

已選取並展開 Rover 物件的 Unity

2.在發生 Looking At Target () 和 On Look Away () 事件時實作2. Implement While Looking At Target () & On Look Away () events

在 [階層] 視窗中,選取 [POI-Camera] 物件。In the Hierarchy window, select the *POI-Camera _ object. 在 [偵測器] 視窗中,找出 Eye Tracking Target (指令碼) 元件,並且設定 While Looking At Target ()On Look Away () 事件,如下所示:In the Inspector window, locate the _ Eye Tracking Target (Script)* component and configure the While Looking At Target () & On Look Away () events as follows:

  • 對 [無 (物件)] 欄位,指派 POI-Camera ToolTip 物件To None (Object) field, assign the POI-Camera ToolTip object
  • While Looking At Target () 事件的 [沒有函式] 下拉式清單中,選取 [GameObject] > [SetActive (bool)]。From No Function dropdown of While Looking At Target () event, select GameObject > SetActive (bool). 選取其底下的 核取方塊,將工具提示醒目提示為當您查看目標物件時所觸發的動作。Select the Checkbox under it to highlight the tooltip as the action that is triggered when you look at the target object.

正在進行 EyeTrackingTarget WhileLookingAtTarget 事件設定的 Unity

  • 遵循相同的程序,然後按一下 On Look Away () 事件接聽程式的 [沒有函式] 下拉式清單。Follow the same process and click on the No Function dropdown of the On Look Away () event listener. 然後選取 [GameObject] > [SetActive (bool)],並將 [核取方塊] 保留空白以隱藏工具提示,作為當您將視線移開目標物件時所觸發的動作。Then select GameObject > SetActive (bool) and leave the Checkbox empty to hide the tooltip as the action that is triggered when you look away from the target object.

已設定 EyeTrackingTarget OnLookAway 事件的 Unity

遵循相同的程序,並且將個別的工具提示物件指派給其相同的 MarsCuriosityRover 組件 While Looking At Target ()On Look Away () 事件。Follow the same process and assign respective tooltip objects to their same MarsCuriosityRover parts While Looking At Target () & On Look Away () events.

若要啟用眼球追蹤,請遵循這些指導方針To enable eye tracking, please follow these guidelines.

恭喜!Congratulations

在本教學課程中,您已了解如何建立混合實境體驗,以示範 UI 元素、3D 模型操作、模型裁剪和眼球追蹤功能。In this tutorial, you learned to build a mixed reality experience demonstrating UI elements, 3D model manipulation, model clipping, and eye-tracking features. 本教學課程提供您 NextButton 和 PreviousButton,可讓您探索 3D 模型檢視器體驗。The tutorial provided you with NextButton and PreviousButton that let you explore the 3D model viewer experience. ClippingObjectButton 讓您開啟裁剪物件和體驗裁剪功能。The ClippingObjectButton made you turn on clipping objects and experience clipping feature. 本教學課程也提供您一個眼球追蹤元素,讓您在體驗中醒目提示工具提示。The tutorial also provided you with an eye-tracking element to enable highlighting the tooltips in the experience.

在下一課中,您將學習如何為電腦建立全像攝影遠端處理應用程式,以在任何時間點連線 HoloLens 2,提供一種在混合實境中將 3D 內容視覺化的方式。In the next lesson, you will learn how to create a Holographic Remoting application for PC to connect HoloLens 2 at any point, providing a way to Visualize 3D content in mixed reality.