ribbon-bigbuttondropbdown
The ribbon-bigbuttondropdown is a configurable UI element that displays a dropdown menu, a large 32x32 pixel icon and a label.
Description
You can add different types of buttons, and button groups using the overlay element in the configuration. The ribbon-bigbuttondropdown element is one of five different type of buttons you may wish to configure for your UI. This drop down button is a bit more complex than a simple button since you are also displaying a drop down menu.
Namespace
http://xopus.com/2009/lui
Attributes
| Name | Description | Type |
|---|---|---|
after | Optional. The ID of the user interface component where the button is positioned after in the toolbar. If neither | string |
before | Optional. The ID of the user interface component where the button is positioned before in the toolbar. If neither | string |
command | Optional. The name of the command this button is coupled with. See | string |
role | Optional. The | |
iconsrc | Optional. URL for the icon on this button. Relative URI's are resolved from the location of the configuration file. | valid url |
overflow-iconsrc | Optional. URL for the icon on this button when shown in the overflow toolbar. Relative URI's are resolved from the location of the configuration file. overflow icons can only be 16x16 pixels. | valid url |
iconoffsetx | Optional. When icons are sprited images, then the x-coordinate value can be defined with this attribute. | |
overflow-iconoffsetx | Optional When overflow icons are sprited images, then the x-coordinate value can be defined with this attribute. | |
iconoffsety | Optional. When icons are sprited images, then the y-coordinate value can be defined with this attribute. | |
overflow-iconoffsety | When overflow icons are sprited images, then the y-coordinate value can be defined with this attribute. | |
id | Optional. The ID for this button component. | string |
available | Optional. When | boolean |
label | Optional. The alt/title text of the button when the user mouseovers the button. | string |
mode | Optional This attribute describes behavior for pressing the button. When set to When set to | string |
Examples
You can find the complete set of examples for configuring the ribbon-toolbar in the topic for the overlay element.
You can create a dropdown button by using ribbon-normalbuttondropdown or ribbon-bigbuttondropdown in the overlay element.
Add an overlay in the configuration file (dita-config-custom.xml).
<x:overlay xmlns="http://xopus.com/2009/lui">
<ribbon-bigbuttondropdown after="CancelEditingButton" label="Commands" iconsrc="/image/icon-32x32.png">
<menu>
<menu-group>
<menu-item id="button2" role="strong" label="Very Strong Button" />
</menu-group>
</menu>
</ribbon-bigbuttondropdown>
</x:overlay>
Parent Element
overlay