jMonkey LorisGUI - Layouts

The organization of child controls within a parent

Home Overview Visuals XML Style Model Controls Components Layouts

The layout layer is the key visual element of Container and its subclasses. It provides the visual organization for some set of child controls within the parent container. The child position within the layout is determined by a Constraint associated with the child. A constraint can be set either as an explicit <constraint> nested within <layout> with the child as its interior element, or by specifying the constraint directly on the child element itself.

 

BorderLayout

The BorderLayout organizes its children into a 3x3 grid, with the center cell being the primary focus. The constraint associated with each child selects which cell to occupy. The constraint position= attribute selects: NW, North, NE, West, Center, East, SW, South, SE. Only one child can be assigned to any one cell. If no constraint is used, then Center becomes the default.

During the resize/positioning step, any excess width/height are assigned to the center cell. The resultant size of the center cell can stretch the width of North/South, and can stretch the height of West/East. The orientation= attribute of the BorderLayout controls how sizing is applied to edge elements. For orientation None, no preference is given to a particular dimension. Every cell has the height of the tallest cell in its row, and the width of the widest cell in its column. For orientation Vertical, each column is treated independently. This means each column is as wide as its widest cell, but the individual cell heights are independent. For orientation Horizontal, each row is treated independently. This means each row is as tall as its tallest cell, but the individual cell widths are independent.

<cellInsets>
Common insets that apply to every cell within the layout.
<elements>
Include a list of all child elements managed within this layout.
NOTE: that the <elements> tag is not actually required. If not supplied, then any Viewable, Constraint, or Layout element declared within the span of <layout> will be treated like a child.
orientation='None/Vertical/Horizontal'
Define the orientation applied to the cells in the layout.

 

FreeFormLayout

The FreeFormLayout applies minimal constraints on its children. It is typically used to hold a single child, or children that define their own explicit positions independent of their siblings. An explicit position is defined via a Constraint with offsetX= and offsetY=. These define an offset from the upperleft corner of the layout. If either offset is negative, then it represents an offset from the lowerright corner of the layout. If either offset is less than 1.0, then the offset represents a percentage of the size.

You can also use offsetZ= to explicitly set the z-ordering of this child.

<cellInsets>
Common insets that apply to every cell within the layout.
<elements>
Include a list of all child elements managed within this layout.
NOTE: that the <elements> tag is not actually required. If not supplied, then any Viewable, Constraint, or Layout element declared within the span of <layout> will be treated like a child.

 

OverlayLayout

The OverlayLayout expects only one of its children to be visible at a time. It manages its size to be the maximum of all child widths and the maximum of all child heights. This size is applied to all children, and all children are positioned to the same point.

OverlayLayout provides methods for selecting which child is active, but it has no processing logic of its own to pick a child to be active. The OverlayLayout must be driven by other code in the Loris system.

<cellInsets>
Common insets that apply to every cell within the layout.
<elements>
Include a list of all child elements managed within this layout.
NOTE: that the <elements> tag is not actually required. If not supplied, then any Viewable, Constraint, or Layout element declared within the span of <layout> will be treated like a child.

 

TileLayout

The TileLayout organizes its children into rows and columns. As children are added, each occupies the next open column. If a column limit is in force, then a new row is started once that limit is reached. The break= constraint can be used to force the start of a new row.

Columns can be either aligned or non-aligned. Non-aligned columns are independent within each row. That means the width of column 1 in row 1 is independent of the width of column 1 in any other row. Aligned columns impose constraints across rows. That means that column 1 is the maximum width of any column 1 cell in any row. Likewise, column 2 matches all other column 2 cells, and so on.

Since the column width for any given column matches across all rows, it is possible to support column spans for aligned columns. The columnSpan= constraint on a cell will specify a column span count. So if a cell in column 2 asks to span two columns, then that cell will be the width of column 2 plus column 3. The next cell in that row starts at column 4.

The TileLayout must decide what to do with any excess size available to the cells. This policy is set by selecting a fill mode, which can be independently defined for rows and columns.

  • None - any excess is ignored. Each cell operates with its own inherent size.
  • Even - any excess is split evenly amongst all the elements. Remember that each cell is still based on its own inherent size.
  • Proportional - the excess is distributed proportionally based on the cells inherent size. In other words, bigger cells get more of the excess.
  • ForcedEqual - all cells are forced to be the same size.
  • First - the first cell in the row/column absorbs all the excess.
  • Last - the last cell in the row/column absorbs all the excess.
  • Center - the center cell in the row/column absorbs all the excess.
alignColumns='true/false'
When true, the all cells in the same column have the same width. When false, the columns within every row are independent of the columns in any other row.
<cellInsets>
Common insets that apply to every cell within the layout.
columnFill='None/Even/Proportional/ForcedEqual/First/Last/Center'
Select how excess width is distributed amongst the columns.
columnLimit='count'
Specify the maximum count of columns in a row. A limit of zero means there are no bounds and columns are added to the current row. Otherwise, columns are added to the current row until the limit is matched, at which point a new row is started.
<elements>
Include a list of all child elements managed within this layout.
NOTE: that the <elements> tag is not actually required. If not supplied, then any Viewable, Constraint, or Layout element declared within the span of <layout> will be treated like a child.
orientation='None/Vertical/Horizontal'
Orientation is short hand notation of setting the column limit. When Vertical, a column limit of one is imposed. This means a new row is started for every cell. When Horizontal, a column limit of zero is imposed. This means there is no bound on the count of columns, and each added cell creates a new column in the current row. When None, a column limit of zero is used and it acts like Horizontal.
rowFill='None/Even/Proportional/ForcedEqual/First/Last/Center'
Select how excess height is distributed amongst the rows.

 

Constraint

A Constraint determines where a child is positioned within its associated layout. Each child must have its own constraint or a default constraint must apply. A constraint can be defined by:

  • Including a <constraint> nested within the <layout>. The child element is then either contained explicitly within <element class=''> or is the first subelement within the constraint. (<cell> is a synonym for constraint)
  • Including a <constraint> nested within the control element specification.
  • Including the following Constraint attributes directly on the control element definition.

A Constraint supports all the attributes needed for any of the layouts. Only those that apply to the active layout will be meaningful.

break='None/Before/After'
Within a TileLayout, break the current row either before or after including this element in a column. 'None' does not cause a row break.
columnSpan='count'
Within a TileLayout with aligned columns, this element will occupy 'count' number of columns in the current row.
offsetX='value' offsetY='value' offsetZ='value'
Within a FreeFormLayout, this element is explicitly positioned at the given offset.
position='NW/North/NE/West/Center/East/SW/South/SW/Popup'
Select the cell within a BorderLayout.
rowSpan='count' (future enhancement)
Within a TileLayout with aligned columns, this element will occupy 'count' number of rows in the current column.