DockPanel布局

WPF基本来说是一个做界面的新技术，它把source同界面分离。

DockPanel：用于设计界面布局                                                                                                                               

可以在Window中设置多个DockPanel将Window分成若干个区域（DockPanel支持嵌套）

eg：   

<DockPanel Width="20" Background="Cornsilk"/>
  <DockPanel Width="800" Height="600">
   <Border DockPanel.Dock="Top">
    <Image Margin="10" Name="currentImage" />
   </Border>
  </DockPanel>
 </DockPanel>
这样就将Window分成了两个区域

Border

在DockPanel中可以用DockPanel和Border对DockPanel进行分割   

 <DockPanel Background="DarkSeaGreen" LastChildFill="True">
  <Border DockPanel.Dock="Right" Width="200" Margin="10" Background="Green">
    <Border Style="{StaticResource DarkVerGradient}">
     <TextBlock Style="{StaticResource Header1}" Text="Select An Image:" />
    </Border>
    ... 

    <StackPanel Background="#E5E5E5" Margin="0,10,0,10">
     <Border Style="{StaticResource DarkVerGradient}">
      <TextBlock Style="{StaticResource Header1}" Text="METADATA" />
     </Border>
     <TextBlock Style="{StaticResource Header2}" Text="Image Size"/>
     <TextBlock Style="{StaticResource Normal}" Name="imageSize" />
     <TextBlock Style="{StaticResource Header2}" Text="Pixel Format"/>
     <TextBlock Style="{StaticResource Normal}" Name="imageFormat" />
     <TextBlock Style="{StaticResource Header2}" Text="File Size"/>
     <TextBlock Style="{StaticResource Normal}" Name="fileSize" />
    </StackPanel>
   </StackPanel>
  </Border>
    <Border DockPanel.Dock="Left" Width="20" Background="Chocolate"/>
   
    <DockPanel Width="20" Background="Cornsilk"/>
   
  <DockPanel Width="800" Height="600" Background="Maroon">
   <Border DockPanel.Dock="Top">
    <Image Margin="10" Name="currentImage" />
   </Border>
  </DockPanel>
   
 </DockPanel>
Border 也可以进行嵌套

    <Border DockPanel.Dock="Left" Width="20" Background="Chocolate">
      <Border Width="10" Background="Red" DockPanel.Dock="Right"></Border>
    </Border>