Canvas Apps: Screens, Controls and Properties

What is Power Apps?

Power Apps lets you create business apps without traditional development: purchase request entry, inventory, field inspection, visit tracking. Apps run in a browser, on mobile (the Power Apps app) and in Teams. They rely on data sources (SharePoint lists, Dataverse, Excel, SQL…) and can trigger Power Automate flows.

You build them on make.powerapps.com and there are two types:

Type	Principle	When to use it
Canvas	you design each screen, pixel by pixel, and write formulas	custom interfaces, mobile, varied sources
Model-driven	the app is generated from Dataverse tables, forms and views	data-rich processes, standardized interface

This course is about canvas apps.

The studio

Create > Blank app > Blank canvas app opens Power Apps Studio:

• the tree view (on the left): the screens and their controls;
• the canvas (in the center): the screen being designed;
• the properties pane (on the right): the settings of the selected control;
• the formula bar (at the top): the dropdown list of properties and the formula of the chosen property;
• the Insert menu: labels, buttons, text inputs, dropdowns, galleries, forms, icons.

Choose the format (phone or tablet) at the start: it sets the proportions of the screens.

Properties that are formulas

Each control has properties: Text, Fill (background color), Color, Visible, X, Y, Width, Height, DisplayMode… The value of a property is a Power Fx formula, recalculated automatically as soon as a value it depends on changes, exactly like an Excel cell.

Example: a text input txtNom and a label whose Text property is:

"Bonjour " & txtNom.Text

As soon as the user types their name, the label updates, with no button or extra code. Likewise, the Visible property of a button can be !IsBlank(txtNom.Text): the button appears only if the name has been entered.

Function names are always in English (If, Filter, Navigate). However, in a Power Apps configured for French, the separators follow the language: ; between arguments (instead of ,), ;; to chain actions (instead of ;), and the comma as the decimal separator (1,5). Microsoft’s documentation, written in English, uses , and ;: adapt accordingly.

Behavior properties

Some properties do not calculate a value but run actions on an event: OnSelect (click or tap), OnChange, OnVisible (when a screen is displayed), App.OnStart (when the app opens). Example on a button:

Navigate(EcranDetail; ScreenTransition.Fade)

Navigate displays another screen, Back() returns to the previous one. Several actions are chained with ;;:

Notify("Demande enregistrée"; NotificationType.Success);; Navigate(EcranAccueil)

Name, test, publish

• Name screens and controls with a prefix: scrAccueil, lblTitre, btnValider, txtMontant, galDemandes. Formulas become readable.
• Test with Preview (F5); exit with Esc. In the studio, hold Alt to click a button without leaving design mode.
• Save creates a version; Publish makes that version available to users. As long as you don’t publish, they keep using the previous one.
• The app checker (stethoscope icon) lists formula errors and accessibility issues.