Components positioning

Components positioning

The position and size of components in resulting HTML page is managed by bootstrap css and HTML flow, it doesn't use the top/left/height/width properties of the component.

Top and Left properties are used only to determine the rendering order of the components which will determine the HTML flow.

There are two global variables that helps you to configure the order rendering rendering:

unit IWBSGlobal;

type
  TIWBSRenderingSortMethod = (bsrmSortYX, bsrmSortXY);

var
  aIWBSRenderingSortMethod: TIWBSRenderingSortMethod = bsrmSortYX;
  aIWBSRenderingGridPrecision: integer = 12;

• aIWBSRenderingSortMethod: determine the order in which components are sorted
• bsrmSortYX: Componenst are compared first by Top property and if top are equal then they are compared by Left property.
• bsrmSortXY: Componenst are compared first by Left property and if top are equal then they are compared by Top property.
• aIWBSRenderingGridPresision: the min amount of pixels that determines that 2 components are in different position when comparing Top or Left properties depending of the sort method.
  This relax the positioning of the components at design time so if, for example, using sort method bsrmSortYX (the default), two components are vertically positioned with 2 pixels of difference, they will be considered at same Y and they will be sorted by the Left property.