分析WPF的一段xaml代码:

1 <UserControl x:Class="UserControl1"
 2              xmlns="..."
 3              xmlns:x="..."
 4              xmlns:mc="..."
 5              xmlns:d="..." 
 6              xmlns:local="clr-namespace:WpfApp3"  
 7              mc:Ignorable="d" 
 8              d:DesignHeight="450" d:DesignWidth="800">
 9     <Grid>
10         <Border BorderBrush="Blue" BorderThickness="2" Margin="5,3">
11             <ListBox ItemsSource="{Binding Datas}" SelectedItem="{Binding SelectedData}">
12                 <ListBox.ItemTemplate>
13                     <DataTemplate>
14                         <Border Background="LightGreen" BorderBrush="LightYellow" BorderThickness="1" Margin="1">
15                             <StackPanel Orientation="Horizontal">
16                                 <TextBlock Width="100" Text="{Binding Name}" />
17                                 <TextBlock Margin="10,0,0,0" Text="{Binding Age}" Width="100"/>
18                             </StackPanel>
19                         </Border>
20                     </DataTemplate>
21                 </ListBox.ItemTemplate>
22             </ListBox>
23         </Border>   
24     </Grid>
25 </UserControl>
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.

代码

解释

xmlns:local="clr-namespace:WpfApp3"

包名

DesignHeight="450"

窗体的高

DesignWidth="800"

窗体的宽

Grid

链接二:

Grid.RowDefinitions属性将Grid控件分行,属性值为RowDefinition标签,每一个RowDefinition标签将该Grid对象分为一行;

Grid.ColumnDefinitions属性将Grid控件分列,属性值为ColumnDefinition标签,每一个ColumnDefinition标签将该Grid对象分为一列;

Grid方格布局

Border

边框样式

BorderBrush="Blue" 

绘制外部边框颜色

BorderThickness="2" 

边框厚度

Margin="1"

四个边距都是 1px

Margin="5,3"

上边距和下边距是 5px

右边距和左边距是 3px

Margin="10,5,15"(css写法:margin:10px 5px 15px;)

上边距是 10px

右边距和左边距是 5px

下边距是 15px

Margin="10,1,2,3"

左边距是 10px

上边距是 1px

右边距是 2px

下边距是 3px

ListBox ItemsSource="{Binding Datas}"

ItemsSource绑定数事件Datas

ListBox SelectedItem="{Binding SelectedData}"

SelectedItem 绑定事件SelectedData

<ListBox.ItemTemplate>

Item模版

<DataTemplate>

Data模版

Background

背景颜色

StackPanel

堆叠面板

<StackPanel Orientation="Horizontal">

堆叠面板,布局垂直

Orientation

布局属性

特别引用:布局容器Grid、StackPanel、GroupBox、DockPanel、WrapPanel

作者:꧁执笔小白꧂