Context menus

Use a context menu to provide quick access to important actions within your application. The toolkit includes convergent menu components that can be applied across all devices to provide a shortcut to the most relevant actions within your app. A context menu can contain shortcuts to primary actions or commands that are relevant to the user’s current context.

Staged

A contextual menu reveals relevant commands using long-press, such as saving an image in a web browser. Touch and pointer interactions perform the same functions for familiarity and consistency across convergent devices. On a touch screen, a context menu is revealed by long tapping or swiping the list item from left to right. Swiping right may reveal a button for the leading action, such as ‘Delete’ or similar. Swiping left may reveal buttons for up to three other important actions, which are the trailing actions. When a pointer device is attached, right-clicking an item will reveal the context menu, and click and drag will reveal the leading and trailing actions either side of the item – giving the same experience as swiping.

Context menu

For medium to large screens, long-press (touch) and right click (pointer) can be used to reveal a context menu. For instance, if you have a touch screen desktop monitor, you can long press a list item to reveal a context menu, or if you have a mouse connected then you can right click.

More details

Back to Top