The OUTLOOKBAR component is a vertical arrangement of button items around some content.
The component may reference to an integer value (attribute VALUE) on server side which represents the currently selected item.
Typically used attributes
All attributes are
General attributes are
Used inside: ADAPTIVETILECONTAINER, ADAPTIVETOOLBAR, AREASELECTOR, BLOCKABLEAREA, COLSYNCHEDROW, DRAWAREA, FOLDABLEPANEHEADERROW, GRIDCOL, GRIDFOOTER, GRIDHEADER, GRIDHEADERLABEL, GRIDLAYOUTROW, LABELCONTAINER, OVERLAYAREABASEITEM, OVERLAYAREAITEM, PAGEBEANROOT, PAINTAREAITEM, REPEAT, ROW, ROWADAPTIVELINE, ROWFLEXCOLUMNCONTAINER, ROWFLEXLINECONTAINER, ROWFOOTER, ROWHEADER, ROWTITLEBAR, SCHEDULEITEM, SPANGRIDCOL, STABLEAREA, TEXTWITHCONTROLS, TREENODE
Using inside: DYNAMICCONTENT, OUTLOOKBARCONTENT, OUTLOOKBARITEM, REPEAT
Binding to server side method that processes the events coming from this component.
#{methodBinding} | Method binding |
If set to true then changes of the width/height of the component are animated.
true | With animation |
false | Without animation (default) |
Animation type
hidetotop | Hide to top |
hidetobottom | Hide to bottom |
hidetoleft | Hide to left |
hidetoright | Hide to right |
shrinktocenter | Shrink to center |
hidecontenttotop | Hide content to top |
hidecontenttobottom | Hide content to bottom |
hidecontenttoleft | Hide content to left |
hidecontenttoright | Hide content to right |
shrinkcontenttocenter | Shrink content to center |
foglight | Light fog that disappears |
fogdark | Dark fog that disappears |
fogred | Red fog that disappears - used for indicating some error |
shake | Shake the content so that it optically vibrates - used for indicating some activity |
noanimation | ...finally: no animation at all |
Name of macro that is used for generating certain attributes of this component. Please pay attention: the value of this attribute is read one time for each control and cannot be changed afterwards.
Name that is assigned to the component at client side: there is no specific function associated with the name - but it can be used on client side to describe the component in a clearer way. The name is e.g. used by UI test tools that replay certain user interaction sequences - and that reference components via their name.
In case the space provided by the container (e.g. gridlayoutcontainer) for the component is wider than the component itself: definition where to place the component
left | Left (default) |
center | Center |
right | Right |
Spanning of columns if used inside a COLSYNCHEDROW or inside a GRIDLAYOUTPANE.
1 | Control spans one column (default) |
2 | 2 columns |
3 | 3 columns |
Comment that can be asigned to any component. The comment is not operationally used.
Any text | Any text |
Configuration information that is attached to this component. This information is not functionally used by CaptainCasa, but may be used for any application specific purpose.
Semicolon separated list of font attributes. Valid attributes are: faces (font family), size (integer number), weight (bold), posture (italic)
family:Arial | family:Arial |
family:Courier | family:Courier |
size:12 | size:12 |
weight:bold | weight:bold |
size:12;weight:bold | size:12;weight:bold |
size:12;posture:italic | size:12;posture:italic |
Font that is used for the selected component.
family:Arial | family:Arial |
family:Courier | family:Courier |
size:12 | size:12 |
weight:bold | weight:bold |
size:12;weight:bold | size:12;weight:bold |
size:12;posture:italic | size:12;posture:italic |
Foreground color of unselected tabs.
#FFFFFF | White |
#000000 | Black |
#FF0000 | Red |
#00FF00 | Green |
#0000FF | Blue |
#0000FF30 | Blue with a transparency of x30. |
Foreground color of selected tabs.
#FFFFFF | White |
#000000 | Black |
#FF0000 | Red |
#00FF00 | Green |
#0000FF | Blue |
#0000FF30 | Blue with a transparency of x30. |
Height of the control. Either defined as absolute value or as percentage value. Pay attention when using percentage sizing: the size refers to what is given from the components above. When using percentage sizing then you may define a minimum size in addition, by appending it with a semicolon: "100%;100" means: use 100%, but always keep a minimum size of 100. If using absolute sizes you may append a "+" to define, that the size is extended if required by the component. - Please note: the sizing may be completely taken over by the parent component (e.g. if a component is used in a grid cell), in this case the size definintions on this component level are obsolete.
100 | 100 Pixels |
120 | 120 Pixels |
200 | 200 Pixels |
50% | 50 percents |
100% | Full available height |
Reference to an outside object that is the content behind the component. E.g. a field is representing a certain field of a database table: in this case you could define the value table;column. The reference plays a siginficant role within the attributemacro management.
ref | One reference |
ref1;ref2 | Two references |
ref1;ref2;ref3 | Three references |
Flag that indicated if this component is rendered at all. If set to false then the component is not rendered - there is no component data sent to the client.
true | Component is rendered (default) |
false | Component is not rendered |
Decides what happens when the user clicks a line which is already selected. By default no further selection event is sent to the server side processing. You can override by specifying true.
true | Reselection is enabled |
false | No reselection (default) |
Rounding radius of edges of border/background. This is optical rounding - so has nothing to do with mathematical rounding...
0 | Straight edges |
5 | Rounding with radius 5 |
10 | Rounding with radius 10 |
If more than one component is arranged within one row, then components need to decide how they want to be aligned vertically inside the row - in case the height of the row exceeds the height of the component itself.
top | Top |
center | Center (default) |
bottom | Bottom |
Spanning of rows if used inside a GRIDLAYOUTPANE.
1 | Control spans one row (default) |
2 | 2 rows |
3 | 3 rows |
Shadow of component. The definition is done by several inner values: hoffset, voffset, blur and color.
hoffset:5;voffset:5;blur:5;color:#C0C0C0 | full shadow definition |
color:#C0C0C0 | Definition only via color, rest of values is set to default values |
Style class names that are applied to this component.
In CaptainCasa you can define styles definitions for components. A style definition is a definition of a set of default attribute values that are applied to the component. In case you want to differenciate between different usage types of the component you can apply multiple styles - and use the stylevariant attribute to select between.
Data value that is shown and (dependent from the component type) edited inside the component.
Width of the control. Either defined as absolute value or as percentage value. Pay attention when using percentage sizing: the size refers to what is given from the components above. When using percentage sizing then you may define a minimum size in addition, by appending it with a semicolon: "100%;100" means: use 100%, but always keep a minimum size of 100. If using absolute sizes you may append a "+" to define, that the size is extended if required by the component. - Please note: the sizing may be completely taken over by the parent component (e.g. if a component is used in a grid cell), in this case the size definintions on this component level are obsolete.
100 | 100 Pixels |
120 | 120 Pixels |
200 | 200 Pixels |
50% | 50 percents |
100% | Full available width |
x-pixel-position: this attribute is only used if the component is directly placed into a PAINTAREA!
y-pixel-position: this attribute is only used if the component is directly placed into a PAINTAREA!