Tab right-click menu

Description

Allows you to customize the menu shown when a user right-clicks a tab in the Tabbed UI.

Discussion

The context menu shown when a user right-clicks a tab in the Tabbed UI can be customized. You can change the options shown, customize the HTML displayed for the menu options, integrate language tags for multi-language support, or turn off the menu with the Tab right-click menu property.

Tab right-click menu property
Tab right-click menu property

Clicking the smart field button for Tab right-click menu opens the Customize Tab Right-click menu dialog. Here you can customize the menu options for the context menu or turn the menu off.

Customize Tab Right-click menu dialog
Customize Tab Right-click menu dialog

Default Context Menu

The menu definition below is the default menu generated for the tab right-click menu:

Default right-click menu
{html: 'Close',value: 1}
{html: 'Close other tabs',value: 2}
{html: 'Close tabs to the right',value: 3}
{html: 'Close all tabs', value: 4}

You can insert the default menu using the Insert default menu link at the bottom of the Customize Tab Right-click menu dialog.

Customizing Menu HTML and Adding Language Support

The HTML for menu options can be customized with the html setting. Your HTML can include images. For example:

Right-click menu with images
{html: '<img src="svgIcon=#alpha-icon-doc:24{ fill: #268bd2; stroke: #073642;}" > Close',value: 1}
{html: '<img src="svgIcon=#alpha-icon-docRename:24{ fill: #268bd2; stroke: #073642;}" > Close other tabs',value: 2}
{html: '<img src="svgIcon=#alpha-icon-docIn:24{ fill: #268bd2; stroke: #073642;}" > Close tabs to the right',value: 3}
{html: '<img src="svgIcon=#alpha-icon-docX:24{ fill: #268bd2; stroke: #073642;}" > Close all tabs', value: 4}
Tab right-click menu with icons
Tab right-click menu with icons

html also supports using language tags to add support for rendering your application in other languages. Both Language definition and Text dictionary tags are supported.

Right-click menu customized with Text dictionary tags
{html: '<a5:t>Close</a5:t>',value: 1}
{html: '<a5:t>Close other tabs</a5:t>',value: 2}
{html: '<a5:t>Close tabs to the right</a5:t>',value: 3}
{html: '<a5:t>Close all tabs</a5:t>', value: 4}

Limiting Choices

You can restrict the number of options by omitting them from the list of choices. For example, if you only want to permit closing the current tab, your Tab right-click menu definition would only include one entry for Close:

Right-click menu configured to only have the Close option.
{html: 'Close',value: 1}

Disabling the Menu

If you want to disable the Tab right-click menu altogether, enter nomenu in the Customize Tab Right-click menu dialog.

Disabling the right-click menu
nomenu

nomenu turns off the right-click menu.

Custom Menu Options

The Tab right-click menu does not support adding custom choices. Adding other options with values that are not 1 through 4 have the same behavior as the Close all tabs (value 4) option.