Basic Layout and Panel

Layout Properties

Every widget has following properties related to the layout:

Name	Type	Default	Description
Left/Top	int	0	X/Y Addition
Width/Height	int?	null	Width/Height of the widget, if set to null, then it is automatically calculated
HorizontalAlignment/VerticalAlignment	enum	Depends on a widget, it's either Stretch or Left/Top	How control is horizontally/vertically aligned in the container
PaddingLeft/PaddingTop PaddingBottom/PaddingRight	int	0	Padding
GridPositionX/GridPositionY	int	0	Position in the grid
GridSpanX/GridSpanY	int	1	Span in the grid

_Note. Properties which names start with 'Grid' are used only in the Grid container.

Panel

Panel is simple container. Following MML demonstrates usage of layout properties with it:

<Project>
  <Panel>
    <TextBlock Text="Positioned Text" Left="50" Top="100" />
    <TextButton Text="Padded Centered Button" PaddingLeft="8" PaddingRight="8" PaddingTop="8" PaddingBottom="8" HorizontalAlignment="Center" VerticalAlignment="Center" />
    <TextBlock Text="Right Bottom Button" Left="-30" Top="-20" HorizontalAlignment="Right" VerticalAlignment="Bottom" />
    <TextButton Text="Fixed Size Button" Width="150" Height="40" PaddingRight="1" />
  </Panel>
</Project>

It would result in following UI: