GridLayout

Introduction

The GridLayout can be attached to the Form Control in order to arrange the Elements in a cell based Layout. The Form Control consists of a Form on top level which contains several FormContainers with several FormElements in it. According to our layout concept all of these can have LayoutData attached to them.

The GridLayout is by default a 16 cells grid but you can set the singleColumn property to true in order to get an 8 cell grid. In this case you cannot include halfGrid Containers. Within the default Grid the FormContainers you can also place two containers in one row by setting halfGrid true within the respective GridContainerData attached. The FormElements included can then have hCells and vCells set as GridElementData attached to the respective labels and fields in order to get the different arrangements within the grid. You can also add some dummy FormElements in oder to get some spare rows or dummy TextViews in order to get some spare cells.

Keyboard Navigation:

The GridLayout supports the basic Form Keyboard Navigation. In addition when using the arrow keys you are able to move up (Arrow Up) or down (Arrow Down) within the Form Fields.


Basic Example

A simple Form with a GridLayout. The several FormElements contain various number of Textfields which are of different widths.



Complex Example

Another Form with a GridLayout which shows a more complex approach of a Company Address Page. The Form consists of several FormContainers combining one and two column Layouts.



API Documentation

See API documentation