dc.RowLayout
The
<dc.RowLayout>
tag assumes two or more
<dc.Column>
children. Each column will contain one element - often a widget - that will fill the entire width of the column. This may even produce a centering effect for images within a column.
Attributes
-
Pad: how much padding to use inside the layout. Values are: None, Small, Medium, Large, Extra - or custom padding defined by your template. Note often it may make sense to use the column's Pad attribute instead of extra padding around the columns (as would be the case if using this Pad attribute).
-
Collapse: at what point to break into single column mode. Values are: None, Small, Medium - or custom collapse defined by your template. See how collapse works.
Usage Notes
Each column has its own Size that is, by default anyway, a percentage of the total layout width. A column Size can be set to predefined sizes such as 1/2 which is given as “1-2” or 1/3 which is entered as “1-3”, etc. See a list of the supported and custom sizes and also review there how different levels of collapse can be applied.
TODO note how it assumes one child. explain centering effect
Examples
<dc.RowLayout Collapse="Medium">
<dc.Column Size="1-4" Pad="None">
<dcm.ImageWidget Path="/examples/simple/board/carrie" />
</dc.Column>
<dc.Column Size="1-4" Pad="None">
<dcm.ImageWidget Path="/examples/simple/board/lance" />
</dc.Column>
<dc.Column Size="1-4" Pad="None">
<dcm.ImageWidget Path="/examples/simple/board/mac" />
</dc.Column>
<dc.Column Size="1-4" Pad="None">
<dcm.ImageWidget Path="/examples/simple/board/tom" />
</dc.Column>
</dc.RowLayout>
Output:
See Also
-
TODO reference to layout systems