Pop-up buttons
A pop-up button displays a menu of mutually exclusive options.
After people choose an item from a pop-up button’s menu, the menu closes, and the button can update its content to indicate the current selection.
Best practices
Use a pop-up button to present a flat list of mutually exclusive options or states. A pop-up button helps people make a choice that affects their content or the surrounding view. Use a pull-down button instead if you need to:
- Offer a list of actions
- Let people select multiple items
- Include a submenu
Provide a useful default selection. A pop-up button can update its content to identify the current selection, but if people haven’t made a selection yet, it shows the default item you specify. When possible, make the default selection an item that most people are likely to want.
Give people a way to predict a pop-up button’s options without opening it. For example, you can use an introductory label or a button label that describes the button’s effect, giving context to the options.
Consider using a pop-up button when space is limited and you don’t need to display all options all the time. Pop-up buttons are a space-efficient way to present a wide array of choices.
Platform considerations
No additional considerations for iOS or iPadOS. Not supported in tvOS or watchOS.
macOS
If you need to present customization options, put them below a separator at the bottom of the pop-up button’s menu. For example, in the Print view, the Printer pop-up button’s menu includes options for adding a printer and configuring printer settings. If people can add a new item to the menu, display the new item as the current selection.
