Layout
A layout defines the way data is arranged, formatted, and styled for presentation to the user, either on screen or in print.
Usually, when we discuss layout, we are thinking about the layout of components, but widgets may also have a layout. For example, radio buttons may be arranged horizontally or vertically, an entity may have a free-form layout or a table layout.
The layout of a component is a property of its implicit widget. It encompasses the component dimensions, the arrangement, size, and grouping of fields and entities, the choice of widgets, and the use of other user interface elements, such as lines, frames, and split bars.
The component layout usually reflects the component's data structure, although this is not visible in the runtime component. It is possible to change the layout at runtime using ProcScript or JavaScript.
Layout of Web Components
The layout and appearance of server pages is defined as HTML. The layout definition can be stored in the Repository, but it can also be stored as one or more separate files with an .hts extension. This makes it possible for web designers to maintain the appearance of server pages, while developers control the data and interactions.
In Dynamic Server Pages, the IDs of elements that representing component instances, entities and fields bind the HTML element to the Uniface object in the component structure. In Static Server Pages, Uniface-specific tags define the component entities and fields.
For more information, see Developing Web Applications.
Layout of Forms and Reports
Uniface provides a graphical editor for defining the layout (and structure) of Form and Report components. It has a Canvas representing the component, on which you can draw frames representing entities, fields, and other objects:
- Entity and field frames—represent the dimensions of entities and fields on the component.
- Labels—contain text that appears on the form. Labels can be associated with a field, integrated in a field widget (for example, a radio group), or can be freestanding text.
- Widgets—user interface controls for presenting data, including entity-level widgets such as the Grid widget, and field-level widgets such as edit boxes, buttons, and check boxes.
- Frames, lines, splits—borders, divisions, splits, page breaks, headers and footers and so, which can add clarity or additional processing to the layout.
For more information, see Component Structure and Layout of Forms and Reports.
