WPF布局控件的选用策略

Windows Presentation Foundations (WPF)提供了多种布局面板，常用的包括Canvas、StackPanel、Grid、DockPanel。本文将要介绍如何选用这些控件，以便窗体大小改变时依然能够正确地布局。 锚定(Anchor) 锚定是Windows窗体应用程序中常用的布局技术。如果你不了解，可以在VS里新建一个Windows窗体应用程序，放一个按钮，然后

　　

　　Windows Presentation Foundations (WPF)提供了多种布局面板，常用的包括Canvas、StackPanel、Grid、DockPanel。本文将要介绍如何选用这些控件，以便窗体大小改变时依然能够正确地布局。

　　锚定(Anchor)

　　锚定是Windows窗体应用程序中常用的布局技术。如果你不了解，可以在VS里新建一个Windows窗体应用程序，放一个按钮，然后设置其Anchor属性为不同的值，然后查看效果。WPF的控件没有Anchor这种属性，我们需要用面板来实现锚定效果。在图1中，中间的TextBox设置了锚定，Anchor=Left|Right。

　　

 

　　图1

　　用DockPanel实现

<DockPanel VerticalAlignment="Center">  
    <Label Content="保存位置：" DockPanel.Dock="Left" />  
    <Button Content=".." DockPanel.Dock="Right"/>  
    <TextBox Text="C:\Windows"/>  
</DockPanel>

　　标签停放在DockPanel的左边，按钮停放在DockPanel的右边，最后加入的控件默认会占据DockPanel的剩余空间。

　　如果将多个控件停放在一边，如都是Left，就可以实现图2。

　　

 

　　图2

　　DockPanel的缺点是，被锚定的控件的左右两边必须有控件让它挨着。如果坚持用DockPanel，就要在被锚定控件前(以XAML的阅读顺序)加入两个没用的不可见的控件。这是不优雅的。此问题的解决方法是用Grid。

　　用Grid实现

　　用Grid实现图1，代码如下。

<Grid VerticalAlignment="Center">  
    <Grid.ColumnDefinitions>  
        <ColumnDefinition Width="auto" />  
        <ColumnDefinition />  
        <ColumnDefinition Width="auto" />  
    </Grid.ColumnDefinitions>  
    <Label Content="保存位置：" Grid.Column="0" />  
    <TextBox Text="C:\Windows" Grid.Column="1" />  
    <Button Content=".." Grid.Column="2" />  
</Grid>

　　你当然可以注释掉关于Label和Button的两句代码，TextBox依然被正确地定位。

　　用Grid的缺点是在WPF逻辑树中会有相应数量的ColumnDefinitio对象，比DockPanel相对“重”一点。

　　目前就想到这些，以后再补充。