10,730
edits
Important: Deprecating old WebView — Publish failed error
Form: Difference between revisions
Jump to navigation
Jump to search
→Displaying multiple fields per row: new section about Auto Grid and Grid Item
(→Displaying multiple fields per row: new section about Auto Grid and Grid Item) |
|||
| Line 326: | Line 326: | ||
| '''Step''' || Form.address1_line3.PlaceHolderText || Assign || This is also optional | | '''Step''' || Form.address1_line3.PlaceHolderText || Assign || This is also optional | ||
|} | |} | ||
== Displaying multiple fields per row == | |||
Traditionally, on a form tab, each row is exactly one field. This makes perfect sense on narrow devices and lower resolution displays. However, if your app users are using larger devices with high-resolution displays, such as tablets or a computer, it can be useful to display two or more fields per row. You have two options how this can be configured: | |||
; Auto Grid (property of a tab) | |||
: Select a form tab and on the Properties pane, set the maximum number of columns per row (for example 3), and the minimum width of a field cell (for example 250). If, in the app, the available width for your form tab exceeds 500, two fields are displayed in a row; when it's over 750, the maximum, three fields are displayed in a single row. | |||
: Additionally, for each field, you can force it to be always displayed as a single row, or disallow any fields after it in a single row. This behavior is controlled by the Grid Behavior property; you can configure it for each field of your tab. | |||
: Auto Grid can be particularly useful when your users have a variety of devices and you value flexibility. | |||
: [[File:Auto Grid example configuration.png|600px]] | |||
; GridItem (add a table to your tab) | |||
: To use grid item, you add a table to your tab (using the Add Grid button on the toolbar). Define the number of columns and rows. Then add fields to the table (make sure they are actually inside the grid item). Additionally, for each field, define in which cell should it be displayed, and optionally make it span over multiple columns. | |||
: Precisely defined tabular format ensures that your fields are displayed as you want, losing some of the flexibility compared to Auto Grid. | |||
: [[File:Grid item example.png|600px]] | |||
[[Category:Woodford]] | [[Category:Woodford]] | ||