练习 - Power Apps 中的“在 MR 中度量”和筛选功能

已完成

在本单元中,将使用 Power Apps 的一些关键功能组件。 其中包括“在 MR 中度量”和“筛选方式”。 利用 Power Apps 的“在 MR 中度量”组件,用户能够测量现实世界中的距离、面积和体积。

使用“在 MR 中度量”进行空间筛选

“在 MR 中度量”功能用于根据通过测量会话收到的度量值,在空间上筛选可轻松放置在现实世界中的产品。 有一些用于执行筛选的基本公式。

  1. 导航到“主页”。 在“插入”选项卡上,展开“混合现实”下拉列表,然后选择“在 MR 中度量”

    屏幕截图显示添加“在 MR 中度量”

  2. 按图中所示放置“在 MR 中度量”按钮并配置以下属性:

    • 文本:按尺寸筛选
    • 度量单位:厘米
    • 度量类型:自由形式

    屏幕截图显示配置“在 MR 中度量”的属性。

  3. 在“主页”上,通过选择“库”>“垂直”添加一个库。 将该库的名称更改为 Measure_gallery。

    添加库的屏幕截图。

  4. 将该“垂直库”放置在“按尺寸筛选”按钮的正下方。 通过选择“标题、副标题和正文”来配置“布局”属性。

    配置布局的屏幕截图

  5. 通过添加以下行来配置 Measure_gallery 的“项”属性:

    MeasureInMR1.Measurements
    

    库数据源的屏幕截图。

  6. 删除 Separator 和 NextArrow。 将“标题”、“副标题”和“正文”等距放置,如图所示

    等距放置的屏幕截图。

  7. 如下配置以下 3 个标签的“文本”属性:

    • 标题:

      "Unit: "&ThisItem.Unit
      

      标题文本的屏幕截图

    • 副标题:

      "Area: "&ThisItem.Area&"cm²"
      

      副标题文本的屏幕截图。

    • 正文:

      "Height: "&ThisItem.Height&"cm"
      

      正文文本的屏幕截图。

  8. 现在添加一个“重新加载”图标,让用户可以在不满意时重新进行度量。 在“插入”选项卡上,展开“图标”下拉列表并选择“重新加载”图标。

    添加“重新加载”图标的屏幕截图。

  9. 按图中所示放置该图标并如下配置“OnSelect”属性:

    UpdateContext({galleryvisible:false});
    

    为“重新加载”图标配置 OnSelect 的屏幕截图。

    提示

    可以自定义字体、字号和字体样式,以匹配应用程序的设计。 但是,为实现更好的用户体验,请在整个应用程序中保持一致的字体。

  10. 完整配置好“在 MR 中度量”组件后,移动到“空间筛选”。 这里,我们基于“在 MR 中度量”会话中接收到的宽度、深度和高度值对产品进行空间上的筛选。

    导航到“产品”页面,然后如下配置 Gallery_products 的“项”属性

    If(
    ID = 1 And Measure_gallery.Selected.Height = 0,
    (Filter('Easy Sales',(ProductCategory = "Sofa") And ((Depth < Measure_gallery.Selected.BoundingDepth And Width < Measure_gallery.Selected.BoundingWidth) Or (Depth < Measure_gallery.Selected.BoundingWidth And Width < Measure_gallery.Selected.BoundingDepth)))),
    ID = 1 And Measure_gallery.Selected.Height > 0,
    (Filter('Easy Sales',(ProductCategory = "Sofa") And ((Depth < Measure_gallery.Selected.BoundingDepth And Width < Measure_gallery.Selected.BoundingWidth And Height <= Measure_gallery.Selected.Height) Or (Depth < Measure_gallery.Selected.BoundingWidth And Width < Measure_gallery.Selected.BoundingDepth And Height <= Measure_gallery.Selected.Height)))),
    ID = 1,
    Filter('Easy Sales',ProductCategory = "Sofa"), 
    
    ID = 2,
    Filter('Easy Sales',ProductCategory = "Chair"), 
    ID = 2 And Measure_gallery.Selected.Height = 0,
    (Filter('Easy Sales',(ProductCategory = "Chair") And ((Depth < Measure_gallery.Selected.BoundingDepth And Width < Measure_gallery.Selected.BoundingWidth) Or (Depth < Measure_gallery.Selected.BoundingWidth And Width < Measure_gallery.Selected.BoundingDepth)))),
    ID = 2 And Measure_gallery.Selected.Height > 0,
    (Filter('Easy Sales',(ProductCategory = "Chair") And ((Depth < Measure_gallery.Selected.BoundingDepth And Width < Measure_gallery.Selected.BoundingWidth And Height <= Measure_gallery.Selected.Height) Or (Depth < Measure_gallery.Selected.BoundingWidth And Width < Measure_gallery.Selected.BoundingDepth And Height <= Measure_gallery.Selected.Height)))),
    
    ID = 3,
    Filter('Easy Sales',ProductCategory = "Table"),
    ID = 3 And Measure_gallery.Selected.Height = 0,
    (Filter('Easy Sales',(ProductCategory = "Table") And ((Depth < Measure_gallery.Selected.BoundingDepth And Width < Measure_gallery.Selected.BoundingWidth) Or (Depth < Measure_gallery.Selected.BoundingWidth And Width < Measure_gallery.Selected.BoundingDepth)))),
    ID = 3 And Measure_gallery.Selected.Height > 0,
    (Filter('Easy Sales',(ProductCategory = "Table") And ((Depth < Measure_gallery.Selected.BoundingDepth And Width < Measure_gallery.Selected.BoundingWidth And Height <= Measure_gallery.Selected.Height) Or (Depth < Measure_gallery.Selected.BoundingWidth And Width < Measure_gallery.Selected.BoundingDepth And Height <= Measure_gallery.Selected.Height))))
    )
    

    屏幕截图显示配置“Sofas”中的项。

    重要

    为 SharePoint 列表和库提供合适的名称,以避免将来出现错误。 维护公式中组件的名称以避免混淆。

    注意

    “地毯”页面不包括“空间筛选”,因为添加了另一个特定于产品的功能。 “在 MR 中度量”会话中测量的面积将用于估算所选地毯的价格。

    提示

    通过选择顶部的“文件”选项卡并选择“保存”选项,经常地保存应用程序。 如果收到提示,则选择“云”选项,然后选择“保存”。

基于面积计算价格

  1. 转到 Carpet_details 页,添加一个标签,然后将其重命名为 Area_carpets。

    屏幕截图显示添加面积标签

  2. 在 Area_carpets 标签旁边添加另一个空标签,然后如下配置空白标签的“文本”属性,以显示计算的面积:

    Measure_gallery.Selected.Area&"cm²"
    

    “面积”计算的屏幕截图。

  3. 如下配置“价格”标签旁边的标签,以显示计算的价格:

    "$"&Measure_gallery.Selected.Area * content_carpets.'Price/cm2'
    

    价格计算的屏幕截图。

实现上述步骤后,应用程序将在空间上筛选出产品,并基于实际度量值计算地毯的准确价格。

实现“在 MR 中度量”和空间筛选后的应用程序演示动画。