Improved variables and collections experience in Canvas Designer

Creating variables and collections is an essential part of the app building process. Therefore, we are excited to announce the general availability of an improved, seamless experience that enables makers to see variables and collections directly in-line with the canvas designer!

Gone are the days of switching between the app designer and backstage to set and manage variables and collections. In the new experience, app makers can now define and interact with them in real-time while designing the app. This creates an intuitive and seamless app-building process where makers can focus on building apps efficiently without unnecessary back and forth clicks.

graphical user interface, application
New variables pane in Canvas Designer

View variables in app

While both variables and collections are defined the same way – using Power Fx, the new Variables panel is now available as part of the left rail in the app designer. Within the new Variables panel, it contains global variables, context variables, component variables, and collections. When each section is expanded, you can interact with each variable to view its definition, direct and indirect uses. By clicking on the results, the item in the app is then selected and shown on the relevant page with the formula bar highlighted.

graphical user interface, application
Interacting with the new variables pane and launching the modal

View collections in app

Collections are located in the same panel, right underneath Variables. By clicking on ‘View Table’ in the ellipses, a modal appears showing the details of all the variables and collections established in the app. In the same modal, you can also view all the other variables in details, such as images or tables.

graphical user interface, text, application
Modal showing variables and collection details

Learn More

For more information on setting variables or creating collections in canvas, please refer to further documentation below: