创建具有 3D 和混合现实控件的应用

您可以使用 3D 对象在 MR 中查看 控件以 3D 形式查看项目,或查看特定项目在指定空间中的适合度。

在本文中,您将了解如何在 Power Apps 中使用 3D 和 mixed reality 控件。

观看此视频以了解如何使用 在 MR 中查看 控件构建移动应用:

先决条件

请参阅支持混合现实的设备的先决条件

使用 在 MR 中查看 控件创建应用

在 MR 中查看 控件在应用中创建一个按钮。 当应用用户选择此按钮时,它会将选定的 3D 模型(.glb 文件格式)或图像(.jpg 或 .png 文件格式)叠加到设备的实时相机源上。

提示

您还可以拍照并将照片上传到 OneDrive

在本节中,我们将在应用中构建一个屏幕,允许用户使用 在 MR 中查看 控件在混合现实中查看所选项目。

  1. Power Apps Studio 中打开一个应用。

  2. 选择应用的 OnStart 属性,复制并粘贴以下内容:

    ClearCollect(
        col3dObjects,
        {
            ObjectName: "Forklift",
            ObjectURL: "https://raw.githubusercontent.com/microsoft/experimental-pcf-control-assets/master/forklift.glb"
        },
        {
            ObjectName: "HVAC",
            ObjectURL: "https://raw.githubusercontent.com/microsoft/experimental-pcf-control-assets/master/hvac.glb"
        },
        {
            ObjectName: "Machine",
            ObjectURL: "https://raw.githubusercontent.com/microsoft/experimental-pcf-control-assets/master/machine.glb"
        },
        {
            ObjectName: "Pallet w/ Boxes",
            ObjectURL: "https://raw.githubusercontent.com/microsoft/experimental-pcf-control-assets/master/pallet_with_boxes.glb"
        },
        {
            ObjectName: "Robot Arm",
            ObjectURL: "https://raw.githubusercontent.com/microsoft/experimental-pcf-control-assets/master/robot_arm.glb"
        }
    )
    

    如上述示例代码所提到的更新了公式的 App OnStart 属性。

    此公式将创建一个集合,其中包含要在混合现实中查看的 3D 对象的名称和链接。

  3. 通过从插入选项卡拖放向屏幕添加一个文本标签

  4. 将添加的文本标签放在屏幕的左上角并在属性选项卡中修改以下属性:

    属性
    Text “在 MR 中查看”
    Font size 24
    Font weight FontWeight.Semibold
    Text alignment Align.Center
    Width 640
  5. 在“高级”选项卡中,修改该文本标签的以下属性:

    属性
    Color RGBA(255, 255, 255, 1)
    Fill RGBA(56, 96, 178, 1)

    此更改将为屏幕提供一个标题。

  6. 插入选项卡的布局部分插入一个空白垂直库

  7. 将库放在您之前添加的“在混合现实中查看”标题下方,并将其展开以使用屏幕的其余部分。

  8. 更改库的以下属性:

    属性
    Data source col3dObjects
    Template size 80
    X 0
    Y 92
    Width 640
    Height 1044
  9. 选择编辑库对库进行编辑。

    编辑库以使用 MR。

  10. 在库中插入一个文本标签

  11. 更改添加的文本标签的以下属性:

    属性
    Text ThisItem.ObjectName
    X 10
    Y 5
    Width 540
  12. 再次编辑库。

  13. 插入选项卡的混合现实部分,将 在 MR 中查看 控件拖放到库中。

  14. 更改 在 MR 中查看 控件的以下属性。

属性
Text “在 MR 中查看”
Display type 图标
Source ThisItem.ObjectURL
X Parent.TemplateWidth - Self.Width - 5
Y 5
Width 70

此更改将提供一个库,其中包含一个 3D 对象列表和一个按钮,用户可以按下此按钮在混合现实中查看这些对象。

测试 mixed reality 控件

现在添加了所有控件,请保存并发布该应用。 在支持混合现实的设备上,打开应用,然后按下与您要查看的对象对应的按钮。 这将打开在混合现实中查看体验。

在混合现实中查看。

按照屏幕上的说明缓慢左右移动设备来校准设备,同时将相机指向要测量的表面。 校准完成后,您将在表面上看到一组点,并在屏幕中心附近看到一个圆圈。 此圆圈显示最初可以放置 3D 对象的位置。 放置立方体后,可以使用触摸控件移动或旋转立方体。

要移动对象,按下它并将其滑动到您想要放置的位置。 要旋转对象,将一根手指按在屏幕上,然后用另一根手指向右或向左滑动。

使用左上角的返回按钮返回应用屏幕,选择另一个对象。 根据需要重复此过程查看每个对象。

使用 3D 对象 控件创建应用

3D 对象 控件允许您在 Power Apps 中以 3D 形式查看项目。 当应用加载时,它会通过控件显示应用内的 3D 模型(.glb 文件格式)或图像(.jpg 或 .png 文件格式)。 您可以选择要旋转、放大或缩小的 3D 模型。

在本节中,我们将在应用中构建一个屏幕,允许用户使用 3D 对象 控件以 3D 形式查看所选项目。

  1. 按照使用 在 MR 中查看 控件创建应用一节中的步骤 1 和 2,使用应用的 3D 对象集合创建应用。

  2. 通过从插入选项卡拖放向屏幕添加一个文本标签

  3. 将添加的文本标签放在屏幕的左上角并在属性选项卡中修改以下属性:

    属性
    文本 “3D 对象”
    Font size 24
    Font weight FontWeight.Semibold
    Text alignment Align.Center
    Width 640
  4. 在“高级”选项卡中,修改该文本标签的以下属性:

    属性
    Color RGBA(255, 255, 255, 1)
    Fill RGBA(56, 96, 178, 1)

    此更改将为屏幕提供一个标题。

  5. 插入选项卡的布局部分插入一个空白垂直库

  6. 将库放在您之前添加的“在混合现实中查看”标题下方,并将其展开以使用屏幕的其余部分。

  7. 更改库的以下属性:

    属性
    Data source col3dObjects
    Template size 80
    X 0
    Y 92
    Width 640
    Height 1044
  8. 选择编辑库对库进行编辑。

    编辑库以使用 3D。

  9. 在库中插入一个文本标签

  10. 更改添加的文本标签的以下属性:

    属性
    Text ThisItem.ObjectName
    Width 640
  11. 再次编辑库。

  12. 插入选项卡的媒体部分,将 3D 对象 控件拖放到库中。

  13. 更改 在 MR 中查看 控件的以下属性。

属性
Source ThisItem.ObjectURL
X 18
Y 138
Width 600
Height 550

此更改将提供一个库,其中包含您可以 3D 形式查看的 3D 对象列表。

测试 3D 控件

现在添加了所有控件,请保存并发布该应用。 在支持混合现实的设备上,打开应用,触摸屏幕以放大、缩小或转动在以 3D 形式查看的对象。

3D 对象。

由于库中包含多个 3D 对象,向下轻扫屏幕来查看其他对象,使用缩放或旋转功能处理 3D 对象。

另请参见

备注

您能告诉我们您的文档语言首选项吗? 进行简短调查。(请注意,此调查是英文版调查)

此调查大约需要七分钟。 不会收集个人数据(隐私声明)。