Interface: IActionBarProxy¶

A designer-facing interface that provides access to a actionbar control.

It is passed to rules to provide access to a actionbar control for application specific customizations.

In addition it provides access to the IControlProxy interface.

example

// ActionBar management example
export default function ActionBarExample(context) {
  const pageProxy = context.getPageProxy();
  const actionBarProxy = pageProxy.getActionBar();

  // Set basic properties
  actionBarProxy.setCaption('My App');
  actionBarProxy.setSubhead('Dashboard');
  actionBarProxy.setPrefersLargeCaption(true);

  // Set styles for different parts
  actionBarProxy.setStyle('custom-actionbar-style', 'ActionBar');
  actionBarProxy.setStyle('custom-caption-style', 'Caption');
  actionBarProxy.setStyle('custom-subhead-style', 'Subhead');

  // Get and modify actionbar items
  const saveButton = actionBarProxy.getItem('SaveButton');
  if (saveButton) {
    saveButton.setCaption('Update');
    saveButton.setEnabled(true);
    saveButton.setVisible(true);
  }

  // No explicit redraw() needed - all setter methods automatically redraw
}

Hierarchy¶

IControlProxy
IActionBarProxy

Implemented by¶

ActionBarProxy

Summary¶

Properties¶

Class Properties¶

Currently none in this class.

Inherited Properties¶

Methods¶

Class Methods¶

Inherited Methods¶

Methods¶

getCaption¶

▸ getCaption(): string

Overrides IControlProxy.getCaption

Returns the Caption property value defined for the actionbar control.

example

// Get the current Caption of the actionbar
const actionBarProxy = pageProxy.getActionBar();
const currentCaption = actionBarProxy.getCaption();
console.log('Current caption:', currentCaption);

Returns: string

getCaptionAlignment¶

▸ getCaptionAlignment(): string

Returns the CaptionAlignment property value defined for the actionbar control. Note: CaptionAlignment is only visually applied on Android, but this method returns the value on all platforms.

example

// Get current caption alignment (returns value on all platforms,
// but the property itself will only works on Android)
const actionBarProxy = pageProxy.getActionBar();
const alignment = actionBarProxy.getCaptionAlignment();
console.log('Caption alignment:', alignment);

Returns: string

getDataSubscriptions¶

▸ getDataSubscriptions(): string[]

Returns the DataSubscriptions property value defined for the actionbar control.

example

// Get current data subscriptions
const actionBarProxy = pageProxy.getActionBar();
const subscriptions = actionBarProxy.getDataSubscriptions();
console.log('Data subscriptions:', subscriptions);

Returns: string[]

getItem¶

▸ getItem(itemName: string): IActionBarItemProxy

example

// Get a specific actionbar item by name
const actionBarProxy = pageProxy.getActionBar();
const saveButton = actionBarProxy.getItem('SaveButton');
if (saveButton) {
  saveButton.setCaption('Update');
}

Parameters:

Name	Type	Description
`itemName`	string	takes in _Name property of the actionbar item

Returns: IActionBarItemProxy

returns the ActionBarItemProxy instance of the item by the name

getItems¶

▸ getItems(): IActionBarItemProxy[]

This method returns the top-level controls of actionbar items for this container

example

// Get all actionbar items
const actionBarProxy = pageProxy.getActionBar();
const items = actionBarProxy.getItems();

// Iterate through all items
items.forEach(item => {
  console.log('Item name:', item.getName());
});

Returns: IActionBarItemProxy[]

The actionbar items controls for this container

getLogo¶

▸ getLogo(): string

Returns the Logo property value defined for the actionbar control.

example

// Get current logo
const actionBarProxy = pageProxy.getActionBar();
const currentLogo = actionBarProxy.getLogo();
console.log('Current logo:', currentLogo);

Returns: string

getOverflowIcon¶

▸ getOverflowIcon(): string

Returns the OverflowIcon property value defined for the actionbar control. Note: OverflowIcon is only visually displayed on iOS, but this method returns the value on all platforms.

example

// Get current overflow icon (returns value on all platforms,
// but the property itself will only works on iOS)
const actionBarProxy = pageProxy.getActionBar();
const overflowIcon = actionBarProxy.getOverflowIcon();
console.log('Overflow icon:', overflowIcon);

Returns: string

getPrefersLargeCaption¶

▸ getPrefersLargeCaption(): boolean

Returns the PrefersLargeCaption property value defined for the actionbar control.

example

// Check if large caption is preferred
const actionBarProxy = pageProxy.getActionBar();
const prefersLarge = actionBarProxy.getPrefersLargeCaption();
console.log('Prefers large caption:', prefersLarge);

Returns: boolean

getStyle¶

▸ getStyle(): any

Returns the Style property value defined for the actionbar control.

example

// Get current Style applied to the actionbar
const actionBarProxy = pageProxy.getActionBar();
const currentStyle = actionBarProxy.getStyle();

// Check specific Style
const captionStyle = currentStyle?.Caption;
const actionBarStyle = currentStyle?.ActionBar;

Returns: any

getSubhead¶

▸ getSubhead(): string

Returns the Subhead property value defined for the actionbar control.

example

// Get the current Subhead of the actionbar
const actionBarProxy = pageProxy.getActionBar();
const currentSubhead = actionBarProxy.getSubhead();
console.log('Current subhead:', currentSubhead);

Returns: string

isContainer¶

▸ isContainer(): boolean

Overrides IControlProxy.isContainer

Determine if the actionbar control is a container.

example

// Check if actionbar is a container
const actionBarProxy = pageProxy.getActionBar();
const isContainer = actionBarProxy.isContainer();
console.log('Is container:', isContainer); // Always returns true

Returns: boolean

true/false.

reset¶

▸ reset(): Promise‹any›

Reset actionbar and its items. The actionbar is then redrawn to reflect the reset state.

example

// Reset actionbar to original metadata state
const actionBarProxy = pageProxy.getActionBar();
actionBarProxy.reset().then(() => {
  console.log('Action bar reset');
  // The actionbar now has:
  // - Caption/subhead reverted to metadata values
  // - Logo/overflow icon reverted to metadata settings
  // - Custom styles cleared, reverted to metadata styles
  // - All actionbar items reset to metadata-defined state
});

Returns: Promise‹any›

setCaption¶

▸ setCaption(caption: string): void

Sets the Caption property of the actionbar control.

example

// Set a new Caption for the actionbar
const actionBarProxy = pageProxy.getActionBar();
actionBarProxy.setCaption('New Caption');

Parameters:

Name	Type	Description
`caption`	string	value to set.

Returns: void

setCaptionAlignment¶

▸ setCaptionAlignment(captionAlignment: string): void

Sets the CaptionAlignment property of the actionbar control. Accepted values are: "Left", "Center". Note: CaptionAlignment is only visually applied on Android, but this method sets the value on all platforms.

example

// Set caption alignment (sets value on all platforms, displays on Android only)
const actionBarProxy = pageProxy.getActionBar();
actionBarProxy.setCaptionAlignment('Center');

Parameters:

Name	Type	Description
`captionAlignment`	string	value to set.

Returns: void

setDataSubscriptions¶

▸ setDataSubscriptions(dataSubscriptions: string[]): void

Sets the DataSubscriptions property of the actionbar control.

example

// Set data subscriptions for the action bar
const actionBarProxy = pageProxy.getActionBar();
actionBarProxy.setDataSubscriptions(['MyService', 'NotificationService']);

Parameters:

Name	Type	Description
`dataSubscriptions`	string[]	value to set.

Returns: void

setLogo¶

▸ setLogo(logo: string): void

Sets the Logo property value of the actionbar control.

example

// Set logo for the actionbar
const actionBarProxy = pageProxy.getActionBar();
actionBarProxy.setLogo('sap-icon://home');

// Clear the logo
actionBarProxy.setLogo('');

Parameters:

Name	Type	Description
`logo`	string	value to set.

Returns: void

setOverflowIcon¶

▸ setOverflowIcon(overflowIcon: string): void

Sets the OverflowIcon property of the actionbar control. Note: OverflowIcon is only visually displayed on iOS, but this method sets the value on all platforms.

example

// Set overflow icon (sets value on all platforms, displays on iOS only)
const actionBarProxy = pageProxy.getActionBar();
actionBarProxy.setOverflowIcon('sap-icon://collision');

Parameters:

Name	Type	Description
`overflowIcon`	string	value to set.

Returns: void

setPrefersLargeCaption¶

▸ setPrefersLargeCaption(prefersLargeCaption: boolean): void

Sets the PrefersLargeCaption property of the actionbar control.

example

// Enable large caption for the actionbar
const actionBarProxy = pageProxy.getActionBar();
actionBarProxy.setPrefersLargeCaption(true);

Parameters:

Name	Type	Description
`prefersLargeCaption`	boolean	value to set.

Returns: void

setSubhead¶

▸ setSubhead(subhead: string): void

Sets the Subhead property of the actionbar control.

example

// Set a new Subhead for the actionbar
// Note: PrefersLargeCaption will be ignored when Subhead is present
const actionBarProxy = pageProxy.getActionBar();
actionBarProxy.setSubhead('New Subhead');

Parameters:

Name	Type	Description
`subhead`	string	value to set.

Returns: void