Border控件:内含一个子对象,子对象充满整个Border控件
- <Border DockPanel.Dock="Top" Padding="10" Margin="5"
- Background="Aquamarine" Height="45">
- <Label>1) DockPanel.Dock="Top"</Label>
- </Border>
包含一个子对象Label.
Canvas控件:完全自由的对子控件位置安排 公共属性Canvas.Left Canvas.Right Canvas.Top Canvas.Bottom
- <Canvas Background="AliceBlue">
- <Rectangle Canvas.Left="50" Canvas.Top="50" Height="40" Width="100"
- Stroke="Black" Fill="Chocolate" />
- <Rectangle Canvas.Right="50" Canvas.Bottom="50" Height="40" Width="100"
- Stroke="Black" Fill="Bisque" />
- </Canvas>
包含两个子对象矩形
DockPanel控件:允许将子控件贴靠到边上 公共属性DockPanel.Dock {Left Right Top Bottom}
- <DockPanel Background="AliceBlue">
- <Border DockPanel.Dock="Top" Padding="10" Margin="5"
- Background="Aquamarine" Height="45">
- <Label>1) DockPanel.Dock="Top"</Label>
- </Border>
- <Border DockPanel.Dock="Top" Padding="10" Margin="5"
- Background="PaleVioletRed" Height="45" Width="200">
- <Label>2) DockPanel.Dock="Top"</Label>
- </Border>
- <Border DockPanel.Dock="Left" Padding="10" Margin="5"
- Background="Bisque" Width="200">
- <Label>3) DockPanel.Dock="Left"</Label>
- </Border>
- <Border DockPanel.Dock="Bottom" Padding="10" Margin="5"
- Background="Ivory" Width="200" HorizontalAlignment="Right">
- <Label>4) DockPanel.Dock="Bottom"</Label>
- </Border>
- <Border Padding="10" Margin="5" Background="BlueViolet">
- <Label Foreground="White">5) Last control</Label>
- </Border>
- </DockPanel>
包含5个子对象Border
StackPanel控件:精简版DockPanel.以列表方式显示子控件
- <StackPanel HorizontalAlignment="Left" Height="128" VerticalAlignment="Top"
- Width="284" Margin="0,128,0,0" Orientation="Vertical">
- <Button Content="Button" HorizontalAlignment="Left" Width="284"/>
- <Button Content="Button" HorizontalAlignment="Left" Width="284"/>
- <Button Content="Button" HorizontalAlignment="Left" Width="284"/>
- </StackPanel>
排列三个button子对象
WrapPanel控件:扩展版StackPanel,容纳不了的子控件会被显示在下一行或下一列
- <WrapPanel Background="AliceBlue">
- <Rectangle Fill="#FF000000" Height="50" Width="50" Stroke="Black"
- RadiusX="10" RadiusY="10" />
- <Rectangle Fill="#FF111111" Height="50" Width="50" Stroke="Black"
- RadiusX="10" RadiusY="10" />
- <Rectangle Fill="#FF222222" Height="50" Width="50" Stroke="Black"
- RadiusX="10" RadiusY="10" />
- <Rectangle Fill="#FFFFFFFF" Height="50" Width="50" Stroke="Black"
- RadiusX="10" RadiusY="10" />
- </WrapPanel>
包含四个子对象矩形,可以更改窗口大小,观看排列效果
Grid控件:可以分为多行,多列显示子控件
- <Grid.RowDefinitions> //划分Grid为2行
- <RowDefinition Height="109*"/>
- <RowDefinition Height="210*"/>
- </Grid.RowDefinitions>
- <Grid.ColumnDefinitions> //划分Grid为2列
- <ColumnDefinition Width="191*"/>
- <ColumnDefinition Width="326*"/>
- </Grid.ColumnDefinitions>
多行多列属性。