Speed Dial for Power Apps

A speed dial is a round floating button in the corner of a screen that opens a short stack of action buttons when tapped; the plus sign turns into an X while it is open. Reach for one when a screen has a few actions users take often, such as add, edit or share, and you want them out of the way until needed. Every PowerLibs speed dial is a paid component, so copying one needs a Components, Ultra, Team or Lifetime plan, and they generate Classic control YAML only.

Pick a variant

Component	Plan	What it is for	Settings you can change
Animated Speed Dial	Paid	Round action buttons, labels off by default	Show Labels, Action Items (Add Item, Item 1 Icon, Item 1 Label)
Square Speed Dial	Paid	The same dial with square buttons and a 10px corner radius	Show Labels, Action Items (Add Item, Item 1 Icon, Item 1 Label)
Labeled Speed Dial	Paid	The same dial with a text label to the left of each action	Show Labels, Action Items (Add Item, Item 1 Icon, Item 1 Label)
Horizontal Speed Dial	Paid	The actions fan out to the left of the button instead of above it, for wide screens where the space above is taken. Each action has a tooltip. Light and dark.	See the Settings tab
Floating Action Button	Free	One action in the bottom-right corner: round with an icon, or extended with the icon and a text such as New request. Optional red badge with a count. No menu, no state. Light and dark.	See the Settings tab

Paid means a Components, Ultra, Team or Lifetime plan (pricing). Open the category in the library: Speed Dial.

To copy a variant into Power Apps Studio, follow Getting Started.

The variants differ only in their defaults: Show Labels is off on Animated and Square and on for Labeled, and the corner radius is 30 on Animated and Labeled and 10 on Square. The Item 1 Icon dropdown lists Power Apps icon names such as Home, Lock, Settings and Person; the Item 1 Label box only appears while Show Labels is on.

After you paste

The YAML creates a container conSpeedDial holding a gallery galItems (one row per action) and a main button conMainButton. Two global variables drive it: gblIsExpanded, which galItems reads in its Visible property, and gblThemeTimestamp, which forces the plus icon to redraw its rotation. Both names are fixed and do not follow your prefix settings. The main button's btnMainAction already toggles gblIsExpanded, and the transparent button on every action row, btnItemAction, closes the dial first, so you never write a toggle yourself.

Add your actions in the OnSelect of btnItemAction, after the two Set() lines the YAML puts there. Each row carries id (1, 2, 3 and so on), icon and, when Show Labels is on, labelText:

Set(gblIsExpanded, false);
Set(gblThemeTimestamp, Text(Now(), "yyyymmddhhmmss"));
Switch(ThisItem.id,
  1, Navigate(HomeScreen),
  3, Navigate(SettingsScreen)
)

The container is pasted at a fixed X of 1086 and Y of 343. To pin it to the bottom-right corner on any screen size, put this in the X of conSpeedDial and the same pattern with Height in its Y:

Parent.Width - Self.Width - 20

gblIsExpanded is a global variable, so a dial left open is still open when the user returns to the screen. Put this in the screen's OnVisible so it starts closed:

Set(gblIsExpanded, false)

Good to know

Colour, size and corner radius are not settings. The Fill of conMainButton is RGBA(59, 130, 246, 1) from the component's own default, not your brand colour; the buttons are 60px; the radius is 30 (10 on Square). Change them on conMainButton, conItem and btnItemAction in Studio.
The Items table is built from the Item 1 Icon dropdown. It reads Table({ id: 1, icon: Icon.Home }, ...), so an icon name the generator does not know falls back to Icon.Home. With Show Labels on, conSpeedDial grows from 108px to 280px wide and each row gets a label control, lblItemLabel, showing ThisItem.labelText.
Keep it in front. Nothing in the YAML forces the dial above other controls. In the Tree view, keep conSpeedDial in front of the containers it overlaps or the action rows open underneath them.
Classic only, light and dark. There is no Modern control option for speed dials. The theme toggle in the component header switches the row fill, icon and label colours between the light and dark sets.
Unlocking the Settings tab. Any paid plan copies a speed dial, but editing the Settings tab needs Ultra, Team or Lifetime; below that the editor is read-only with an Unlock prompt.

Open the category in the library: Speed Dial. Related guides: Buttons and Modals.