WPF之布局

峰顶飞龙

<div id="cnblogs_post_body">     此文目的旨在让人快速了解，没有什么深度，如需深入了解布局，请参考msdn。
     如果你要把WPF当winform使用，拖拖控件也无不可，不过建议还是不要拖的好。
     本文将那些用的比较多的几个布局控件（Grid、UniformGrid、StackPanel、WrapPanel、DockPanel以及Canvas）综合起来，布局那个伟大的乌龟。
     话不多说，贴运行图和代码。


       下面是XAML代码。
<div class="cnblogs_code" >View Code <div id="cnblogs_code_open_224ba7b7-2c77-42c9-b7b7-94d90c8e6942" class="cnblogs_code_hide"><Window x:Class="LayoutPractice.MainWindow"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        Title="MainWindow" Height="640" Width="640">        <Grid ShowGridLines="True">            <Grid.RowDefinitions>                <RowDefinition/>                <RowDefinition/>                <RowDefinition/>            </Grid.RowDefinitions>            <Grid.ColumnDefinitions>                <ColumnDefinition/>                <ColumnDefinition/>                <ColumnDefinition/>            </Grid.ColumnDefinitions>            <Grid.Resources>                <Style TargetType="Button">                    <Setter Property="Width" Value="60"/>                    <Setter  Property="Height" Value="60"/>                <Setter Property="Template">                    <Setter.Value>                        <ControlTemplate>                            <Border Background="#ff909090" BorderBrush="#ff707070" BorderThickness="1">                            </Border>                        </ControlTemplate>                    </Setter.Value>                </Setter>            </Style>            </Grid.Resources>            <StackPanel Orientation="Horizontal"  VerticalAlignment="Center" HorizontalAlignment="Center" Grid.Column="3">                <Button/>                <Button/>            </StackPanel>            <DockPanel Width="120" Height="120">                <Button DockPanel.Dock="Top" Width="Auto" Height="30"/>                <Button DockPanel.Dock="Bottom" Width="Auto" Height="30"/>                <Button DockPanel.Dock="Left"/>                <Button DockPanel.Dock="Right"/>            </DockPanel>            <Grid Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center">                <Grid.ColumnDefinitions>                    <ColumnDefinition/>                    <ColumnDefinition/>                    <ColumnDefinition/>                </Grid.ColumnDefinitions>                <Grid.RowDefinitions>                    <RowDefinition />                    <RowDefinition />                    <RowDefinition />                </Grid.RowDefinitions>                <StackPanel Grid.RowSpan="2" VerticalAlignment="Center">                    <Button/>                    <Button/>                </StackPanel>                <StackPanel Grid.ColumnSpan="2" Grid.Row="0"  Grid.Column="1" Orientation="Horizontal">                    <Button/>                    <Button/>                </StackPanel>                <StackPanel Grid.RowSpan="2" Grid.Column="2" Grid.Row="1">                    <Button/>                    <Button/>                </StackPanel>                <StackPanel Grid.ColumnSpan="2" Grid.Column="0" Grid.Row="2"  Orientation="Horizontal">                    <Button/>                    <Button/>                </StackPanel>            </Grid>            <Grid Grid.Row="2" Grid.Column="2" VerticalAlignment="Center" HorizontalAlignment="Center">                <Grid.RowDefinitions>                    <RowDefinition/>                    <RowDefinition/>                    <RowDefinition/>                </Grid.RowDefinitions>                <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">                    <Button/>                </StackPanel>                <StackPanel Grid.Row="1"  Orientation="Horizontal" HorizontalAlignment="Center">                    <Button/>                    <Button/>                </StackPanel>                <StackPanel Grid.Row="2"  Orientation="Horizontal" HorizontalAlignment="Center">                    <Button/>                    <Button/>                    <Button/>                </StackPanel>            </Grid>            <StackPanel Grid.Row="1" Orientation="Horizontal"  VerticalAlignment="Center" HorizontalAlignment="Center">                <Button VerticalAlignment="Bottom"/>                <Button RenderTransformOrigin="0.5 0.5" Margin="0 0 0 42">                    <Button.RenderTransform>                        <RotateTransform Angle="45"/>                    </Button.RenderTransform>                </Button>                <Button VerticalAlignment="Bottom"/>            </StackPanel>            <WrapPanel Grid.Row="1" Grid.Column="2"  VerticalAlignment="Center" HorizontalAlignment="Center">                <StackPanel Orientation="Horizontal">                    <Button/>                    <Button/>                    <Button/>                </StackPanel>                <StackPanel Orientation="Horizontal" Margin="60 0 0 0">                    <Button HorizontalAlignment="Center"/>                </StackPanel>                <StackPanel Orientation="Horizontal">                    <Button/>                    <Button/>                    <Button/>                </StackPanel>            </WrapPanel>            <UniformGrid Grid.Column="1" Rows="3" Columns="3"  VerticalAlignment="Center" HorizontalAlignment="Center">                <Button/>                <Button/>                <Button/>                <Button/>                <Button/>                <Button/>                <Button/>                <Button/>                <Button/>            </UniformGrid>            <Button Grid.Row="2" Grid.Column="1"/>            <Canvas Grid.Row="1" Grid.Column="1" Width="180" Height="180">                <Button Canvas.Left="0" Canvas.Top="0"/>                <Button Canvas.Right="0" Canvas.Top="0"/>                <Button Canvas.Left="0" Canvas.Bottom="0"/>                <Button Canvas.Right="0" Canvas.Bottom="0"/>                <Button Margin="60"/>            </Canvas>        </Grid></Window>