Announcing public preview of Custom Pages for converging model-driven apps and canvas apps

We are happy to announce the public preview of Custom Pages which was demonstrated at Microsoft Business Applications Summit and mentioned in Better together: introducing Custom Pages and the Modern App Designer. This is a big leap forward in the convergence of model-driven apps and canvas apps into a single Power App. This does not change the support for the stand alone canvas app but enables the new Power App converging model and canvas.

A custom page can be used in places where all pages are supported including main area, dialogs, and the new app side pane.  This allows scenarios like a pixel perfect landing page with data pulled from across the organization, data driven pages that use a record’s data to change the experience, dialog designed to optimize specific business actions, and productivity tools that support the main tasks for the app.

Custom pages can be opened from the sitemap for easy access or can be opened from existing model-driven app logic using the Client API. Custom pages can open other custom pages or model pages.  The custom page participates in the page stacking the browser or page back buttons.

Custom Pages in a model-driven app provide flexibility and ease of authoring which are difficult to accomplish within existing model pages.  App creation in Power Apps is no longer an upfront decision between the canvas and model.  When you start with the model-driven app you can easily add custom pages to take advantage of the power of canvas authoring.

The recently announced Introducing the Modern App Designer (Preview) is extended to provide the ability to create or add existing custom pages.

The canvas designer is used to author the custom page and has been updated to simplify the experience.  The command bar allows save and publish directly from main experience.  The insert pane shows the list of controls which are supported initially within the custom page.

For a custom page to work well within the responsive model-driven app, layout containers are the easiest approach providing resize and reflow without any formulas.  Most custom page designs can be accomplished with nesting either vertical or horizontal layout containers.

Navigation from the custom page is managed using existing functions to Navigate and go Back using tables and records as context.

The custom page will easily allow for data beyond Dataverse using the 400+ connectors available with Power Apps.  With public preview we have enabled the most used connectors such as SharePoint, SQL, Office 365, Outlook, Excel Online, Excel in OneDrive, Power Automate, and custom connectors.  The status of connectors is available in Add connectors to a custom page for your model-driven app (preview).  The connectors used within a custom page are consolidated to the PowerApps app (model-driven app) during the publish within the Power Apps app designer.  This enables sharing of consent across multiple custom pages.

Custom pages enable use of the most common out of box controls which includes the Fluent UI controls found in the canvas apps embedded in Teams.  You can also add custom canvas components to a custom page by authoring your own low code components inside a canvas library and reuse them across single or multiple model-driven applications. Additionally custom page also has support for recently announced general availability of Power Apps component framework for canvas apps.  This framework enables 1st and 3rd party professional developers to extend the custom page seamlessly with pro-dev controls. Code components for custom pages are able to take advantage of model app runtime and hence provide support for additional framework APIs like Web API, Navigation etc which are not yet supported on stand alone canvas apps. For more details please see add code components to a custom page for your model-driven app. Control on the custom page use the default Unified Client theme colors to ensure  consistent experience when running the new converged Power Apps app.

The custom page is solution aware component that appears in the solution with type Page.  It can be created from the New menu of a solution or from within the Power Apps app designer.  A custom page can be included in one or more Power Apps apps and one or more solutions.  Moving from one environment to another is handled through the normal export and import process.  Importing a solution with the model-drive app and linked custom pages will publish both so it is ready to run.

Public preview for custom pages is a big first step in converging model and canvas which starts a journey that we can continue to build on.  More information is available through Overview of custom pages for model-driven apps.  The feature rollout is already in progress for early stations and will soon be available in additional regions.

We look forward to your feedback on making and running custom pages! Let us know your thoughts and suggestions within the community post Feedback on Custom Page public preview.