Ejercicio: Medir en MR y filtrado en Power Apps

  • 10 minutos

En esta unidad, usará algunos de los componentes funcionales clave de Power Apps. Esto incluye la medición en MR y las formas de filtrado. Los usuarios pueden medir la distancia, el área y el volumen en el mundo real con el componente Measure in MR de Power Apps.

Filtrado espacial mediante Measure en MR

La característica Medida en MR se utiliza para filtrar espacialmente los productos que se pueden colocar fácilmente en el mundo real según las medidas recibidas a través de la sesión de medición. Algunas fórmulas básicas se usan para realizar el filtrado.

  1. Vaya a la página Principal. En la pestaña Insertar , expanda la lista desplegable Realidad mixta y seleccione Medir en MR.

    Captura de pantalla para agregar medida en MR

  2. Coloque el botón Medida en MR como se muestra en la ilustración y configure las siguientes propiedades:

    • Texto: Filtrar por dimensiones
    • Unidad de medida: Centímetros
    • Tipo de medida: Forma libre

    Captura de pantalla para configurar las propiedades de Measure en MR.

  3. En la página Inicio, agregue una galería seleccionando La galería>vertical. Cambie el nombre de Galería a Measure_gallery.

    Captura de pantalla para agregar la galería.

  4. Coloque la Galería vertical justo debajo del botón Filtrar por dimensiones . Para configurar la propiedad Layout , seleccione Título, Subtítulo y cuerpo.

    Captura de pantalla para configurar el diseño

  5. Configure la propiedad Items del Measure_gallery agregando la siguiente línea:

    MeasureInMR1.Measurements

    Captura de pantalla del origen de datos de la galería.

  6. Quite el Separador y NextArrow. Coloque el título, el subtítulo y el cuerpo equidistantes entre sí, como se muestra en la imagen.

    Recorte de pantalla de la colocación equidistante.

  7. Configure la propiedad Text de las tres etiquetas de la siguiente manera:

    • Título:

      "Unit: "&ThisItem.Unit

      Captura de pantalla del texto del título

    • Subtítulo:

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

      Captura de pantalla del texto del subtítulo.

    • Cuerpo:

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

      Captura de pantalla del texto principal.

  8. Vamos a agregar un icono Volver a cargar para permitir a los usuarios rehacer las medidas si no son felices. En la pestaña Insertar , expanda la lista desplegable Iconos y seleccione el icono Volver a cargar .

    Captura de pantalla de la adición del icono de recarga.

  9. Coloque el icono como se muestra en la imagen y configure la propiedad OnSelect de la siguiente manera:

    UpdateContext({galleryvisible:false});

    Captura de pantalla de la configuración de OnSelect para volver a cargar el icono.

    Sugerencia

    Puede personalizar la fuente, el tamaño de fuente y el estilo de fuente para que coincidan con el diseño de la aplicación. Sin embargo, para una mejor experiencia del usuario, mantenga una fuente coherente en toda la aplicación.

  10. Una vez que el componente Measure in MR está totalmente configurado, pasamos al filtrado espacial. Aquí, filtramos espacialmente los productos en función de los valores Width, Depth y Height recibidos en la sesión Measure in MR .

    Vaya a la página Productos y configure la propiedad Items del Gallery_products de la siguiente manera:

    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))))
)

    Recorte de pantalla de la configuración de elementos en Sofás.

    Importante

    Proporcione los nombres adecuados para la lista de SharePoint y la Galería para evitar tener errores en el futuro. Mantenga los nombres de los componentes en las fórmulas para evitar confusiones.

    Nota:

    El filtrado espacial no está incluido en la página Alfombras , ya que se agrega otra característica específica del producto. El área medida en la sesión de medición en MR se usará para calcular el precio de la alfombra seleccionada.

    Sugerencia

    Guarde la aplicación con frecuencia seleccionando la pestaña Archivo en la parte superior y seleccionando la opción Guardar . Si se le solicita, seleccione la opción La nube y, a continuación, seleccione Guardar.

Calcular el precio en función del área

  1. Vaya a la página Carpet_details , agregue una etiqueta y cámbiele el nombre Area_carpets.

    Captura de pantalla de la adición de la etiqueta de área

  2. Agregue otra etiqueta vacía junto a la etiqueta Area_carpets y, a continuación, configure la propiedad Text de la etiqueta en blanco como se indica a continuación para mostrar el área calculada:

    Measure_gallery.Selected.Area&"cm²"

    Captura de pantalla del cálculo del área.

  3. Configure la etiqueta junto a la etiqueta Precio como se indica a continuación para mostrar el precio calculado:

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

    Captura de pantalla del cálculo del precio.

Después de implementar los pasos anteriores, la aplicación filtrará espacialmente los productos y calculará el precio preciso de las alfombras en función de sus medidas reales.

Animación de la demostración de la aplicación después de implementar la medida en mr y el filtrado espacial.