见下面的xaml代码:
<Window x:Class="ADTVPro.MtvMainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:ADTVPro"
mc:Ignorable="d"
Title="MtvMainWindow" Height="450" Width="800">
<Grid>
<TabControl>
<TabItem Header="全部歌曲">
<Grid Background="#FFE5E5E5">
<ListBox x:Name="AllSongsListBox" d:ItemsSource="{d:SampleData ItemCount=5}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="2">
<TextBlock Text="{Binding SongName}" FontWeight="Bold" FontSize="14"/>
<TextBlock Text="{Binding Pinyin}" FontSize="12" Foreground="Gray"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</TabItem>
<TabItem Header="选中的歌曲">
<Grid Background="#FFE5E5E5">
<ListBox d:ItemsSource="{d:SampleData ItemCount=5}"/>
</Grid>
</TabItem>
</TabControl>
</Grid>
</Window>效果:

1、数据模板
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="2">
<TextBlock Text="{Binding SongName}" FontWeight="Bold" FontSize="14"/>
<TextBlock Text="{Binding Pinyin}" FontSize="12" Foreground="Gray"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>这部分代码是WPF中的 数据模板(Data Template) ,
更具体地说是 ListBox 控件的 ItemTemplate (项模板)。
它的作用是定义 ListBox 中每个列表项的外观和布局。
让我详细解释一下:
1. ItemTemplate的作用
ListBox.ItemTemplate 属性用于指定如何显示 ListBox 中的每一个数据项。
当 ListBox 绑定了一个数据源(比如我们之前创建的 Song 对象列表),
它会为数据源中的每一个对象应用这个模板。
2. 数据模板的结构
- <ListBox.ItemTemplate> :声明这是 ListBox 的数据项模板
- <DataTemplate> :定义数据模板的开始,它会自动适配数据源中的对象类型
- <StackPanel Margin="2"> :使用垂直堆栈面板作为布局容器
- <TextBlock Text="{Binding SongName}" .../> :绑定到 Song 对象的 SongName 属性,作为主标题显示
- <TextBlock Text="{Binding Pinyin}" .../> :绑定到 Song 对象的 Pinyin 属性,作为副标题显示
3. 数据绑定机制
{Binding ...} 是WPF的数据绑定语法,它会自动将模板中的UI元素与数据源对象的属性关联起来。
当数据源更新时,UI会自动同步显示最新的数据。
这种模板化机制是WPF的核心特性之一,它实现了 数据与UI的分离 ,
让开发者可以灵活地控制数据的呈现方式,而不需要手动创建和管理每一个列表项的UI元素。
简单来说,这段代码就是告诉 ListBox :"对于你要显示的每一个 Song 对象,
请用这个布局来展示——先显示加粗的歌曲名,然后显示灰色的拼音缩写"。
2、命名空间
见代码:
<ListBox x:Name="AllSongsListBox" d:ItemsSource="{d:SampleData ItemCount=5}">1. x: 前缀
x: 是WPF的 核心XAML扩展命名空间 ,对应URI: http://schemas.microsoft.com/winfx/2006/xaml
作用:
- 提供XAML语言的基础功能(如命名、类型转换、标记扩展等)
- 在上面代码中, x:Name="AllSongsListBox" 定义了一个 后台代码可访问的控件名称 ,
使得可以在 .cs 文件中通过 AllSongsListBox 变量操作这个ListBox控件 是否可以省略:
- 对于 Name 属性,在WPF中 可以省略 x: 前缀(因为WPF控件的 Name 属性已在默认命名空间中定义)
- 但 必须保留 x: 前缀的属性包括: x:Class 、 x:Key 、 x:Static 、 x:Type 等
2. d: 前缀
d: 是 设计时命名空间 ,对应URI: http://schemas.microsoft.com/expression/blend/2008
作用:
- 仅在 设计工具 (如Visual Studio、Blend)中生效, 不影响运行时
- 用于提供设计时数据和功能,方便可视化编辑
- d:ItemsSource="{d:SampleData ItemCount=5}" 表示在设计视图中显示5条示例数据,让开发者能直观看到ListBox的布局效果 是否可以省略:
- 完全可以省略 ,因为它只在设计时起作用
- 省略后,设计视图中ListBox将显示为空,但运行时功能不受影响
总结
- x: 前缀:核心XAML功能,部分属性可省略
- d: 前缀:设计时辅助功能,完全可省略
- 两者都是为了区分不同命名空间的属性,避免命名冲突