Are you tired of being stuck with the limitations of Gallery.Selected in your apps? Do you like having control of your app? Tired of confusing sequence for you users? Then take back control by switching to variables instead of Gallery.Selected.
In this guide, we’ll dive into how to shift from using Gallery.Selected to a variable-based approach for better control, smoother navigation, and an overall improved user experience in Power Apps. We’ll go step-by-step on how you can introduce a single variable to manage record selections, handle new records more intuitively, and add more customization to your app—all while making your code cleaner and more efficient.
And if you are more into seeing is believing then check out my 12-minute YouTube video Don't use PowerApps Gallery Selected Item
Why Ditch Gallery.Selected?
Using Gallery.Selected feels like a no-brainer when you first start building with Power Apps. It’s straightforward and provides an easy way to reference the record that a user clicks on. But… it’s not without its limitations:
Lack of control: Once a user selects a record, Power Apps doesn’t let you control the next steps as much as you might like. This can lead to unintended highlights and inconsistencies, especially when users create or cancel new records.
Inconsistent behavior: When a new record is created, the gallery often still highlights the previously selected item. Awkward, right?
Limitations in multi-screen apps: Using Gallery.Selected across screens becomes tricky and isn’t as intuitive for users or developers.
These limitations make a compelling case for switching to a variable-based approach, where we can leverage context and global variables to create a more reliable, user-friendly experience.
Step 1: Setting Up Your Variable
First things first, let’s create a variable to replace Gallery.Selected. You’ll use this variable to store the record information whenever a user clicks on an item in the gallery.
Go to the gallery’s OnSelect property and add the following line of code to create a new variable (we’ll call it varRecord for simplicity):
Set(varRecord, ThisItem)
Now, instead of relying on Gallery.Selected, set your form’s Item property to varRecord. This will allow the form to reflect the selected record without directly depending on the gallery's selection.
Step 2: Updating the Visual Cues
Let’s add a few visual tweaks to make the selection experience smoother and more intuitive for users. This part is all about using varRecord to highlight the selected record, without those pesky issues tied to Gallery.Selected.
Go to your gallery’s TemplateFill property and replace any reference to ThisItem.IsSelected with a condition that highlights based on varRecord . Here’s a quick example using the ID of each record:
If(ThisItem.ID = VARrecord.ID, Color.LightBlue, Color.Transparent)
Update any other properties that rely on ThisItem.IsSelected, like font weight or colors, using varRecord instead.
Remember in the example above ID is the primary key column from the SharePoint list. If you are using another data source then you might not have ID as a column. Dataverse, for example, uses a unique identifier column that is named similar to the table name. The key is you need to find the primary column.
Step 3: Customizing the New and Cancel Buttons
Now that we’ve removed Gallery.Selected from the picture, let’s get our new and cancel record actions working flawlessly.
For New Records: When a user clicks the “New” button, update varRecord to a blank value. This way, your gallery won’t highlight a record while the new form is open.
Set(varRecord, Blank());NewForm(Form1)
You may also want to repeat this step on the Cancel button. Or other places in your app you wish to clear the selected item.
This approach ensures that your gallery and forms remain synchronized with each other, providing users with a seamless experience.
Step 4: Setting Default Records (Optional)
Want your app to open with a specific record highlighted? You can set varRecord to a default record (like “Greg” or “Chewy”) when the app starts. This is perfect if you want a particular item to show up as the default view when users first open the app.
Steps:
In your app’s OnStart property, add:
Set(varRecord , LookUp(YourDataSource, ID = 1)) // Replace ID = 1 with your desired default
Now, your app opens with the specific record highlighted automatically. No more blank first screens!
In the video, you will see additional functionality, like adding a custom label that appears when the variable is blank and the form isn't in new mode like shown below.
Now that you have complete control of when something is or isn't "selected" you can build whatever custom experience you would like.
Benefits of Using a Variable
Switching to a variable-based approach isn’t just a workaround—it’s an upgrade! Here are a few benefits:
Better control: Gain more control over your gallery’s behavior, ensuring that records are only highlighted when and where you want them.
More intuitive navigation: New and canceled records are handled seamlessly, without confusing the user with leftover highlights.
Cleaner code: Using a single variable simplifies the app’s logic, making your code easier to read and maintain.
Final Thoughts
So there you have it! Ditching Gallery.Selected and embracing variables can give you and your users a smoother, more reliable experience in PowerApps. And, of course, it’ll make your app code cleaner, giving you less to troubleshoot when things go sideways.
If you’re looking for even more PowerApps tips and tricks, we’re constantly adding new tutorials and updates. And if you’re curious about more ways to enhance your PowerApps skills, check out our training sessions. We offer everything from 30 minutes of mentoring to 30 years of project building, just hit the contact button and let us know what you need.
Comments