SELECCIONAR ELEMENTOS EN BASE A UN AGRUPADOR EN POWER APPS

Hola a todos,

Hoy vamos con un post sobre Power Apps y sobre como usar colecciones y un checkbox. El motivo de esta publicación fue que tuve que utilizar un agrupador de productos en una lista desplegable que a su vez hacía dependiente a otra.

Para que podáis reproducir el ejercicio os dejo aquí las dos colecciones que he usado (pero que podrían ser listas de SharePoint, Dataverse, etc):

El tipo de productos:

ClearCollect(colTiposProductos; 
    {ID:1; Tipo:"Electrónica"};
    {ID:2; Tipo:"Ropa"};
    {ID:3; Tipo:"Muebles"};
    {ID:4; Tipo:"Juguetes"};
    {ID:5; Tipo:"Deportes"};
    {ID:6; Tipo:"Hogar"};
    {ID:7; Tipo:"Automotriz"}
);;

y todos los productos.

ClearCollect(colProductos; 
    {ID:1; Nombre:"Televisor 55''"; Tipo:"Electrónica"};
    {ID:2; Nombre:"Laptop Gaming"; Tipo:"Electrónica"};
    {ID:3; Nombre:"Smartphone 5G"; Tipo:"Electrónica"};
    {ID:4; Nombre:"Audífonos Bluetooth"; Tipo:"Electrónica"};
    {ID:5; Nombre:"Cámara Reflex"; Tipo:"Electrónica"};
    {ID:6; Nombre:"Camiseta deportiva"; Tipo:"Ropa"};
    {ID:7; Nombre:"Pantalón de mezclilla"; Tipo:"Ropa"};
    {ID:8; Nombre:"Chaqueta de cuero"; Tipo:"Ropa"};
    {ID:9; Nombre:"Zapatos deportivos"; Tipo:"Ropa"};
    {ID:10; Nombre:"Vestido de gala"; Tipo:"Ropa"};
    {ID:11; Nombre:"Sofá modular"; Tipo:"Muebles"};
    {ID:12; Nombre:"Mesa de comedor"; Tipo:"Muebles"};
    {ID:13; Nombre:"Silla ergonómica"; Tipo:"Muebles"};
    {ID:14; Nombre:"Cama king size"; Tipo:"Muebles"};
    {ID:15; Nombre:"Escritorio de oficina"; Tipo:"Muebles"};
    {ID:16; Nombre:"Muñeca interactiva"; Tipo:"Juguetes"};
    {ID:17; Nombre:"Coche teledirigido"; Tipo:"Juguetes"};
    {ID:18; Nombre:"Bloques de construcción"; Tipo:"Juguetes"};
    {ID:19; Nombre:"Juego de mesa"; Tipo:"Juguetes"};
    {ID:20; Nombre:"Peluche gigante"; Tipo:"Juguetes"};
    {ID:21; Nombre:"Balón de fútbol"; Tipo:"Deportes"};
    {ID:22; Nombre:"Bicicleta de montaña"; Tipo:"Deportes"};
    {ID:23; Nombre:"Pesas ajustables"; Tipo:"Deportes"};
    {ID:24; Nombre:"Raqueta de tenis"; Tipo:"Deportes"};
    {ID:25; Nombre:"Casco de ciclismo"; Tipo:"Deportes"};
    {ID:26; Nombre:"Aspiradora automática"; Tipo:"Hogar"};
    {ID:27; Nombre:"Freidora de aire"; Tipo:"Hogar"};
    {ID:28; Nombre:"Cafetera express"; Tipo:"Hogar"};
    {ID:29; Nombre:"Robot de cocina"; Tipo:"Hogar"};
    {ID:30; Nombre:"Plancha de vapor"; Tipo:"Hogar"};
    {ID:31; Nombre:"Llantas deportivas"; Tipo:"Automotriz"};
    {ID:32; Nombre:"Luces LED para coche"; Tipo:"Automotriz"};
    {ID:33; Nombre:"GPS para automóvil"; Tipo:"Automotriz"};
    {ID:34; Nombre:"Aceite sintético"; Tipo:"Automotriz"};
    {ID:35; Nombre:"Compresor portátil"; Tipo:"Automotriz"}
);;

Para cargar las colecciones las he incluido en la propiedad OnSelect de un botón.

En el primer desplegable, vamos a incluir en Ítems la colección colTiposProductos, y en DisplayFields: [«Tipo»] y en el segundo desplegable añadimos en la propiedad Ítems este otro código, que cuando detecta que el checkbox está seleccionado filtrará los productos en función del tipo de producto y si no está activado el checkbox entonces muestra todos los productos.

If(
    chkFiltrar.Value;
    //Si queremos multiselección
    Filter(
        colProductos;
        Tipo in ForAll(
            cbxTipoProducto.SelectedItems;
            Tipo
        )
    );
    //Si no vamos a usar multiselección
//Filter(colProductos; Tipo = cbxTipoProducto.Selected.Tipo); 
    colProductos
)

Adicionalmente, he añadido un línea de código comentando por si queremos que cuadro desplegable NO sea multiselección.

Y para finalizar, sobre la propiedad OnUnChecked, debéis colocar el Reset(cbxTipoProducto).

Y esto es todo, espero que sea de utilidad!