|
|||||||||
PREV CLASS NEXT CLASS | FRAMES NO FRAMES | ||||||||
SUMMARY: NESTED | FIELD | CONSTR | METHOD | DETAIL: FIELD | CONSTR | METHOD |
public interface FormLayout
With the default tabular layout mechanism, items are laid out in rows
from left to right until the number of columns, specified by 'form.numCols'
, is filled, then a new row is begun. Flags on
FormItems, including 'startRow'
, 'endRow'
, 'colSpan'
and 'rowSpan'
, control row and column placement and spanning.
Note that the most common form items (TextItem, SelectItem, etc) take up two columns by default: one for the
form control itself, and one for it's title. The default setting of 'form.numCols:2'
will result in one TextItem or SelectItem per
row.
Note also that ButtonItems have both startRow:true and endRow:true by default. You must set startRow and/or
endRow to false
on a ButtonItem in order to place a button in the same row as any other item.
The log
category "tablePlacement" can be enabled from the Developer Console to watch items being placed. You can also set
'form.cellBorder:1'
to reveal the table structure for
layout troubleshooting purposes.
Row and Column Sizing
colWidths
controls the widths of form columns. FormItems
that have "*" for width
will fill the column.
FormItems with a numeric width will have that width in pixels regardless of the column's specified width, which may
cause the column to overflow as described under fixedColWidths
.
For row heights, the largest pixel height specified on any item in the row is taken as a minimum size for the row. Then, any rows that have "*" or "%" height items will share any height not taken up by fixed-sized items.
Managing Overflow
Forms often contain labels, data values, or instructional text which can vary in size based on the skin, data values, or internationalization settings. There are a few ways to deal with a form potentially varying in size:
'overflow:auto'
, either on the immediate form, or on some parent. ListGrid
. In this case, the Layout will automatically shrink the grid in order to
accomodate the form.
DynamicForm.getItemLayout()
,
FormItem.getWidth()
,
FormItem.getHeight()
,
com.smartgwt.client.widgets.form.fields.FormItem#getColSpan
,
FormItem.getRowSpan()
,
FormItem.getStartRow()
,
FormItem.getEndRow()
,
ButtonItem.getStartRow()
,
ButtonItem.getEndRow()
|
|||||||||
PREV CLASS NEXT CLASS | FRAMES NO FRAMES | ||||||||
SUMMARY: NESTED | FIELD | CONSTR | METHOD | DETAIL: FIELD | CONSTR | METHOD |