Show/Hide Toolbars

Flynet Studio User Interface Generation Properties

In the Skeleton layout, a Panel can have up to 16 columns assigned to it (PanelWidth property).  Within a panel, the generated page will split the labels and fields assigned to the panel into HTML DIV tags that are also organized as columns, which is what the PanelColumns property manages.

 

With the default value of Two, labels will be on the left and for each label, the associated Fields will be combined into a single div to the right.  As you increase the number of PanelColumns, the panel will be stretched more horizontally.  With fewer columns, the panel is stretched vertically.

 

For individual Labels and Fields, use the TargetPanelColumn to override natural assignment based on the label/field's original physical location on the screen.  To "stretch" a label or field across multiple of the internal panel DIVs (to accommodate an extra wide label or field), use the label/field's PanelColSpan property.  As a Panel may cover multiple rows, depending on the PanelColumns value, there can be multiple visible rows in the resulting web page.  Use the Field/Label's TargetPanelRow to adjust where the label/field is placed in the vertical alignment of the panel.

 

Value

Meaning

One

All Labels and Fields will be generated into a single DIV so that they will wrap and align in a single group as the width of the page Viewport changes width.

Two

(Default) Labels will be generated into the leftmost DIV and corresponding Fields will be generated into the right DIV in the panel

Three

Labels will be generated into the leftmost DIV.  Corresponding Fields will be generated into the next DIVs as they are encountered left-to-right in the physical screen.

Four

Labels will be generated into the leftmost and third div, corresponding fields will be generated into the second and fourth column

Five through Eight

Labels and corresponding fields will be generated left-to-right as they are encountered.  The TargetPanelColumn property for Labels and Fields will probably be important to achieve the correct alignment.