RibbonTab Class
A ribbon tab.
#Declaration
export class RibbonTab
#Remarks
var options = DevExpress.RichEdit.createOptions();
var homeTab = options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home);
var ribbonItemUndo = homeTab.getItem(DevExpress.RichEdit.HomeTabItemId.Undo);
var ribbonItemRedo = homeTab.getItem(DevExpress.RichEdit.HomeTabItemId.Redo);
var ribbonTab = new DevExpress.RichEdit.RibbonTab;
ribbonTab.id = "myHistoryTab";
ribbonTab.title = "History";
ribbonTab.items =[ribbonItemUndo, ribbonItemRedo];
options.ribbon.clearTabs();
options.ribbon.insertTab(ribbonTab);
#constructor(title, id)
Initializes a new instance of the RibbonTab
class with specified settings.
#Declaration
constructor(
title: string,
id: RibbonTabId,
items?: FirstLevelRibbonItem[],
localizationId?: string
)
#Parameters
Name | Type | Description |
---|---|---|
title | string | The tab title. |
id | Ribbon |
The tab identifier. |
items | First |
An array of items. |
localization |
string | The tab’s localization identifier. |
#Properties
#contextTab Property
Identifies whether the tab is a context tab.
#Declaration
get contextTab(): boolean
#Property Value
Type | Description |
---|---|
boolean |
|
#id Property
Specifies the ribbon tab identifier.
#Declaration
id: RibbonTabId
#Property Value
Type | Description |
---|---|
Ribbon |
The tab identifier. |
#items Property
Provides access to the tab’s item collection.
#Declaration
items: FirstLevelRibbonItem[]
#Property Value
Type | Description |
---|---|
First |
An array of items. |
#localizationId Property
Specifies an identifier that allows you to localize the tab’s title.
#Declaration
localizationId?: string
#Property Value
Type | Description |
---|---|
string | The tab’s localization identifier. |
#Remarks
If the title property is specified, the tab is not localized.
#title Property
Specifies the tab title.
#Declaration
title: string
#Property Value
Type | Description |
---|---|
string | The tab title. |
#Methods
#forEachItem(callback) Method
Performs the specified action on each item in the tab.
#Declaration
forEachItem(
callback: (item: RibbonItem,
index: number,
parent: RibbonItemParent) => void,
recursive?: boolean
): void
#Parameters
Name | Type | Description |
---|---|---|
callback | (item: Ribbon |
The action to perform on each item of the collection. |
recursive | boolean | true - to iterate through items recursively; otherwise, false. |
#getItem(id) Method
Returns a ribbon item with the specified ID.
#Declaration
getItem(
id: RibbonItemId
): RibbonItem | null
#Parameters
Name | Type | Description |
---|---|---|
id | Ribbon |
The ribbon item identifier. |
#Returns
Type | Description |
---|---|
Ribbon |
The item with the specified ID. |
#Remarks
//move the Undo and Redo commands
var options = DevExpress.RichEdit.createOptions();
var homeTab = options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home);
var ribbonItemUndo = homeTab.getItem(DevExpress.RichEdit.HomeTabItemId.Undo);
var ribbonItemRedo = homeTab.getItem(DevExpress.RichEdit.HomeTabItemId.Redo);
ribbonItemUndo.beginGroup = true;
homeTab.removeItem(ribbonItemUndo);
homeTab.removeItem(ribbonItemRedo);
homeTab.insertItem(ribbonItemUndo,3);
homeTab.insertItem(ribbonItemRedo,4);
#insertItem(item) Method
Inserts an item at the specified position.
#Declaration
insertItem(
item: RibbonItem,
index?: number
): FirstLevelRibbonItem
#Parameters
Name | Type | Description |
---|---|---|
item | Ribbon |
A ribbon item to insert. |
index | number | The zero-based index at which the specified item should be inserted. |
#Returns
Type | Description |
---|---|
First |
The item that was inserted. |
#Remarks
var ribbonButton = new DevExpress.RichEdit.RibbonButtonItem("sendEmail", "Send Email",
{icon: "email", showText: true, beginGroup: true});
var options = DevExpress.RichEdit.createOptions();
options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home).insertItem(ribbonButton,2);
options.events.customCommandExecuted.addHandler(function(s, e) {
switch (e.commandName) {
case 'sendEmail':
var text = s.document.getText();
var mailto_link = 'mailto:bob@example.com?subject=Test&body=' + encodeURIComponent(text);
window = window.open(mailto_link, 'emailWindow');
if(window && window.open && !window.closed)
window.close();
break;
}
});
#insertItemAfter(item, target) Method
Inserts an item after the target item.
#Declaration
insertItemAfter(
item: RibbonItem,
target: RibbonItem | RibbonItemId | CommandId
): RibbonItem
#Parameters
Name | Type | Description |
---|---|---|
item | Ribbon |
A ribbon item to insert. |
target | Command |
The target item or its identifier. |
#Returns
Type | Description |
---|---|
Ribbon |
The item that was inserted. |
#Remarks
var ribbonButton = new DevExpress.RichEdit.RibbonButtonItem("sendEmail", "Send Email",
{icon: "email", showText: true, beginGroup: true});
var options = DevExpress.RichEdit.createOptions();
var homeTab = options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home);
homeTab.insertItemAfter(ribbonButton, DevExpress.RichEdit.HomeTabItemId.Paste);
options.events.customCommandExecuted.addHandler(function(s, e) {
switch (e.commandName) {
case 'sendEmail':
var text = s.document.getText();
var mailto_link = 'mailto:bob@example.com?subject=Test&body=' + encodeURIComponent(text);
window = window.open(mailto_link, 'emailWindow');
if(window && window.open && !window.closed)
window.close();
break;
}
});
If the tab does not contain the target item, the control inserts an item at the last position.
#insertItemBefore(item, target) Method
Inserts an item before the target item.
#Declaration
insertItemBefore(
item: RibbonItem,
target: RibbonItem | RibbonItemId | CommandId
): RibbonItem
#Parameters
Name | Type | Description |
---|---|---|
item | Ribbon |
A ribbon item to insert. |
target | Command |
The target item or its identifier. |
#Returns
Type | Description |
---|---|
Ribbon |
The item that was inserted. |
#Remarks
var ribbonButton = new DevExpress.RichEdit.RibbonButtonItem("sendEmail", "Send Email",
{icon: "email", showText: true, beginGroup: true});
var options = DevExpress.RichEdit.createOptions();
var homeTab = options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home);
homeTab.insertItemBefore(ribbonButton, DevExpress.RichEdit.HomeTabItemId.Cut);
options.events.customCommandExecuted.addHandler(function(s, e) {
switch (e.commandName) {
case 'sendEmail':
var text = s.document.getText();
var mailto_link = 'mailto:bob@example.com?subject=Test&body=' + encodeURIComponent(text);
window = window.open(mailto_link, 'emailWindow');
if(window && window.open && !window.closed)
window.close();
break;
}
});
If the tab does not contain the target item, the control inserts an item at the last position.
#removeItem(id) Method
Removes the item with the specified ID from the tab.
#Declaration
removeItem(
id: RibbonItemId
): void
#Parameters
Name | Type | Description |
---|---|---|
id | Ribbon |
The ribbon item identifier. |
#Remarks
var options = DevExpress.RichEdit.createOptions();
options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home).removeItem(
DevExpress.RichEdit.HomeTabItemId.IncreaseFontSize);
});
#removeItem(item) Method
Removes the specified item from the tab.
#Declaration
removeItem(
item: RibbonItem
): void
#Parameters
Name | Type | Description |
---|---|---|
item | Ribbon |
The item to remove. |