C#四种布局面板 利用网格将四种布局面板整合到一个窗口，讲解都在注释中，代码如下
<Grid> <Grid.RowDefinitions> <RowDefinition Height="1*"/> <RowDefinition Height="1*"/> <RowDefinition Height="1*"/> <RowDefinition Height="1*"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="2*"/> <ColumnDefinition Width="1*"/> </Grid.ColumnDefinitions> <Grid Grid.Row="0"> <GroupBox Header="Grid网格" Height="Auto"> <Button Content="Grid" Background="Yellow"></Button> </GroupBox> </Grid> <Grid Grid.Row="1"> <GroupBox Header="DockPanel泊靠式面板" Height="Auto"> <DockPanel LastChildFill="False"> <!--LastChildFill 设置False时 不填充--> <Button DockPanel.Dock="Left" Content="BUtton.left"></Button> <Button DockPanel.Dock="Top" Content="button.Top"></Button> <Button DockPanel.Dock="Right" Content="button.right"></Button> <Button DockPanel.Dock="Bottom" Content="button.Bottom"></Button> <Button Content="ButtonTop"></Button> </DockPanel> </GroupBox> </Grid> <Grid Grid.Row="2"> <StackPanel> <GroupBox Header="StackPanel栈式面板" Height="Auto"> <StackPanel Orientation="Vertical" Width="300"> <!-- Orientation="Horizontal"按钮呈水平排列--> <Button Content="亚马逊"></Button> <Button>天猫</Button> <Button Content="京东"/> <Button Content="天眼"/> </StackPanel> </GroupBox> </StackPanel> </Grid> <Grid Grid.Row="3"> <GroupBox Header="WrapPanel自动折行面板" Height="Auto"> <WrapPanel Orientation="Vertical"> <!-- Orientation="Horizontal"按钮呈水平排列--> <Button Content="亚马逊"></Button> <Button>天猫</Button> <Button Content="京东"/> <Button Content="天眼"/> <Button Content="亚马逊"></Button> <Button>天猫</Button> </WrapPanel> </GroupBox> </Grid> <Grid Grid.Row="0" Grid.Column="1"> <!--2、 子元素超出边界--> <Canvas ClipToBounds="False"> <!--如果将ClipToBounds属性设为true，在设计界面将会对子元素的超出部分进行裁剪--> <TextBox Width="100" BorderBrush="Blue"></TextBox> <TextBox Canvas.Left="200" Canvas.Top="50" Width="100" BorderBrush="Green"></TextBox> <Button Height="200" Canvas.Right="10" Canvas.Bottom="-130" Content="按钮"></Button> </Canvas> </Grid> </Grid> ```