为 HoloLens 创建混合维度应用程序





5.00/5 (2投票s)
本文将展示如何在 HoloLens 上创建混合维度(2D+3D)应用程序,并如何在 2D 和 3D 视图之间切换
引言
HoloLens 可以运行所有支持“Windows.Holographic”设备系列的通用 Windows 平台应用程序。可以在一个二维应用程序中包含多个视图。每个 2D 视图都构造为一个窗口。您可以使用 UWP API 在这些多个视图之间切换。您可以使用 Visual Studio 和 XAML UI 和 C# 创建 2D 应用程序。如果您使用 Unity 等游戏引擎创建三维应用程序,您可以拥有多个场景,并可以使用 Unity API 在场景之间切换。
背景
某些特定场景可能需要一个结合了 2D 视图和 3D 场景的单一应用程序。例如,您可能希望有一个二维应用程序作为数字手册,它只显示产品图片和视频。如果您想包含该特定产品的交互式演示,您需要 3D 场景来演示该产品的功能。可以构建一个包含 2D 和 3D 上下文的 UWP 应用程序。
在本文中,您将学习如何开发一个同时包含 2D 视图和 3D 场景的 UWP 应用程序,以及如何在 2D 和 3D 上下文之间切换。您还将学习如何创建 Unity 代码和应用程序的 UWP 部分之间的桥梁(基本上是一个链接库)。要构建混合(2D+3D)应用程序,我们需要以下内容:
- UWP 类库
- 为 XAML 构建的 3D Unity 应用程序
- 使用 XAML 和 c# 的 2D 视图
用于链接的 UWP 类库
为了在 Unity 代码和 2D C# 代码之间进行通信,我们需要一个链接库。我们将创建一个通用类库,它将充当 2D 和 3D 上下文之间的桥梁。
打开 Visual Studio(我使用的是 VS Professional 2015)。转到 **文件 ⇒ 新建 ⇒ 项目**。您将看到一个弹出窗口,其中包含创建新项目的所有可用选项。展开 **已安装 ⇒ 模板 ⇒ Visual C# ⇒ Windows ⇒ 通用**。选择“**类库(通用 Windows)**”。为您的库输入一个名称。我将我的库命名为“**HoloLinkLibrary**”并单击“**确定**”。
现在将出现一个弹出窗口,用于选择目标平台和最低平台版本。大多数情况下,您不需要更改此设置。单击“确定”。您的类库项目将成功创建。
您可以在解决方案资源管理器中看到新创建的库项目。默认情况下,Visual Studio 会将您的类命名为“**Class1**”。在本教程中,我倾向于保留它。
将以下代码复制并粘贴到“**Class1**”中,然后生成解决方案。
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Windows.ApplicationModel.Core;
using Windows.UI.Core;
using Windows.UI.Text;
using Windows.UI.ViewManagement;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Navigation;
namespace HoloLinkLibrary
{
public class Class1
{
static CoreApplicationView ThreeDimView;
static CoreApplicationView TwoDimView;
public static Type TwoDimPageType { get; set; }
static async Task RunOnDispatcherAsync(CoreApplicationView appView,
Func<task> actionToPerform)
{
await appView.Dispatcher.RunAsync(CoreDispatcherPriority.Normal,
() => actionToPerform());
}
static async Task ViewSwitcherAsync()
{
// Get the current application view
var view = ApplicationView.GetForCurrentView();
// Use ApplicationViewSwitcher API to
await ApplicationViewSwitcher.SwitchAsync(view.Id);
Window.Current.Activate();
}
public static async Task GotoThreeDimViewAsync()
{
if (ThreeDimView != null)
{
await RunOnDispatcherAsync(ThreeDimView, ViewSwitcherAsync);
}else
{
Debug.WriteLine("3D view is null");
}
}
public static async void Open2DView()
{
Debug.WriteLine("Opening 2D view");
try
{
ThreeDimView = CoreApplication.MainView;
// you can create a new view everytime or you can reuse same view. If so, check if 'TwoDimView' is for not null.
TwoDimView = CoreApplication.CreateNewView();
await RunOnDispatcherAsync(
TwoDimView,
async () =>
{
Window.Current.Content = Get2DView();
}
);
await RunOnDispatcherAsync(TwoDimView, ViewSwitcherAsync);
}
catch (Exception e)
{
Debug.WriteLine("{0} Exception caught.", e);
}
}
//We cannot switch form 3D scene to XAML view directly. We need to create a window which will give us 2D context.
static UIElement Get2DView()
{
TextBlock SampleText = new TextBlock();
SampleText.Text = "Switching views\nPlease wait....";
SampleText.TextWrapping = TextWrapping.WrapWholeWords;
SampleText.FontWeight = FontWeights.Bold;
SampleText.HorizontalAlignment = HorizontalAlignment.Stretch;
SampleText.Loaded += async (s, e) =>
{
Frame rootFrame = Window.Current.Content as Frame;
// Do not repeat app initialization when the Window already has content,
// just ensure that the window is active
if (rootFrame == null)
{
// Create a Frame to act as the navigation context and navigate to the first page
rootFrame = new Frame();
rootFrame.NavigationFailed += OnNavigationFailed;
// Place the frame in the current Window
Window.Current.Content = rootFrame;
}
try
{
Debug.WriteLine("library : pagetype :" + TwoDimPageType);
rootFrame.Navigate(TwoDimPageType);
}
catch (Exception ex)
{
Debug.WriteLine("{0} Navigation Exception caught.", ex);
}
};
return (SampleText);
}
private static void OnNavigationFailed(object sender, NavigationFailedEventArgs e)
{
Debug.WriteLine("Navigation failed");
}
}
}
</task>
您可以在 <ProjectRoot>\<ProjectName>\bin\Debug
中找到编译后的库文件
如果您选择了“发布”生成类型,则库文件将出现在 <ProjectRoot>\<ProjectName>\bin\Release
文件夹下。
注意我们需要创建一个 2D 窗口来获取上下文。我们无法在没有 2D 上下文的情况下从 3D 场景切换到 XAML。
准备 3D Unity 应用
您可以通过遵循 Holograms 100 教程中提供的分步说明来配置您的 Unity 应用程序以用于 HoloLens。现在您需要将“HoloLinkLibrary.dll”导入到 Unity 项目中。
在“Assets”下创建一个名为 ‘libs’
的新文件夹。将 HoloLinkLibrary.dll
拖放到 ‘libs’
文件夹中。如果您在 Unity 编辑器中选择 ‘HoloLinkLibrary.dll’
,将打开 ‘Inspector’
窗口。默认情况下会选择 “Any Platform”
选项。您应该取消选中 “Any Platform”
并选中 “WSAPlayer”
选项。然后,在 ‘Platform Settings’
下,在 SDK 下拉菜单中选择 “UWP”
。然后单击 **“应用”**。
在 Unity 场景中,将以下代码添加到您的 3D 按钮单击事件中。对于本文,我创建了一个简单的立方体,并将以下方法添加到该立方体的 ‘OnClick’
事件中。
public void SwitchToTwoDimView()
{
#if UNITY_UWP
HoloLinkLibrary.Class1.Open2DView();
#endif
}
请注意,代码被包装在 #if UNITY_UWP 中。这将在 UWP 环境中仅执行此行代码。
接下来重要的事情是生成应用程序。在 Unity 编辑器中打开“Build Settings”。选择 ‘Windows Store’
作为平台。在 SDK 中选择 ‘Universal 10’
,在 ‘UWP Build Type’
中选择 ‘XAML’
。勾选“Unity C# Projects”复选框,然后单击 ‘Build’
。将生成内容保存在主项目文件夹内的“App”文件夹中。
创建 2D XAML 视图
到目前为止,我们已经创建了一个通用的链接库,可以从 Unity 代码和 XAML/C# 代码执行。我们已经为 UWP 平台构建了 Unity 应用程序。现在,我们将使用 Visual Studio 添加一个 XAML 表单。
在 Visual Studio 中打开解决方案 <ProjectRoot>\App\Test Project.sln
。您可以在“Unprocessed”文件夹下看到 ‘HoloLinkLibrary.dll’
文件。
请参考以下屏幕截图将新的 XAML 文件添加到项目中。将该页面保存为 ‘TwoDimPage.xaml’
。
复制以下代码并将其粘贴到 ‘TwoDimPage.xaml’
文件中。
<page mc:ignorable="d" x:class="Test_Project.TwoDimPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="using:Test_Project" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<grid background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<textblock>
Two Dimensional Page
</textblock><button click="Button_Click">Switch To 3D</button>
</grid>
</page>
在代码隐藏文件中添加以下函数。当您单击按钮时
private void Button_Click(object sender, RoutedEventArgs e)
{
HoloLinkLibrary.Class1.GotoThreeDimViewAsync();
}
在 Visual Studio 编辑器中打开 App\Test Project\MainPage.xaml.cs。找到构造函数 MainPage()。将以下行添加到构造函数中。
HoloLinkLibrary.Class1.TwoDimPageType = typeof(TwoDimPage);
现在我们使用了 ‘TwoDimPageType’
属性来设置 XAML 页面的类型。此属性在链接类库中声明。
将生成架构更改为 ‘x86’
,选择 HoloLens 设备或模拟器并运行。您应该能在 HoloLens 设备或模拟器上看到您的 3D 场景。
如果轻触此立方体,您将能够看到 2D XAML 视图,如下面的屏幕截图所示。如果单击 “Switch To 3D”
按钮,您将返回到 3D 上下文。
结论
希望您已经学会了如何创建混合维度的混合 HoloLens 应用程序。您可以从 3D 场景切换到任意数量的 XAML 视图。