Tab Bar

Owned by Charles Evans
Jul 03, 2020
2 min read

Properties of Tab Bar

  1. Id - unique identifier of the control
  2. Selected Key - sets the default tab to be accessed. The value is from the Tab Item property "Key"
  3. Actions on Select - executes the javascript function assigned for this event
  4. Visible - set a boolean value or a variable with type boolean from the Model to control the visibility property

  5. Advanced - properties of the control not available in the above list can be added here. 

    Setting Additional Properties provides further information about the Advanced property

Tab Items are needed for the Tab Bar to function completely
Properties of Tab Item

  1. Id - unique identifier of the control
  2. Design - Specifies whether the icon and the texts are placed vertically or horizontally sap.m.IconTabFilterDesign
  3. Label - tab text
  4. Key - unique key of the tab
  5. Icon - icon to be displayed in the tab
  6. Icon Color - specifies the icon color
  7. Count Bound Field - Represents the "count" text, which is displayed in the tab filter
  8. Visible - set a boolean value or a variable with type boolean from the Model to control the visibility property

  9. Advanced - properties of the control not available in the above list can be added here. 

    Setting Additional Properties provides further information about the Advanced property

Step-by-step guide

How to add a Tab Bar

  1. Right click on a Page or from any elements under Add Layout and select Add Other-→ Add Tab Bar

  2. A Tab Bar Control has been added
  3. Right click on the Tab Bar and select Add Tab Item

    Right click on the created Tab Item and select the relevant controls
  4. Controls within the Tab Item have been created