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
    • Canvas Apps Components Samples
    • Re: #PPOC2020 - Hamburger Menu Component

    Re: #PPOC2020 - Hamburger Menu Component

    05-27-2020 15:55 PM

    ihassig
    Regular Visitor
    2046 Views
    LinkedIn LinkedIn Facebook Facebook Twitter Twitter
    Carsten_Growth
    Power Apps Carsten_Growth
    Power Apps
    • Mark as New
    • Bookmark
    • Subscribe
    • Mute
    • Subscribe to RSS Feed
    • Permalink
    • Print
    • Report Inappropriate Content

    #PPOC2020 - Hamburger Menu Component

    ‎03-20-2020 11:28 AM

    Today is the day of Microsoft Power Platform Online Conference 2020 (#PPOC2020). As a community we love to meet at in-person events, but in times like these it is pretty important to have the opportunity to learn and get together online as well.
    Nevertheless on recent hackathons I was asked about some of my "ninja black-belt" skills which allows me to come up with apps quite fast and all of them having a clean and nice UI look & feel (to be discussed), I wanted to contribute to this initiative and share with you today the component:

     

    • Hamburger Menu Component
      • Main configuration via two tables - HamburgerMenuItems and HamburgerSubMenuItem - for samples see the component and keep the structure
      • Output properties:
        • IsExpanded (boolean) - to allow full control of visibility from your app
        • SelectedHamburgerMenuItemID (number) - the number (ID) of the item the user clicked on
        • SelectedHamburgerSubmenuItem (number) - the number (SubID) of the item the user clicked on
      • using nested galleries to allow you to build a hamburger menu for your canvas applications

    Use the component as is. Build your apps faster in challenging times like these and never stop learning and sharing.
    You can reach and follow me on Twitter @ carsten_growth where I am sharing stuff from my day to day business

    Preview file
    15 KB
    HamburgerMenuComponent_20200320175826.zip
    Labels:
    • Labels:
    • Components
    Message 1 of 6
    2,315 Views
    2 Kudos
    Reply
    • All forum topics
    • Previous Topic
    • Next Topic
    KF88D
    KF88D
    New Member
    • Mark as New
    • Bookmark
    • Subscribe
    • Mute
    • Subscribe to RSS Feed
    • Permalink
    • Print
    • Report Inappropriate Content

    ‎04-28-2020 08:53 AM

    Hello,

     

    Can you explain for me how you used the icons in the menu and how to change it with internal once???

     

    Thanks.

    Message 2 of 6
    2,149 Views
    0 Kudos
    Reply
    Carsten_Growth
    Power Apps Carsten_Growth
    Power Apps
    In response to KF88D
    • Mark as New
    • Bookmark
    • Subscribe
    • Mute
    • Subscribe to RSS Feed
    • Permalink
    • Print
    • Report Inappropriate Content

    ‎05-13-2020 11:32 PM

    This menu sample is using svg icon concept. The svg for an icon can be easily catched by using another gallery sample available here.

    If you want to use the build-in icons instead, you would need to modify the component such as Img_HamMenuItem inside the gallery would need to have a modification on Image property.

    Message 3 of 6
    2,102 Views
    2 Kudos
    Reply
    ihassig
    ihassig
    Regular Visitor
    In response to Carsten_Growth
    • Mark as New
    • Bookmark
    • Subscribe
    • Mute
    • Subscribe to RSS Feed
    • Permalink
    • Print
    • Report Inappropriate Content

    ‎05-27-2020 03:55 PM

    Hello @Carsten_Growth , 

    Thank you very much for sharing this component it is very helpful for everyone. I want to ask you a question: How does navigation between screens work? I see that in the definition of the menu tables and submenus they are not defined, and in the context variables, I have not managed to do it. Do you have any suggestions? Thank you very much for your time and help.

     

    Ivan Hassig

     

    Message 4 of 6
    2,046 Views
    1 Kudo
    Reply
    NaviL
    NaviL
    New Member
    • Mark as New
    • Bookmark
    • Subscribe
    • Mute
    • Subscribe to RSS Feed
    • Permalink
    • Print
    • Report Inappropriate Content

    ‎10-28-2021 01:57 AM

    Hello, 

    Don't know why the sub menu cannot display.

    NaviL_0-1635411459969.png

     

    Message 5 of 6
    1,201 Views
    0 Kudos
    Reply
    RobotRising
    RobotRising
    Frequent Visitor
    In response to ihassig
    • Mark as New
    • Bookmark
    • Subscribe
    • Mute
    • Subscribe to RSS Feed
    • Permalink
    • Print
    • Report Inappropriate Content

    ‎07-15-2022 01:05 PM

    I haven't been able to get it to work with screen navigation but you could use forms/galleries on 1 screen and set the visible based on the hamburger selection i.e. If(HamburgerMenu_2.SelectedHamburgerMenuItemID = 1,true,false) would make it so that something like a gallery is visible if home is selected otherwise visible would be false. So for the App selection set that ID in the visible for the item you want to show. 

    Message 6 of 6
    649 Views
    0 Kudos
    Reply

    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