Action Bar

This compound component is used to layout other components. It usually contains hyperlinks, buttons, and separators and arranges them to look and behave like a menu or navigation bar. It can also contain other action bar components, in which case it creates nested structures with collapsible/expandable sub menus.

 

Properties and All Attributes views

The Properties view for a component shows the most common set of attributes you can set on a component, and, depending on the component, you might also see options for adding controls, actions, or other components. To open the Properties view, click

Window | Show View | Properties.

These common attributes for the Panel - Action Bar component display on the hx:panelActionbar tab in the Properties view. See the All Panel - Action Bar attributes table for a complete list of attributes. Additional configuration options for panel items are on the hx:panelActionbar>Items tab:

Table 1. Panel - Action Bar configuration options

Configuration option

Description

Add items to the control

Allows you to view the items in the menu bar, as well as add hyperlinks, command buttons, sub-panels, and separators. You may also remove items using the Remove button and change their order in the panel using the Move Up and Move Down buttons.

The All Attributes view shows a table of all the attributes you can set on a component, which includes those attributes you can access from the Properties view. To switch to the All Attributes view, click the

All Attributes icon in the upper right corner of the Properties view.

Table 2. All Panel - Action Bar attributes

Attribute name

Represented in Properties view by

Description

autoseparate

Show separator between each item

Checking this box specifies that separator lines appear between items in the action bar. If autoseparate is set to true, a separator item is automatically inserted between each contained components when rendered. If it is left blank, the default is false and no separator is inserted.

binding

Not represented

An expression that binds the component's instance (usually a user interface component) to a bean property (usually in the backing file).

dir

Not represented

Specifies the component's direction when rendered at runtime. The values can be either:

  • ltr - left to right

  • rtl - right to left
If the direction is not specified, a direction appropriate to the encoding of the component is used.

height

Size: Height

Specifies the height of the component (by number of lines, pixels or percentage of the screen).

id

ID

Assigns a name to a component. Should be a unique name within a JSP.

layout

Panel Orientation

Specifies the layout as horizontal or vertical:

  • line_direction = Horizontal

  • page_direction = Vertical

nestedExpanded

Initially show panel expanded

Expand or collapse the child panelActionbar. It is applied only if one panelActionbar is nested inside another.

nestedImagePosition

Image Position

Places the image before or after the label of the child panelActionbar. It is applied only if one panelActionbar is nested inside another.

nestedIndent

Not represented

Amount by which the submenu of the child panelActionbar will be indented. It is applied only if one panelActionbar is nested inside another.

nestedTitleImage

Image

Specifies an image to go before or after the label. The button to the right of the field allows you to browse for or import the image.

nestedTitleText

Label

Label of child panelActionbar. It is applied only if one panelActionbar is nested inside another.

rendered

Not represented

Can be set to true or false:

  • false - Component will not be rendered to the browser at runtime.

  • true - Component will get rendered. This is the default value.

styleClass

Style: Classes

Space-separated list of CSS style classes to be applied when this element is rendered. This value must be passed through as the class attribute on generated markup. Defines the classes (such as style sheets) of the selected component. This may be done manually, or by clicking the button and selecting the desired Classes from within the window.

style

Style: Props

Specifies CSS style information for the component (for example, style="font-size : 8pt ; color : red"). Defines the properties (such as font and color) of the selected component. This may be done manually, or by clicking the button and selecting the desired properties from within the window.

width

Size: Width

Specifies the initial width of the component. The width is given in pixels except in the case of a text input component where its value refers to the number of characters.