cell
One or more cells can be placed in a
grid
to specify the size and position of components in a column- and row-based layout. Cells can span multiple columns or rows in a grid
.Note that specifying
cell
inside a grid
is optional. Each component inside a grid will be interpreted as being inside a cell if cell
isn’t specified.To illustrate, the following will look and work the same in an app:
main.view.xml
<grid>
<text-input label="First name" bind="first_name" required="false" />
<text-input label="Last name" bind="last_name" required="false" />
</grid>
main.view.xml
<grid>
<cell>
<text-input label="First name" bind="first_name" required="false" />
</cell>
<cell>
<text-input label="Last name" bind="last_name" required="false" />
</cell>
</grid>
Note: Components inside a cell are always aligned to the top of the cell.
None
Optional
Type:
integer
Default: 1
Specify the number of columns the cell should span.

main.view.xml
<grid>
<cell column-span="2">
<text-input label="First name" bind="first_name" required="false" />
</cell>
<cell>
<button label="Button" />
</cell>
</grid>
Optional
Type:
integer
Default: 1
Specify the number of rows the cell should span.

main.view.xml
<grid column-count="2">
<cell row-span="2">
<text-input label="First name" bind="first_name" required="false" />
</cell>
<cell>
<button label="Button 1" />
</cell>
<cell>
<button label="Button 2" />
</cell>
</grid>
None
Last modified 10mo ago