(一)布局

  • StackPanel

    stackPanel是一种以堆叠方式放置控件的布局方式.
    Orientation属性有Vertical和Horizontial两种方式可以选择,Vertical表示纵向布局,Horizontial表示横向布局.
    HorizontalAlignment属性用来调整拓展方向.默认是strentch,即横向延伸.横向占满,除此之外还有Left,Center,Right,这是按照最小占位符分别位于横向的三个位置.相应的有VerticalAlignment属性,与之类似.
    View Code 
     1     <StackPanel Orientation="Vertical" VerticalAlignment="Bottom">
     2        <Button Content="1"/>
     3        <Button Content="2"/>
     4         <Button Content="1"/>
     5         <Button Content="2"/>
     6         <Button Content="1"/>
     7         <Button Content="2"/>
     8         <Button Content="1"/>
     9         <Button Content="2"/>
    10         <Button Content="1"/>
    11         <Button Content="2"/>
    12         <Button Content="1"/>
    13         <Button Content="2"/>
    14         <Button Content="1"/>
    15         <Button Content="2"/>
    16         <Button Content="1"/>
    17         <Button Content="2"/>
    18     </StackPanel>

  • DockPanel

    DockPanel是一种以上下左右中为结构的布局方式.有点像过去的winform中的Dock属性.它有一个LastChildFill属性,默认设为true,表示自动占有剩余空间.
    非常有意思的是DockPanel的布局方式是与子元素出现的顺序有关的.
    View Code 
    1     <DockPanel>
    2         <Button Content="Top" DockPanel.Dock="Top"/>
    3         <Button Content="Left" DockPanel.Dock="Left"/>
    4         <Button Content="Bottom" DockPanel.Dock="Bottom"/>
    5         <Button Content="Center"/>
    6         <Button Content="Right" DockPanel.Dock="Right"/>
    7         <!--与Button的顺序有关系-->
    8     </DockPanel>
    View Code 
    1     <DockPanel>
    2         <Button Content="Top" DockPanel.Dock="Top"/>        
    3         <Button Content="Bottom" DockPanel.Dock="Bottom"/>       
    4         <Button Content="Left" DockPanel.Dock="Left"/>
    5         <Button Content="Right" DockPanel.Dock="Right"/>
    6         <Button Content="Center"/>
    7         <!--与Button的顺序有关系-->
    8     </DockPanel>

  • WrapPanel

    WrapPanel是一种流式布局方式.
    Orientation属性有Vertical和Horizontial两种方式可以选择,Vertical表示纵向流式布局,Horizontial表示横向流式布局.

  • Grid

    Grid是一种网格布局方式.
    关于行高或者列宽的设置有30,*,30*,Auto这几种方式.
    30表示固定值,会裁减内容,不好用.
    *表示占用剩余的全部,如果出现多个表示平分剩余的全部.
    30*表示加权高度,会按照比例进行缩放.
    Auto表示根据元素的大小来自动适应.
    单元格的合并也很特别,如果一个控件A横跨两个单元格,但是它不改变原有的单元格,如果在原来的单元格的其中一个放置另一个控件B,那么会根据放置的顺序出现叠放效果(后来居上).

  • UniformGrid

    UniformGrid是一种简化的Grid布局.
    如果你设置Rows属性和Columns属性,它将会产生一个平均分配单元格大小的固定行和列的网格.
    如果你只设置其中一个的话则表示只固定一项,另外一项会根据控件的数目自动分配.
    如果这两个值都不设置的话,会根据放入其中的控件的数目自动产生n*n的网格效果((n-1)*(n-1)<控件数目N<=n*n,n>=1).

  • Canvas

    Canvas是一种精确的布局方式.
    由Left/Right/Top/Bottom中的任意两项确定一个控件的位置,而且保证不随着Canvas大小的变化改变其设定的相对位置(如设定了Left和Top,那么相对于Canvas的Left和Top将不变).
    优先级是Left>Right,Top>Bottom.

  • InkCanvas 

    它与Canvas的不同时,用户可以墨迹.
    设置DefaultDrawingAttributes可以设置默认的绘画属性.
posted @ 2011-04-23 16:58  Joe·Zhou  阅读(1649)  评论(0)  编辑  收藏  举报