Class: cWebSpacer
Properties | Events | Methods | Index of Classes
The Web Framework empty space control
Hierarchy
cObject > cWebBaseObject > cWebObject > cWebBaseUIObject > cWebBaseDEOServer > cWebBaseControl > cWebSpacer
Show full hierarchy and direct subclasses
Library: Web Application Class Library
Package: cWebSpacer.pkg
Description
Use the cWebSpacer class to create a void (empty) "row" of vertical space in a view or dialog. Spacers are ideal when you want to create space in the layout of controls, for example to separate a row of button objects from the rest of the controls.
Sample
Object oOptionsCard is a cWebCard
Set psCaption to "Options"
Object oWebSpacer1 is a cWebSpacer
End_Object
Object oWebCheckbox1 is a cWebCheckbox
Set psChecked to "Y"
Set psUnchecked to "N"
Set psValue to "Y"
Set psCaption to "Option A"
End_Object
End_Object
In the above example, a cWebSpacer object is used to create some vertical space between the top of a cWebCard and the first control in that card.
Object Name
The Web Framework uniquely identifies each web object via a combination of the object hierarchy (object nesting), and object name. This means that web object names must be unique within their parent (i.e. each sibling web object must have a unique name).
Object Placement
Spacer controls must be placed within a web container (e.g. cWebPanel, cWebView or cWebModalDialog).
Spacer controls may not be nested inside other web controls. You may not mix web panels and web controls as sibling objects.
Size and Location
Web controls are positioned by HTML flow layout (left to right, top to bottom). The relative position of the control in this flow is determined by the location of the object declaration in your code.
In addition to the flow layout, each web container is divided into a fixed number of equal-width columns (piColumnCount). Child controls are aligned to these columns to determine their horizontal position and width.
Set piColumnIndex to position a spacer control in a particular column of the parent container.
Set piColumnSpan to determine the width of the spacer control i.e., the number of columns occupied by the control. The actual width is determined by the number of columns and the width of the parent container.
For more information, see Positioning and Layout of Controls.
Height
Each spacer control has a pre-determined height according to the web application's CSS theme (psTheme).
Set piHeight to specify the height, in pixels, of the spacer control.
Set pbFillHeight to configure a spacer control to occupy all available vertical height in its parent container. Set piMinHeight to specify the minimum height, in pixels, occupied by the spacer.
Label Support
By default a portion of the control's width is reserved to display a descriptive label. By default, the label is displayed to the left of the control and consumes approximately 120px of the total width.
Set pbShowLabel to True to display label. By default, pbShowLabel is False.
Set psLabel to the text string you want to display as a label.
Set peLabelAlign to position the label text to the left, right or center of the space allocated to the control's label (alignLeft, alignRight, alignCenter).
Set peLabelPosition to change the position of the space allocated to the control's label. By default, the label is positioned to the left of the control (lpLeft). The label can also be positioned above or to the right of the control (lpTop, lpRight).
Set piLabelOffset to change the amount of space that is consumed by the control's label. By default, the label consumes approximately 120px.
The label's text color is determined by the web application's CSS theme (psTheme). Set psLabelColor to directly override the label's CSS themed color.
Drag and Drop Support
This control can be used as a valid drop target by registering it as such in a cWebDragDropHelper object.
The supported actions for this control are: - C_WebDropOnControl
This allows the control to accept data dragged from elsewhere in the control (if configured that way) and can also be used to accept files when registered within a cWebDragDropFileHelper.
Drag and Drop Support
This control can be used as a valid drop target by registering it as such in a cWebDragDropHelper object.
The supported actions for this control are: - C_WebDropOnControl
This allows the control to accept data dragged from elsewhere in the control (if configured that way) and can also be used to accept files when registered within a cWebDragDropFileHelper.
Color
The color of a space control is determined by the web application's CSS theme (psTheme), usually this will be transparent. You can define additional or replacement CSS styles in your web application's application.css file. Set psCSSClass to the CSS class name you would like to be applied to a spacer control.
Set psBackgroundColor to directly override the control's CSS themed color.
See Also