Add a Custom Page to Model-Driven Power Apps

This video guides you through creating and editing a custom page for a model-driven app using the modern app designer. During this video, we will discuss how we can add a custom canvas page to the Model-Driven Power Apps using Modern App Designer. This new feature fills the gap between Canvas App and Model-Driven Apps. 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. Canvas pages are mostly used for Pixel-perfect UI. Now, with Model Driven Apps as well we can easily add our canvas page and develop awesome user interfaces!! I have divided this video series into two parts. Here, we will create a custom page inside the model-driven power apps. We will pass the context from our Model-Driven app to Canvas App. So, let’s get started!

We will learn the following concepts!
1. Real Life scenario for a combination of Canvas App and Model Driven App
2. Create your first Model Driven app and add your custom canvas page
3. Create a Canvas Page
4. Create Responsive Gallery for Canvas Page
5. Pass Context from Canvas App to Model Driven PowerApps
6. Open Model Driven New Form from Canvas Page Button
7. Open Model Driven Edit Form from Canvas Page’s Gallery
8. Getting started with Custom Pages in Model Driven Power Apps
9. Custom Pages for converging model-driven apps and canvas apps

Chapters:
00:00 Start
01:00 End Outcome
03:32 Business Use Cases and Prerequisites
04:45 Create Dataverse Table for IT HelpDesk
06:12 Customize View
07:06 Customize Form
07:50 Canvas App - IT HelpDesk
08:41 Add Custom Pages in Model-Driven App
09:12 Create Model Driven App
09:36 Add table view and form
10:25 Add Custom Pages
12:13 Connect Data Source in Canvas Pages
13:34 Create Responsive Header
16:33 Create Responsive Gallery
20:14 Set Gallery Wrap Count to make Responsive
22:22 Pass Context from Canvas to Model-Driven Pages to open New Form
23:13 Pass Context from Canvas to Model-Driven Pages to open Edit Form
23:53 Check Preview and Run App
24:01 Publish Model Driven App and Check Preview
26:15 Subscribe!!

Check Part 2 For the same video here:
***********************
Watch First Episode for this series:
Part One: Add a Custom Page to Model-Driven Power Apps

Part Two: Customize Command bar using Command Designer in Model-Driven App

*********
Model Driven App Step by Step Series

***********
References:

************
Follow me on Instagram:

Looking for Consultancy? Connect Here!

Follow me on all social Media Handles:

#PowerApps #CustomPage #ModelDrivenApp #PowerPlatform #PowerAddicts #LowCode

[simonwilliams]

Really helpful demonstration. Thank you for taking the time to create this!

[iamdhruvinshah]

Check Part 2 for the same video series on how to customize command bar
Part Two: Customize Command bar using Command Designer in Model-Driven App

[iamdhruvinshah]

Model Driven App Step by Step Series

Check Part 2 for the same video series on how to customize command bar
Part Two: Customize Command bar using Command Designer in Model-Driven App

[dougydoe]

Great video and extremely helpful. Thanks for sharing.

[SandeepSingh-lgbq]

Thank u so much for sharing this, yesterday only I had done this in my current project 😀😀😀😀😀

[saqnevermind]

Good one. Very Informative. Thanks for sharing this.

[mangeshmalvankar]

Hey Dhruvin simple to understand all Model-driven apps concepts, thanks a lot!

[pradipta]

how to add it to a TAB of Form and send parameters to Custom page ?

[kshitizgv]

Hi Dhruvin, does custom page or this type of features requires any special licences? It's asking me to sign at the end, going back to MDA, I have published the app also, but same sign-in error. Please help me out.

[kondaiahbhumireddy]

Hi Dhruvin
Thanks for sharing information.
How we can move SQL tables data into Data verse tables in model driven apps.
Please guide me.

[sadzag]

Hello,
Thanks for the video.
How can I send back data from custom page to a quick create form?

[ContractRocket]

Would it be easier to embed a "filtered" Power BI report into a Model-Driven App using a Canvas App + Custom Page? I would like to embed a "filtered" Power BI report within a Model-Driven app record form - example: on a Product form/record (product "abc") --- I want to embed a Power BI report that only displays sales related to Product "ABC". What is the best approach to accomplish? Note: I've read the documentation --- but I'm a "citizen developer" -- and I'm struggling to understand how best to accomplish this with a Power App. I've been able to embed Power BI filtered reports within Salesforce forms and well as Quickbase forms via URL like this should be easier to do within a Power App model-driven....



I appreciate any advice or any links to your videos discussing this --- Thank you!!!

[purvipatel]

Hi Dhruvin,
I have a question that how we can display data in 2 columns in vertical gallery as you show n in current video, I have seen your canvas app series but i didn't get idea about this type of arrangment of columns in custom gallery controls. can you please explain?

[MrPJMR]

I added a custom page on a model-driven app. It is working fine when being accessed from the web and android but has error when being access through apple. The error is "User is not logged in.Error: There is no signed in user". but the user is signed in, how do we resolve this?

[nandakumarpa]

Hi Dhruvin... I am working on a custom page which allows the user to add and delete images from blob storage...but I am not ablet to find "add picture" control, I know some of the controls are not available in custom page..is there any alternative I can achieve this functionality ?