Skip to main content

Ribbon Class

Contains ribbon settings.

Declaration

export class Ribbon
See Also

Properties

activeTabIndex Property

Specifies the active tab by its index.

Declaration

activeTabIndex: number

Property Value

Type Description
number

A zero-based tab index.

Remarks

var options = DevExpress.RichEdit.createOptions();
options.ribbon.activeTabIndex=3;

visible Property

Sets ribbon visibility.

Declaration

visible: boolean

Property Value

Type Description
boolean

true - to display the ribbon; false - to hide the ribbon.

Remarks

richEdit.updateRibbon(function (ribbon) {
  ribbon.visible=false;
});

Methods

clearTabs Method

Removes all ribbon tabs.

Declaration

clearTabs(): void

Remarks

var options = DevExpress.RichEdit.createOptions();
var homeTab = options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home)
options.ribbon.clearTabs();
options.ribbon.insertTab(homeTab);
});

getTab(id) Method

Returns a ribbon tab with the specified ID.

Declaration

getTab(
    id: RibbonTabId
): RibbonTab | null

Parameters

Name Type Description
id RibbonTabId

The ribbon tab identifier.

Returns

Type Description
RibbonTab

The tab with the specified ID. null if a tab with the specified ID is not found.

Remarks

//move the Home tab to the third position
var options = DevExpress.RichEdit.createOptions();
var homeTab = options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home)
options.ribbon.insertTab(options.ribbon.removeTab(homeTab), 2)
});

insertTab(tab) Method

Inserts a tab at the specified position.

Declaration

insertTab(
    tab: RibbonTab,
    index?: number
): RibbonTab

Parameters

Name Type Description
tab RibbonTab

A ribbon tab to insert.

index number

The zero-based index at which the specified tab should be inserted.

Returns

Type Description
RibbonTab

The inserted tab.

Remarks

//move the Home tab to the third position
var options = DevExpress.RichEdit.createOptions();
options.ribbon.insertTab(options.ribbon.removeTab(DevExpress.RichEdit.RibbonTabType.Home),2);

insertTabAfter(tab, target) Method

Inserts a tab after the target tab.

Declaration

insertTabAfter(
    tab: RibbonTab,
    target: RibbonTab | RibbonTabId
): RibbonTab

Parameters

Name Type Description
tab RibbonTab

A ribbon tab to insert.

target RibbonTab | RibbonTabId

The target tab or its identifier.

Returns

Type Description
RibbonTab

The tab that was inserted.

Remarks

var options = DevExpress.RichEdit.createOptions();
var mailMergeTab = options.ribbon.removeTab(DevExpress.RichEdit.RibbonTabType.MailMerge);
options.ribbon.insertTabAfter(mailMergeTab, DevExpress.RichEdit.RibbonTabType.Home);

If the ribbon does not contain the target tab, the control inserts a tab at the last position.

insertTabBefore(tab, target) Method

Inserts a tab before the target tab.

Declaration

insertTabBefore(
    tab: RibbonTab,
    target: RibbonTab | RibbonTabId
): RibbonTab

Parameters

Name Type Description
tab RibbonTab

A ribbon tab to insert.

target RibbonTab | RibbonTabId

The target tab or its identifier.

Returns

Type Description
RibbonTab

The tab that was inserted.

Remarks

var options = DevExpress.RichEdit.createOptions();
var mailMergeTab = options.ribbon.removeTab(DevExpress.RichEdit.RibbonTabType.MailMerge);
options.ribbon.insertTabBefore(mailMergeTab, DevExpress.RichEdit.RibbonTabType.Home);

If the ribbon does not contain the target tab, the control inserts a tab at the last position.

removeTab(id) Method

Removes the tab with the specified ID from the ribbon.

Declaration

removeTab(
    id: RibbonTabId
): RibbonTab | null

Parameters

Name Type Description
id RibbonTabId

The ribbon tab identifier.

Returns

Type Description
RibbonTab

The tab that was removed. null if a tab with the specified ID is not found.

Remarks

The code sample below moves the Home tab to the first position in the ribbon.

//move the Home tab to the third position
var options = DevExpress.RichEdit.createOptions();
options.ribbon.insertTab(options.ribbon.removeTab(DevExpress.RichEdit.RibbonTabType.Home),2);

removeTab(tab) Method

Removes the specified tab from the ribbon.

Declaration

removeTab(
    tab: RibbonTab
): RibbonTab | null

Parameters

Name Type Description
tab RibbonTab

The tab to remove.

Returns

Type Description
RibbonTab

The tab that was removed. null if a tab with the specified ID is not found.

Remarks

The code sample below moves the Home tab to the first position in the ribbon.

//move the Home tab to the third position
var options = DevExpress.RichEdit.createOptions();
var homeTab = options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home)
options.ribbon.insertTab(options.ribbon.removeTab(homeTab), 2)
});