Ejercicio: Columnas de opción de Dataverse

Completado

En este ejercicio, ayudará a Contoso a agregar columnas de opción a una tabla de Dataverse. Luego, modificará la aplicación Administración de productos para usar las nuevas columnas.

Objetivos

El objetivo de este ejercicio es que aprenda a:

  • Crear columnas de opción.

  • Utilizar los datos de filtro de la aplicación con las columnas de opción.

  • Utilizar la función Patch() para actualizar los valores de las columnas.

Requisito previo

Para completar este ejercicio, necesitará un entorno con Microsoft Dataverse.

Ejercicio 1: Importar una solución

En este ejercicio, importará una solución a su entorno. Esta solución contiene una tabla de productos y una aplicación para la administración de productos.

Tarea 1: Importar la solución inicial

En esta tarea, importará una solución a su entorno.

  1. Para completar este ejercicio, necesitará descargar el archivo ZIP. Seleccione la descarga cuando se abra el vínculo.

  2. Vaya al portal del creador de Power Apps y seleccione el entorno que le gustaría utilizar para este laboratorio.

  3. Seleccione Soluciones > Importar solución.

    Captura de pantalla del botón Importar solución en Power Apps

  4. Seleccione Examinar.

  5. Busque/seleccione la solución ContosoProductChoiceLab_1_0_0_0.zip y elija Abrir.

  6. Seleccione Siguiente.

  7. Seleccione Importar y espere a que se complete el proceso de importación de la solución.

Tarea 2: Ejecutar la aplicación

En esta tarea, ejecutará la aplicación Administrador de productos de Contoso y agregará filas de productos.

  1. Abra la solución Laboratorio de opciones de productos de Contoso y seleccione la aplicación Administrador de productos de Contoso. (Ábrala en modo de reproducción).

  2. En BrowseScreen1, seleccione el botón Crear nuevo elemento (el icono "más" +).

    Captura de pantalla del botón para crear nuevo producto

  3. Escriba Gadget de medición como Nombre y, a continuación, seleccione Guardar.

    Captura de pantalla del botón para guardar nuevo producto en Power Apps

  4. Agregue algunas filas de productos más.

  5. Ahora debería tener al menos tres productos.

    Captura de pantalla de las filas de productos en Power Apps

  6. Cierre la pestaña o ventana del navegador de la aplicación.

Ejercicio 2: Crear columnas

En este ejercicio, creará dos columnas del tipo de datos de opción: una para Visibilidad del producto y otra para Canales de venta.

Nota

Preste atención a qué columna es del tipo de datos Opción y qué columna es del tipo de datos Opciones.

Tarea: Crear columnas de opciones

En esta tarea, creará dos columnas del tipo de datos Opción.

  1. Vaya al Portal de creadores de Power Apps y seleccione Soluciones.

  2. Seleccione la solución Laboratorio de opciones de Contoso que ha importado.

  3. Seleccione la tabla Producto.

  4. En el panel Esquema, seleccione Columnas.

    Captura de pantalla del panel Producto con Columnas seleccionado en Esquema

  5. En la vista Columnas, seleccione + Nueva columna.

    Captura de pantalla de la vista Columnas y el botón para agregar nueva columna

  6. En el panel Nueva columna a la derecha de su pantalla, introduzca Visibilidad del producto para el Nombre para mostrar, seleccione Opción en Tipo de datos y luego seleccione Opción en el menú desplegable.

    Captura de pantalla del tipo de datos de columna Opción en Power Apps

  7. En Sincronizar esta opción con, seleccione + Nueva opción.

  8. En el panel Nueva opción en el lado derecho de la pantalla, introduzca chProductVisibility en el campo Nombre para mostrar. Si agrega "ch" delante del nombre será mucho más fácil determinar que se trata de un conjunto de opciones.

  9. Introduzca Privado para el primer elemento en Opciones y luego seleccione + Nueva opción.

    Captura de pantalla de Agregar nueva opción en el panel Nueva opción

  10. Introduzca Invitación para la segunda opción y luego seleccione + Nueva opción.

  11. Introduzca Público y luego seleccione Guardar.

    Captura de pantalla de los elementos de opción en Power Apps

  12. En Sincronizar esta opción con, introduzca chProductVisibility en el campo de búsqueda para buscar/seleccionar el conjunto de opciones que ha creado. chProductVisibility debería mostrarse ahora en este campo.

  13. Seleccione Guardar y el panel Nueva columna desaparecerá.

  14. Seleccione + Nueva columna de nuevo.

  15. Escriba Canales de venta como Nombre para mostrar, elija Opción como Tipo de datos y, a continuación, seleccione Opción en el menú desplegable.

  16. Seleccione la casilla junto a Se permite seleccionar varias opciones. Esta es la forma en que nuestra columna permitirá múltiples opciones (no olvide este paso).

    Captura de pantalla del tipo de datos de columna Opciones en Power Apps

  17. En Sincronizar esta opción con, seleccione + Nueva opción.

  18. Introduzca chSalesChannels como Nombre para mostrar y Mayorista para el primer elemento y luego seleccione + Nueva opción.

  19. Introduzca Comercio minorista para el segundo elemento y luego seleccione + Nueva opción.

  20. Introduzca Directo y luego seleccione Guardar.

    Captura de pantalla del botón Guardar en la nueva columna de opciones de canales de venta

  21. En Sincronizar esta opción con, introduzca chSalesChannels en el campo de búsqueda para buscar/seleccionar el conjunto de opciones que ha creado. chSalesChannels debería mostrarse ahora en este campo.

  22. Seleccione Guardar.

En este ejercicio, modificará el formulario Editar y la galería de la aplicación Administrador de productos de Contoso.

Tarea: Editar aplicación

En esta tarea, editará la aplicación Administrador de productos de Contoso.

  1. Si ha navegado fuera, busque sus soluciones y selecciónelas para abrir la solución Laboratorio de opciones de productos de Contoso. Si todavía está en la solución, en el panel de navegación Objetos, busque/seleccione Aplicaciones

  2. Seleccione la opción para abrir la aplicación Administrador de productos de Contoso.

    Captura de pantalla de la sección Soluciones > Laboratorio de opciones de productos de Contoso, con la aplicación Administrador de productos de Contoso resaltada

    La aplicación se abrirá en el estudio de aplicaciones.

  3. Desde la pestaña Vista de árbol, expanda EditScreen1 y, a continuación, seleccione EditForm1.

    Captura de pantalla del control EditForm1 resaltado en la pestaña Vista de árbol en Power Apps

  4. Seleccione Editar campos.

    Captura de pantalla de la opción Editar campos en la pestaña Propiedades de EditForm1

  5. Seleccione el botón de los puntos suspensivos para Más acciones (...) de la columna Fecha de creación y luego seleccione Quitar.

    Captura de pantalla del botón Quitar seleccionado en la lista desplegable de la columna Fecha de creación

  6. Seleccione Agregar campo.

    Captura de pantalla del botón Agregar campo en el panel Campos de Power Apps

  7. Seleccione las columnas Visibilidad del producto y Canal de ventas y luego seleccione Agregar.

    Captura de pantalla de la sección Elegir un campo, con las columnas seleccionadas y el botón Agregar

  8. Cierre el panel Campos.

  9. Expanda BrowseScreen1 y seleccione BrowseGallery1.

    Captura de pantalla del control BrowseGallery1 resaltado en la vista de árbol

  10. Seleccione el icono Editar en la galería.

    Captura de pantalla del icono Editar en la galería

  11. Cambie TemplateSize a 230.

    Captura de pantalla de TemplateSize cambiado a 230

  12. Seleccione la etiqueta Título dentro de la galería y muévala a la parte superior de la plantilla.

    Captura de pantalla de la posición del control de etiqueta resaltada en Power Apps

  13. Mientras sigue editando la galería, seleccione Insertar, expanda Entrada y seleccione Desplegable.

    Captura de pantalla de la selección de Insertar > Entrada > Desplegable en Power Apps

  14. Cambie el tamaño y la posición del control desplegable, y sustituya el valor Elementos de la lista desplegable por la siguiente fórmula.

    Choices(Products.'Product visibility')

    Captura de pantalla del valor de la fórmula de Elementos en Power Apps

  15. Establezca el valor Predeterminado del control desplegable en la siguiente fórmula.

    ThisItem.'Product visibility'

  16. Mientras sigue editando la galería, vaya a la pestaña Insertar y seleccione Etiqueta de texto.

  17. Cambie el nombre de la etiqueta a Canales.

  18. Mueva la etiqueta Canales debajo del control desplegable y luego cambie su tamaño.

  19. Establezca el valor Texto de la etiqueta Canales que agregó en la fórmula siguiente. Esta fórmula concatenará las opciones seleccionadas.

    Concat(ThisItem.'Sales channels',Text(Value),",")

  20. Asegúrese de que todavía está editando la galería. Seleccione + Insertar > Rectángulo.

    Captura de pantalla de la opción Insertar seleccionada, con la opción Rectángulo resaltada

  21. Establezca los valores X e Y del rectángulo en 0.

  22. Establezca el Ancho del rectángulo en 6.

  23. Establezca el Alto del rectángulo en 220.

  24. Establezca el valor Relleno del rectángulo en la siguiente fórmula. Esta fórmula aplicará un color de relleno diferente a cada opción del valor de columna Visibilidad del producto.

    Switch(ThisItem.'Product visibility', chProductVisibility.Private, Color.Red, chProductVisibility.Public, Color.Green, chProductVisibility.Invite, Color.Blue, Color.Black)

  25. Seleccione la Galería y luego elimine el valor OnSelect, de modo que el campo de fórmula fx esté en blanco.

    Captura de pantalla del valor OnSelect, que se muestra vacío

  26. Seleccione NextArrow1 en la galería.

    Captura de pantalla del control NextArrow2 en la galería

  27. Establezca el valor OnSelect de NextArrow1 en la siguiente fórmula.

    Navigate(DetailScreen1, ScreenTransition.None)

  28. En la esquina superior derecha de la pantalla, seleccione Guardar.

    Captura de pantalla del botón Guardar en la aplicación Administrador de productos de Contoso

  29. Seleccione Vista previa de la aplicación (o F5).

    Captura de pantalla del botón Vista previa de la aplicación en Power Apps

    La aplicación debería cargarse.

  30. Seleccione la flecha Siguiente para uno de los productos.

  31. Seleccione el botón Editar.

  32. En Canales de venta, seleccione Comercio minorista y Directo. Luego, en Visibilidad del producto, seleccione Privada y, luego, seleccione Guardar.

    Captura de pantalla del botón Guardar seleccionado en Productos para guardar la información que se ha introducido

  33. Seleccione el botón Atrás.

  34. Seleccione la opción para abrir otro producto.

  35. Seleccione Editar.

  36. En Canales de venta, seleccione Comercio minorista; en Visibilidad del producto, seleccione Pública y elija Guardar.

  37. Seleccione el botón Atrás.

  38. Seleccione la opción para abrir otro producto.

  39. Seleccione Editar.

  40. En Canales de venta, seleccione Directo; seleccione Invitación para Visibilidad del producto y luego elija Guardar.

  41. Seleccione el botón Atrás.

  42. La galería debería ser similar a la de la imagen siguiente. Cuando haya terminado de ver los resultados, cierre la vista previa.

    Captura de pantalla de la galería editada, con el botón para cerrar la vista previa de la aplicación resaltado

  43. No se vaya de esta página.

Ejercicio 4: Usar filtros

En este ejercicio, filtrará las filas de la galería por visibilidad del producto.

Tarea: Usar un filtro

En esta tarea, filtrará las filas de la galería por visibilidad del producto.

  1. En BrowseScreen1, seleccione TextSearchBox1.

    Captura de pantalla del control TextSearchBox1 en la vista de árbol en Power Apps

  2. Cambie el Width del cuadro de búsqueda a la siguiente fórmula.

    Parent.Width/2

  3. En la cinta de opciones, seleccione Insertar y expanda Entrada; luego, seleccione Desplegable.

    Captura de pantalla del control desplegable Insert, que muestra la entrada seleccionada con la opción Desplegable resaltada

  4. Cambie el elemento desplegable a Filtro de visibilidad.

    Captura de pantalla del control Rename en Power Apps

  5. Cambie el tamaño y la posición del filtro de visibilidad y luego colóquelo a la derecha del cuadro de búsqueda.

    Captura de pantalla de la posición del control junto a la búsqueda en Power Apps

  6. Establezca el valor Elementos del Filtro de visibilidad en la siguiente fórmula.

    Choices(Products.'Product visibility')

  7. Establezca el valor AllowEmptySelection del Filtro de visibilidad en verdadero.

  8. Establezca el valor Predeterminado del Filtro de visibilidad en la siguiente fórmula.

    Blank()

  9. En la cinta de opciones, seleccione Insertar y expanda Iconos; luego, seleccione Cancelar.

  10. Cambie el tamaño y la posición del icono y luego colóquelo a la derecha de la flecha desplegable.

    Captura de pantalla de la posición del icono en Power Apps

  11. Establezca el valor OnSelect del icono en la siguiente fórmula.

    Reset('Visibility filter')

  12. Establezca el valor Visible del icono en la siguiente fórmula.

    If(IsBlank('Visibility filter'), false,true)

  13. Seleccione BrowseGallery1 y luego cambie el valor Elementos a la siguiente fórmula. Esta fórmula cambia la fórmula existente para incluir una función Filter() que usa los valores seleccionados por el usuario.

    SortByColumns(
        Search(
            Filter([@Products],IsBlank('Visibility filter'.Selected) || 'Product visibility' = 'Visibility filter'.Selected.Value),
            TextSearchBox1.Text,
            "contoso_name"
        ),
        "contoso_name",
        If(
            SortDescending1,
            SortOrder.Descending,
            SortOrder.Ascending
        )
    )
    

    Captura de pantalla de la fórmula OnSelect de la galería en el campo Elementos

  14. Seleccione Vista previa de la aplicación (o presione F5).

  15. Cambie el Filtro de visibilidad a Privado. La galería debe mostrar solo los productos privados.

    Captura de pantalla de los productos con el filtro Privado aplicado en Power Apps

  16. Seleccione el icono X. La galería debería mostrar todos los productos.

    Captura de pantalla de la galería con todos los productos

  17. Cierre la vista previa.

  18. No se vaya de esta página.

Ejercicio 5: Usar la fórmula Patch

En este ejercicio, utilizará la fórmula Patch para actualizar las filas de la tabla de productos.

Tarea: Usar la fórmula Patch()

  1. Expanda BrowseGallery1 y seleccione el control Dropdown1.

    Captura de pantalla del control Dropdown1 en el menú BrowseGallery1

  2. Establezca el valor OnChange del control desplegable en la siguiente fórmula. Esta fórmula actualizará la fila cuando cambie el valor del control desplegable.

    Patch(Products,ThisItem,{'Product visibility':Self.Selected.Value})

  3. Seleccione la galería y, a continuación, elija el icono Editar.

    Captura de pantalla del botón Editar en la galería de Power Apps

  4. En la cinta de opciones, seleccione Insertar y expanda Iconos; luego, seleccione Cancelar.

  5. Coloque el icono en la parte inferior derecha.

    Captura de pantalla de la ubicación del icono en la parte inferior derecha

  6. Establezca el valor Visible del icono en la siguiente fórmula.

    If(IsBlank(Channels.Text),false,true)

  7. Establezca el valor OnSelect del icono en la siguiente fórmula. Esta fórmula eliminará todos los canales de venta seleccionados cuando se elija el icono.

    Patch(Products,ThisItem,{'Sales channels':Blank()})

  8. En la cinta de opciones, seleccione Configuración.

  9. Seleccione la pestaña Próximas características > Versión preliminar y luego active el control de alternancia Administración de errores en el nivel de fórmula.

    Captura de pantalla de la opción Administración de errores a nivel de fórmula activada

  10. Cierre la ventana Configuración.

  11. Seleccione Vista previa de la aplicación.

  12. Cambie la visibilidad del producto de uno de los productos. El producto debería actualizarse.

    Captura de pantalla de la fila actualizada en Power Apps

  13. Seleccione el icono X del primer producto. Se deberían borrar los canales de venta del producto y el botón X debería quedar oculto.

    Captura de pantalla de la fila actualizada en Power Apps con un espacio en blanco

  14. Cierre la vista previa.

  15. Seleccione Guardar.