Maximize Power Apps Galleries with Multi-Select Functionality and “Select All” Options

Power Apps is a versatile platform for creating functional and user-friendly applications. A common feature desired by users is the ability to select multiple items from a gallery, enhancing app usability. In this post, we will provide step-by-step instructions to add checkboxes for multi-item selection and manage dynamic UI elements within Power Apps galleries. Follow these simple steps to incorporate a basic multi-select experience into your galleries.

How to Add Checkboxes to Power Apps Galleries

To enable multiple item selection, use the Gallery control in Power Apps. Its repetitive nature makes it perfect for displaying a scrollable list. Follow these steps to add checkboxes to your gallery:

Create a table of choices: Add it to your gallery. Include all relevant information to aid users in making their selections. If the options are not readily available, you can easily create a table using the format [“Choice 1,” “Choice 2,” “Choice 3”]. This table can be added to the gallery’s Items property, or you can use a table from a data source.

Insert a Checkbox control: Insert a Checkbox control into the gallery. It will automatically appear on each row. Clear the Text property and position it on the left side of the gallery.

Update Selected Items: Use the OnCheck and OnUncheck events of the checkbox to update the selected items. Set the OnCheck property to Collect(SelectedItems, ThisItem) to add the selected item to a collection called SelectedItems. In OnUncheck, use the function Remove(SelectedItems, ThisItem) to remove the deselected item from the collection.

Apply Default Selection: Set the Default property of the checkbox to:
•  If(ThisItem in SelectedItems, true, false)

Here’s a summary of the steps with all the necessary Power FX formulas

1. Gallery:
   •  Insert a blank vertical gallery connected to your data table.
2.  Checkbox:
   •  OnCheck: Collect(SelectedItems, ThisItem)
   •  OnUncheck: Remove(SelectedItems, ThisItem)
   •  Default: If(ThisItem in SelectedItems, true, false)/li>
3. Label to Display Selected Items:
   •  Text: Concat(SelectedItems, ItemName & “, “)

Add “Select All” and “Deselect All” Options to Power Apps Galleries

To add even more functionality to your galleries, you can implement multi-select and “Select All” options.

1. Create Buttons/Icons:
     •  Create a button or icon for your “Select All” option outside of the gallery.
     •  For the OnSelect property of the button/icon, use the function ClearCollect(SelectedItems, Gallery1.AllItems) to add all items from the gallery to the SelectedItems collection.
     •  Insert another button/icon for “Deselect All.”

2. Deselect All Button/Icon:
     •  For the OnSelect property, use the function Clear(SelectedItems) to remove all items from the SelectedItems collection.

Retrieve Selected Items from the Gallery

To get a table of the selected items from the gallery, use the Filter function with the gallery’s AllItems property. If your gallery is named Gallery1 and your checkbox is named Checkbox3, use this formula in a Label to display the number of selected items:
• CountRows(Filter(Gallery1.AllItems, Checkbox3.Value))

Tables are organized tools used to present data in an easy-to-analyze format. To create an effective table, use contrasting colors, keep it simple, label headings, maintain consistency in data formatting, use alignment and spacing, and consider size and orientation. Additionally, for a user-friendly experience, try adding a “Select All” and “Deselect All” feature, as well as interactive features like filtering and sorting.

Author: Michael Shipman