Skip to main content
Microsoft logo
Power Apps
    • AI Builder
    • Automate processes
    • Azure + Power Apps
    • Build apps
    • Connect data
    • Pages
    • Take a guided tour
  • Pricing
    • Overview
    • Become a Partner
    • Find a Partner
    • Find partner offers
    • Partner GTM Resources
    • Blog
    • Customer stories
    • Developer Plan
    • Documentation
    • For IT Leaders
    • Roadmap
    • Self-paced learning
    • Webinars
    • App development topics
    • Overview
    • Issues
    • Give feedback
    • Overview
    • Forums
    • Galleries
    • Submit ideas
    • User groups
    • Register
    • ·
    • Sign in
    • ·
    • Help
    Go To
    • Power Apps Community
    • Welcome to the Community!
    • News & Announcements
    • Get Help with Power Apps
    • Building Power Apps
    • Microsoft Dataverse
    • AI Builder
    • Power Apps Governance and Administering
    • Power Apps Pro Dev & ISV
    • Power Apps Portals
    • Connector Development
    • Power Query
    • GCC, GCCH, DoD - Federal App Makers (FAM)
    • Power Platform Integration - Better Together!
    • Power Platform Integrations
    • Power Platform and Dynamics 365 Integrations
    • Community Blog
    • Power Apps Community Blog
    • Galleries
    • Community Connections & How-To Videos
    • Community App Samples
    • Webinars and Video Gallery
    • Canvas Apps Components Samples
    • Kid Zone
    • Emergency Response Gallery
    • Events
    • 2021 MSBizAppsSummit Gallery
    • 2020 MSBizAppsSummit Gallery
    • 2019 MSBizAppsSummit Gallery
    • Community Engagement
    • Community Calls Conversations
    • Experimental
    • Error Handling
    • Power Apps Experimental Features
    • Community Support
    • Community Accounts & Registration
    • Using the Community
    • Community Feedback
    cancel
    Turn on suggestions
    Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
    Showing results for 
    Search instead for 
    Did you mean: 
    • Power Apps Community
    • Galleries
    • Webinars and Video Gallery
    • Customize Command bar using Command Designer in Mo...

    Customize Command bar using Command Designer in Model-Driven App

    12-02-2021 01:13 AM

    Super User Dhruvin
    Super User
    468 Views
    LinkedIn LinkedIn Facebook Facebook Twitter Twitter
    Dhruvin
    Super User Dhruvin
    Super User
    • Mark as New
    • Bookmark
    • Subscribe
    • Mute
    • Subscribe to RSS Feed
    • Permalink
    • Print
    • Report Inappropriate Content

    Customize Command bar using Command Designer in Model-Driven App

    ‎12-02-2021 01:13 AM

    This video demonstrates how we can customize command bars in model-driven apps without code! These new capabilities play a major role in the convergence of canvas and model-driven apps. Introducing the first-ever command designer – complete with Power Fx for expressing powerful low-code logic in model-driven apps. These new capabilities are a complete re-imagination of commanding (formerly known as the “Ribbon”) for model-driven apps. It’s built on a new, modern infrastructure that’s conducive to both model-driven and canvas app technologies and will scale into the future. During this video, we will customize command bad using command designer in a model-driven app. We will check how we can write Power Fx code to customize the command bar. We will also check how we can open custom pages as dialogs and how we can use PCF components in Canvas Pages and add them as side navigation for Model Driven App using Command bar Action. Also, we will pass the parameters from the Model-Driven app to canvas pages. Stay tuned for all these amazing features!

     

    The video covers the following information in detail!
    1. How can I customize the command bar in the model driven app without writing a code?
    2. How can I write Power Fx commands for command bar actions?
    3. How to use command designer in Model-Driven App?
    4. How can I open custom pages as dialogs in model-driven app?
    5. How to open Canvas Page as Side Pane in model-driven powerapps?
    6. How to open the canvas page as a center dialog?
    7. How to open the canvas page as full-page dialog?
    8. How to use PCF components in canvas pages?
    9. How to pass parameters for selected items from model-driven app to canvas pages?

     

    Chapters:
    00:00 Start
    01:30 Precap
    02:41 End Outcome
    03:47 PCF Components in Canvas Pages
    05:48 Customize Command Bar in Model Driven App
    06:28 Add New Command in Command Bar
    07:20 Write Power Fx Code on Command Button
    08:00 Use Cases for Power Fx for Command Bar Button
    09:09 Open Canvas Pages as Side Dialog, Center Dialog and Full Pages
    09:55 Create a Command Bar to open Canvas Page as Side Dialog
    19:58 Code to Open Canvas Page as Side Dialog
    13:29 Upload Javascript File as Web Resource
    15:40 Create Canvas Page with PCF Components
    21:19 Open Canvas Page as Center Dialog and Full Page Dialog
    23:50 Publish Everything and Test all Dialog
    27:00 Pass Model Driven Parameter to Canvas Page
    29:00 Open Specific Record from Model Driven to Canvas Page with Parameter
    30:15 Make Changes in Canvas Page to grab Model Driven Context
    32:15 Publish Changes
    33:20 Recap
    34:20 Subscribe

     

    Watch First Episode for this series:
    Part One: Add a Custom Page to Model-Driven Power Apps
    https://youtu.be/pymLL4CThIc

     

    Part Two: Customize Command bar using Command Designer in Model-Driven App
    https://youtu.be/6nWceaCxk7Y


    ****************
    References:
    https://docs.microsoft.com/en-us/powerapps/maker/model-driven-apps/commanding-designer-use-custom-pa...

     

    Code Reference:
    https://docs.microsoft.com/en-us/powerapps/developer/model-driven-apps/clientapi/navigate-to-custom-...

     

    Download Code from GitHub Repo:
    https://github.com/Dhruvinshah16/PowerApps/tree/master/Model%20Driven%20-%20Canvas%20Pages%20and%20C...

     


    ***************
    Link for PCF Components by Lowcodera !
    Website: https://lowcodera.com/


    Lookbook for Lowcodera: https://lowcodera.com/lookbook/


    Register for Private Preview: https://lowcodera.com/private-preview/


    Contact Lowcodra: https://lowcodera.com/contact/

     

    ********************
    Follow me on Instagram:
    https://www.instagram.com/powerplatformguy/

     

    Follow me on all social Media Handles:
    https://linktr.ee/dhruvin.shah

     

    ***********************


    #PowerApps #CommandBar #ModelDrivenApp #PowerPlatform #PowerAddicts #LowCode #PowerFx

    watch?v=6nWceaCxk7Y

    Labels:
    • Labels:
    • General PowerApps
    • Model-Driven Apps
    Message 1 of 1
    468 Views
    0 Kudos
    Reply
    • All forum topics
    • Previous Topic
    • Next Topic

    Power Platform

    • Overview
    • Power BI
    • Power Apps
    • Power Pages
    • Power Automate
    • Power Virtual Agents

    Browse

    • Sample apps
    • Services

    Downloads

    • Windows
    • iOS
    • Android

    Learn

    • Documentation
    • Support
    • Community
    • Give feedback
    • Blog
    • Partners

    • © 2023 Microsoft
    • Follow Power Apps
    • Privacy & cookies
    • Manage cookies
    • Terms of use
    • Trademarks
    California Consumer Privacy Act (CCPA) Opt-Out Icon Your California Privacy Choices