分析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>
代码 |
解释 |
xmlns:local="clr-namespace:WpfApp3" |
包名 |
DesignHeight="450" |
窗体的高 |
DesignWidth="800" |
窗体的宽 |
链接二: 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模版 |
Data模版 |
|
Background |
背景颜色 |
|
|
<StackPanel Orientation="Horizontal"> |
堆叠面板,布局垂直 |
Orientation |
布局属性 |