Canvas Apps in Power Apps: Fundamentals, how they work, and best practices
Canvas Apps are the most flexible and customizable way to build applications in Microsoft Power Apps. Unlike Model-driven apps, a Canvas App starts with a blank canvas where you decide the layout of each screen, which controls to use, how to connect to data sources, and how the logic should behave using Power Fx.
In this article, we’ll cover what a Canvas App is, how it works, essential Power Fx examples, and recommended best practices for real-world scenarios.
What is a Canvas App?
A Canvas App is a low-code application built with a drag-and-drop design experience where makers can:
- Design fully custom user interfaces.
- Connect to multiple internal and external data sources.
- Implement business logic using Power Fx formulas.
- Target mobile, tablet, or web form factors.
- Integrate automation and APIs.
It is especially useful when you need:
- Highly customized UI and UX.
- Mobile apps for field teams.
- Smart forms with conditional logic.
- Apps that aggregate data from multiple sources.
Key characteristics of Canvas Apps
-
🎨 Full layout control
You decide the exact placement of every control on the screen. -
⚡ Logic with Power Fx
A declarative, Excel-inspired formula language that makes it easier for business users and developers to collaborate. -
🔗 Connectors to hundreds of data sources
Including Dataverse, SharePoint, SQL Server, Excel, Microsoft 365, Dynamics 365, and custom APIs. -
📱 Support for mobile, tablet, and web
You can build apps optimized for a specific form factor or use responsive patterns. -
🧩 Reusable components
Encapsulate UI and logic into components that can be reused across screens and apps. -
🔐 Enterprise security and governance
Integrated with Microsoft Entra ID, Dataverse security roles, and environment-level governance.
Basic structure of a Canvas App
A typical Canvas App includes:
- Screens: Home, Details, Edit, Settings, etc.
- Controls: Galleries, forms, buttons, labels, text inputs, icons, etc.
- Power Fx formulas: Attached to properties such as
Items,OnSelect,Visible,Default, etc. - Data connections: Dataverse, SharePoint, SQL, Excel, and more.
- Variables and collections: To store state and temporary data.
Example names for screens and controls:
HomeScreen
DetailsScreen
EditScreen
galProducts
frmCustomer
btnSave
txtSearch
Introduction to Power Fx in Canvas Apps
Power Fx is the low-code formula language used by Canvas Apps. It is declarative and designed to be approachable for makers familiar with Excel.
Example 1: Filtering data in a gallery
Items property of a galProducts gallery:
Filter(
Products,
Category = "Electronics"
&& txtSearch.Text in Name
)
Example 2: Creating a global variable on app start
OnStart property of the app:
Set(
CurrentUser,
User()
);
Set(
IsManager,
"Manager" in CurrentUser.Email
)
Example 3: Navigating between screens
OnSelect property of a button:
Navigate(
DetailsScreen,
ScreenTransition.Fade
)
Example 4: Validating data before submitting a form
If(
IsBlank(txtEmail.Text),
Notify(
"Email is required.",
NotificationType.Error
),
SubmitForm(frmCustomer)
)
Data connections in Canvas Apps
Canvas Apps can connect to:
- Microsoft Dataverse
- SharePoint
- SQL Server
- Excel in OneDrive/SharePoint
- Microsoft 365 (Outlook, Teams, etc.)
- Dynamics 365
- Custom APIs through Custom Connectors
Example: load data from a connected data source named Products into a local collection:
ClearCollect(
colProducts,
Products
)
Example: submit changes to Dataverse through a form:
SubmitForm(frmOrder)
Reusable components in Canvas Apps
Components are a powerful way to reuse UI and logic, for example:
- Navigation bars.
- Headers with title and action buttons.
- Footers with user and environment information.
- Search controls that can be reused across multiple screens.
Example: using a component cmpHeader with a custom property TitleText:
cmpHeader.TitleText = "Main dashboard"
You can also expose output properties, such as an OnAction behavior, so that other controls can respond to events triggered within the component.
Common real-world scenarios for Canvas Apps
1. Field inspection apps
- Capture photos, GPS coordinates, and notes.
- Register inspection results.
- Send reports by email or Teams using Power Automate.
2. Inventory management
- Scan barcodes or QR codes using the device camera.
- View and update stock levels in Dataverse or SQL.
- Track item movements with audit trails.
3. Smart enterprise forms
- Purchase, vacation, and expense requests.
- Dynamic validation and conditional fields.
- Approval workflows integrated with Power Automate.
4. Mobile operational dashboards
- Real-time visibility of key metrics.
- Integration with Power BI and Dataverse.
- Quick access to KPIs from a mobile device.
Best practices for Canvas Apps
1. Naming conventions
Use prefixes to identify control types:
btnSave
txtEmail
galOrders
frmCustomer
lblTitle
cmpSidebar
This improves readability and maintainability.
2. Avoid delegation issues
When working with large datasets, make sure your formulas are delegable, meaning that the query runs on the server instead of on the client.
Functions such as Filter, Search, Sort, and LookUp are delegable for many data sources, but delegation support depends on the connector. Always pay attention to delegation warnings in Power Apps Studio.
3. Use collections responsibly
Collections (Collect, ClearCollect) are useful, but:
- Avoid loading unnecessarily large volumes of data.
- Prefer direct connections to the data source when possible.
- Use collections for caching or offline scenarios.
4. Optimize app startup
Instead of loading everything in OnStart, think carefully about what the user needs on the first screen and what can be loaded on demand.
5. Keep formulas readable
Break complex logic into smaller parts using variables:
Set(
IsValidEmail,
!IsBlank(txtEmail.Text) && "@" in txtEmail.Text
);
If(
IsValidEmail,
SubmitForm(frmCustomer),
Notify("Email is not valid.", NotificationType.Error)
)
When to choose a Canvas App
Choose a Canvas App when:
- UI/UX and visual design are a priority.
- You are building mobile- or tablet-first experiences.
- You must integrate multiple data sources in a single interface.
- You want to build quickly with high visual flexibility.
- You need forms with advanced conditional logic.
If your scenario is heavily driven by business processes and a structured Dataverse data model, a Model-driven app may be a better fit. In many real projects, Canvas Apps and Model-driven apps are used together.
Conclusion
Canvas Apps are a core part of Power Apps and the entire Power Platform. They provide a powerful combination of visual design, declarative logic with Power Fx, enterprise data connectors, and mobile capabilities. Mastering Canvas Apps enables you to deliver business applications that are fast to build, highly customized, and closely aligned with how users actually work.
Official references (Microsoft Learn)
-
Canvas Apps overview
https://learn.microsoft.com/power-apps/maker/canvas-apps/ -
Power Apps overview
https://learn.microsoft.com/power-apps/powerapps-overview -
Power Fx documentation
https://learn.microsoft.com/power-platform/power-fx/ -
Delegation overview
https://learn.microsoft.com/power-apps/maker/canvas-apps/delegation-overview -
Controls reference
https://learn.microsoft.com/power-apps/maker/canvas-apps/controls/control-reference -
Components in Canvas Apps
https://learn.microsoft.com/power-apps/maker/canvas-apps/component-framework/