1.控件类型
- Grid(网格布局):
Grid是WPF中最常用的布局控件之一,它允许开发人员将元素以网格的形式进行排列。Grid可以在行和列的交叉点位置放置控件,并通过指定行号和列号进行定位。可以使用Grid.Row和Grid.Column属性来指定控件在网格中的位置,还可以设置Grid.RowSpan和Grid.ColumnSpan属性来控制控件跨越多个行或列。
- StackPanel(堆栈布局):
StackPanel将元素以垂直或水平的堆栈方式进行排列。可以通过设置StackPanel的Orientation属性来指定排列方式。StackPanel会按照添加元素的顺序依次排列,当空间不足时,可以设置StackPanel的可滚动性或使用自动换行。
- WrapPanel(自动换行布局):
WrapPanel将元素以自动换行的方式进行排列。当空间不足时,WrapPanel会自动将元素放置到下一行。可以通过设置WrapPanel的Orientation属性来指定排列方向(水平或垂直)。
- DockPanel(停靠布局):
DockPanel允许开发人员将元素停靠在容器的不同区域(顶部、底部、左侧、右侧、中间等)。通过设置DockPanel的Dock属性来指定控件停靠的位置。
- UniformGrid(均匀网格布局):
UniformGrid将元素以均匀的网格方式进行排列。可以通过设置UniformGrid的行数和列数来控制网格的大小和形状。
Canvas(面板)
Canvas是一个类似于坐标系的面板,所有的元素通过设置坐标来决定其在坐标系中的位置。具体表现为使用Left、Top、Right、 Bottom附加属性在Canvas中定位控件。
2.Grid
标签 | 含义 |
ShowGridLines | 可以设置行业的边距线的显示 |
Grid. RowDefinitions | 可以创建任意行, 进行固定高度与百分比高度设置 |
Grid. ColumnDefinitions | 可以创建任意列, 进行固定宽度与百分宽度设置 |
<Grid><Grid.RowDefinitions><RowDefinitionHeight="*"/><RowDefinitionHeight="1*"/><RowDefinitionHeight="2*"/><RowDefinitionHeight="50"/><RowDefinitionHeight="auto"/></Grid.RowDefinitions><RectangleGrid.Row="0"Fill="Gray"/><RectangleGrid.Row="1"Fill="Red"/><RectangleGrid.Row="2"Fill="Blue"/><RectangleGrid.Row="3"Fill="Green"/><RectangleGrid.Row="4"Height="50"Fill="Black"/></Grid>
3.StackPanel控件
属性 | 含义 |
Orientation | 用于设置StackPanel的元素排列方式。默认以垂直的方式布局 |
Horizontal | 水平布局, 设置水平效果 |
Vertical | 垂直布局, 设置垂直效果 |
FlowDirection |
排列方向,默认从左向右 |
<StackPanelFlowDirection="RightToLeft"Orientation="Horizontal"><RectangleWidth="100"Height="100"Fill="Red"/><RectangleWidth="100"Height="100"Fill="Blue"/><RectangleWidth="100"Height="100"Fill="Green"/></StackPanel>
4.WrapPanel控件
属性 | 含义 |
Orientation | 用于设置WrapPanel的元素排列方式。 |
<WrapPanelOrientation="Horizontal"><RectangleWidth="200"Height="100"Fill="Red"/><RectangleWidth="200"Height="100"Fill="Blue"/><RectangleWidth="200"Height="100"Fill="Green"/></WrapPanel>
5.DockPanel
属性 | 含义 |
LastChildFill |
器中的最后一个元素时, 默认该元素填充DockPanel所有空间, 默认值为True |
<DockPanelLastChildFill="False"><RectangleWidth="100"Height="100"DockPanel.Dock="Left"Fill="Red"/><RectangleWidth="100"Height="100"DockPanel.Dock="Top"Fill="Blue"/><RectangleWidth="100"Height="100"DockPanel.Dock="Right"Fill="Green"/><RectangleWidth="100"Height="100"DockPanel.Dock="Bottom"Fill="Black"/></DockPanel>
5.UniformGrid控件
属性 | 含义 |
Columns | 布局列数 |
Rows | 布局行数 |
<UniformGridColumns="3"Rows="2"><RectangleWidth="100"Height="100"DockPanel.Dock="Left"Fill="Red"/><RectangleWidth="100"Height="100"DockPanel.Dock="Top"Fill="Blue"/><RectangleWidth="100"Height="100"DockPanel.Dock="Right"Fill="Green"/><RectangleWidth="100"Height="100"DockPanel.Dock="Bottom"Fill="Black"/></UniformGrid>
6.Canvas控件
属性 | 含义 |
Left |
从左偏移 |
Top | 从上偏移 |
Right |
从右偏移 |
Bottom |
从下偏移 |
<Canvas><RectangleCanvas.Left="50"Width="100"Height="100"Fill="Red"/><RectangleCanvas.Top="50"Width="100"Height="100"Fill="Blue"/><RectangleCanvas.Right="50"Width="100"Height="100"Fill="Green"/><RectangleCanvas.Bottom="50"Width="100"Height="100"Fill="Black"/></Canvas>