Flyout Menu Component (Left/Right) 06-20-2021 22:19 PM

[Edwin-Abdalian]

I've created a flyout menu which is very easy to configure and reuse in your apps.

Just 3 steps:

1. Create a button to show/hide the menu and set the OnSelect property of it to UpdateContext({locShowMenu: !locShowMenu)
2. Insert the Component and set these custom properties:

**Data Source = collection or a table

Table(
    {
        Title: "Home",
        MenuIcon: Home,
        Screen: Screen1
    },
    {
        Title: "Appointments",
        MenuIcon: AddToCalendar,
        Screen: Screen2
    })

**Show Menu = locShowMenu

**Left Side Flyout = true (if you would like the menu to fly in/out from left. else set it to false to make it a right side flying menu

1. Set the Visible property of the component to “Name of the Component”.ComponentVisibility. for example ‘Flyout Menu_1’.Component Visibility

[anurag_vaishnav]

Hi

Thanks for this Component, very useful, however I have one error which I cant seems to fix. All my icons are showing "Waffle Icon" as shown in attached screen. I am using table (screen2). Title and Screens seems to be working fine.

Anurag

[Mike_KaiserPerm]

This flyout menu started acting very weird lately.  I have it working in 1 apps, was working in a 2nd but all of sudden it stoped displaying the menu items.   I completely removed it and replaced it and setup the datasource and the items returned.   Then I updated app and it is not showing the menu items anymore.   Does anyone else have this problem and what did you do to fix it?

[Spata]

Hi,

I was wondering that is there way to so make this component visible by clicking another component (not using updatecontext). My goal is to make component that includes that icon-button that now brings flyoutmenu visible. Thanks!

[johanarrenas5]

Hola buen dia, soy nuevo con power apps me gusto bastante su aplicacion. tengo una duda al darle click en el boton para que abra el menu. como hago que al abrir el menu el fondo este en gris como se vizualiza en el gif