The TABBEDLINETAB component is an item of the TABBEDLINE component - representing one "tab" item.
Typically used attributes
All attributes are
General attributes are
Used inside: TABBEDLINE
Text that is passed as control content to the accessible support devices (e.g. screen readers).
Binding to server side method that processes the events coming from this component.
#{methodBinding} | Method binding |
Special binding to component adapter object instance on server side. The component adapter must be an instance of IComponentAdapterBinding. For some components (e.g. FIXGRID) there is an extended interface (e.g. IFIXGRIDComponentAdapterBinding).
#{tobedefined} | Binding to IComponentAdapter instance |
Horizontal alignment of content.
left | left (transferred into right when starting client in right to left mode) |
left! | left (still is left when starting client in right to left mode) |
center | center |
right | right (transferred into left when starting client in right to left mode) |
right! | right! (still is right when starting client in right to left mode) |
leading | leading |
trailing | trailing |
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.
Background color of the component. Any RGB value can be chosen using format #rrggbb.
#FFFFFF | White |
#000000 | Black |
#FF0000 | Red |
#00FF00 | Green |
#0000FF | Blue |
#0000FF30 | Blue with a transparency of x30. |
The BGPAINT background painting of this component is by default driven by its parent. But you can add a certain bgpaintaddon, which will be appended to the complete BGPAINT command.
----- | ----- bgpaint commands for all clients ----- |
error() | Component indicates error. |
mandatory() | Component indicates mandatory input. Only is shown if component does not have any content yet. |
bgbackground(#FF0000) | Background with one color |
bgbackground(#FF0000,#0000FF,vertical) | Background as gradient of two colors |
bgimage(left,/images/xyz.png) | Image at certain position |
bgwrite(left,...text...) | Text at certain position |
bgwrite(left,...text...,#800000,12) | Text at certain position with defined color and size |
----- | ----- bgpaint commands for Java clients ----- |
rectangle(0,0,100%,100%,#FF0000) | Red rectangle |
rectangle(20,20,100,100,#FF0000) | Red rectangle from 20,20 to 120,120 |
rectangle(20,20,100%-40,100%-40,#FF0000) | Minus absolute values is allowed after percentage definitions |
rectangle(0,0,100%,100%,#FF0000,#00FF00,vertical) | Rectangle with color changing from red to green in vertical direction |
roundedrectangle(0,0,100%,100%,10,10,#FF0000,#00FF00,vertical) | Rectangle with color changing from red to green in vertical direction |
line(0,0,100%,100%,1,#00FF00) | Green line crossing the whole rectangle, from coordinate 0,0 to coordinat 100%,100%, thickness of line is 1 |
image(0,0,/images/xyz.png,lefttop) | Image output x,y,image,position (lefttop/centermiddle/rightbottom...) |
image(0,0,200,100,/images/xyz.png,lefttop) | Image output x,y,width,heigh,image,position (lefttop/centermiddle/rightbottom...) |
scaledimage(0,0,200,100,/images/xyz.png,lefttop) | Scaled image output, the width/height ration is kept while scaling : x,y,width,heigh,image,position (lefttop/centermiddle/rightbottom...) |
heximage(0,0,08FF40324672849CDFE...,lefttop) | Image output x,y,hexadecimal image,position (lefttop/centermiddle/rightbottom...) |
heximage(0,0,200,100,08FF40324672849CDFE...,lefttop) | Image output x,y,width,height,hexadecimal image,position (lefttop/centermiddle/rightbottom...) |
scaledheximage(0,0,200,100,08FF40324672849CDFE...,lefttop) | Scaled image output x,y,width,height,hexadecimal image,position (lefttop/centermiddle/rightbottom...) |
border(0,0,100%,100%,#C0C0C0,2) | Rectangular border with thickness 2 |
roundedborder(0,0,100%,100%,10,10,#C0C0C0,2) | Rounded border with thickness 2 |
write(0,0,Some text,lefttop) | Some text in the left top corner |
write(50%,50%,Some text,20,#00FF00,centermiddle) | Some text in the left center, font size 20, font color green |
write(50%,50%,Some text,20,#00FF00,bold,centermiddle) | Some text in the left center, font size 20, font color green,bold |
write(50%,50%,Some text,20,#00FF00,italic,centermiddle) | Some text in the left center, font size 20, font color green,italic |
write(50%,50%,Some text,20,#00FF00,normal,centermiddle) | Some text in the left center, font size 20, font color green,normal |
write(0,100%,Some text,20,#00FF00,default,lefttop,90) | Some text in the left bottom corner, font size 20, font color green, 90 degrees rotated |
write(20,100%,Some text,20,#00FF00,default,lefttop,90,-1,1) | Some text in the left bottom corner, font size 20, font color green, 90 degrees rotated. x scaling -1, y scaling 1 |
write(20,100%,Some text,20,#00FF00,bold,lefttop,90,-1,1) | Some text in the left bottom corner, font size 20, font color green, 90 degrees rotated. x scaling -1, y scaling 1 |
writeifempty(0,0,Some text,lefttop) | Same as write-command, but now only visible if component contains data |
writeifempty(50%,50%,Some text,20,#00FF00,centermiddle) | Same as write-command, but now only visible if component contains data |
writemultiline(0,0,100%,100%,Some text) | Some text into the defined rectangle. Only fully supported with FX client, in Swing client the text will be output as one line. |
writemultiline(0,0,100%,100%,Some text,20,#FF0000,bold) | Some text into the defined rectangle. In additional font size, text color and text style (normal,bold,italic) are passed. Only fully supported with FX client, in Swing client the text will be output as one line. |
oval(0,0,100%,100%,#FF0000) | Red ellipse |
oval(0,0,100%,100%,#FF0000,#00FF00,vertical) | Red ellipse with color changing from red to green |
ovalborder(0,0,100%,100%,#FF0000,2) | Red ellipse border, red, 2 pixels thick |
grid(100,#00000020) | Grid with line distance 100, black line color - with transparency |
nodisabled() | Switches off the automated shading of disabled input components |
background(#FF0000) | Sets the background of the painted area. |
backgroundnofocus(#FF0000) | Sets the background of the painted area - which is only drawn if the component does not hold the focus. |
repeatimage(/images/xyz.png) | The image is repeated and drawn all over the available space. |
Defintion of border of control. Either defined as straight color value, with then having a border of 1 pixel. Or: an explicit per-side definition as comma separated list of border definition values.
#808080 | 1 pixel border in color dark gray. |
top:1;color:#808080 | top:1;color:#808080 : border only on top, 1 pixel height, color #808080 |
top:1;bottom:1;left:1;right:1;color:#FF0000 | top:1;bottom:1;left:1;right:1;color:#FF0000 : red border of 1 pixel size |
top:1;bottom:1;left:1;right:1;color:#FF0000;dashing:5,2 | top:1;bottom:1;left:1;right:1;color:#FF0000 : red border of 1 pixel size, dashed with segments of 5 pixesl and 2 pixels; dashing only supported with FX Client! |
noborder | Defines that no border is painted - esp. in cases when empty borders are normally added (e.g. in grid cells) |
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.
Image that is shown as close icon if the mouse is moved over the icon. Only is used if attribute WITHCLOSEICON is set to true.
/images/abc.png | Image /images/abc.png |
/images/svg/def.svg | Image /images/svg/def.svg |
Image that is shown as close icon if the tabe is selected. Only is used if attribute WITHCLOSEICON is set to true.
/images/abc.png | Image /images/abc.png |
/images/svg/def.svg | Image /images/svg/def.svg |
Image that is shown as close icon for unselected tabs. Only is used if attribute WITHCLOSEICON is set to true.
/images/abc.png | Image /images/abc.png |
/images/svg/def.svg | Image /images/svg/def.svg |
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.
If set to true then an event is triggered on server side when the user starts a drag operation. The event is of type BaseActionEventDragStarted.
false | No event triggered (default) |
true | Event triggered |
Description of object that can be dragged from this component. The description consists out of a type and and id. A component may have multiple objects that can be associated.
article:4711 | Example: article |
file:harry.txt;content:Hello world! | Example: Multiple object descriptions |
Text that is shown when dragging over the component. The text is only shown if a drop is possible (DROPRECEIVE definition).
(default) No text shown | |
pixel(5) Current drop pixel position - in steps of 5 (or any other value) | |
pixelX(5) Current drop pixel position - only the x-position | |
pixelY(5) Current drop pixel position - only the y-position | |
percentage(5) Current drop pixel position as percentage number - in steps of 5 (or any other value) | |
percentageX(5) Current drop pixel position as percentage number - only the x-position | |
percentageY(5) Current drop pixel position as percentage number - only the y-position | |
textX(0,left,25,middle,75,right) Text that is shown depending from percentage x-position |
Semicolon separated list of object types that can be dropped onto this component.
article | Example: articles can be dropped |
article;customer | Example: articles and customers can be dropped |
Indicator if component is enabled or not.
true | Component is enabled. |
false | Component is not enabled. |
Help id that is part of the online help management.
helpid | Id pointing to a server side online help file. |
ccnof1help | Explicitly switching off default F1 help. This is sometimes required in case you want to explicitly react on F1-key as hotkey. |
Reference to image within your web application. The image is defined in an absolute way (e.g. /images/abc.png) - the root directory for absolute addressing is the directory of the web application.
/images/abc.png | Image /images/abc.png |
/images/svg/def.svg | Image /images/svg/def.svg |
Color that is drawn as background of the image
Color of the border that is drawn around the image.
Border width of the image border in pixels.
The fit mode decides in which way the image is fit into the available screen space.
contain | (Default) The image is always fully shown - gaps may occur |
cover | The image is always scaled to fill the available space - parts of the image may be cut |
Pixel height of image that is contained in the component.
Rounding of the image background/border.
5 | 5 pixels |
10 | 10 pixels |
50% | 50% |
Pixel width of image that is contained in the component.
Reference to the id of a POPUPMENU definition that is available either in this page or in a page that includes this page.
If set to true, then an explicit roundtrip is triggered when the user presses the right mouse button in order to open a popup menu. As result you can define the popup menu dynamically (using DYNAMICCONTENT) and prepare the popup menu at this point of time when the user want to open it.
false | Menu is already defined in layout, no roundtrip (default) |
true | Menu is dynamically created, roundtrip is triggered |
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 |
By default the index of the item component is passed into the value of the parent component. But: if the SELECTIONID is defined then the value of SELECTIONID is passed.
By default the style sequence for this component is calculated by its parent component. But you can explicitly assign a style sequence on this component, which will override the default calculation of the parent. - When using this component for the TABBEDLINETAB component, please note: the style name that you pass is the style for a deselected tab. The style name for the selected tab is automitcally chosen by appending '_selected' to the value.
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.
Text that is shown and (dependent from the component type) edited inside the component. The terminator is a decimal byte value.
Text that is shown as hint when the user stays with the mouse on top of the control for a while.
...anytext... | Text that is displayed as tooltip. |
server:true | Indicator that tooltip for the component is managed on server side. The actionListener will be invokde with events BaseActionEventTooltipStarted and BaseActionEventTooltipEnde. On server side you may implement some modeless popup in order to show some more complex tooltip |
server:true;opendelay:1000 | Duration in milliseconds after which a tooltip event is triggered when the user moves the mouse on top of this 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 |
When true then a close icon is rendered into the tab.
false | (default) |
true | With close icon inside the tab |