WPF ListView如何在列表项左侧添加小图标？附添加项代码

没问题！我来一步步教你实现WPF ListView列表项左侧加图标，同时实现动态添加项的功能，代码都是可直接复用的：

1. 先定义数据模型 #

我们需要一个简单的类来存储每个列表项的图标和文本信息，这样后续用数据绑定会更方便：

public class ListViewItemData
{
    // 图标资源路径（支持本地文件或项目内嵌资源）
    public string IconSource { get; set; }
    // 列表项要显示的文本内容
    public string DisplayText { get; set; }
}

2. XAML布局代码 #

在你的Window/UserControl里编写ListView的布局，通过ItemTemplate自定义每个列表项的样式，把图标放在左侧：

<Window x:Class="WpfIconListView.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="带图标的ListView" Height="450" Width="800">
    <Grid Margin="10">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!-- 用来触发添加项的按钮 -->
        <Button Content="添加新列表项" Click="AddNewItem_Click" Margin="0 0 0 10"/>

        <!-- 核心的带图标ListView -->
        <ListView x:Name="IconListView" Grid.Row="1">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Height="32" VerticalAlignment="Center">
                        <!-- 左侧的小型图标 -->
                        <Image Source="{Binding IconSource}" Width="20" Height="20" Margin="0 0 8 0"/>
                        <!-- 列表项文本 -->
                        <TextBlock Text="{Binding DisplayText}" VerticalAlignment="Center" FontSize="14"/>
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</Window>

3. 后台代码实现添加项逻辑 #

用ObservableCollection来存储数据（它会自动通知UI更新，不用手动刷新ListView），然后在按钮点击事件里动态添加新项：

using System.Collections.ObjectModel;
using System.Windows;

namespace WpfIconListView
{
    public partial class MainWindow : Window
    {
        // 绑定到ListView的数据源集合
        private ObservableCollection<ListViewItemData> _itemCollection;

        public MainWindow()
        {
            InitializeComponent();
            // 初始化集合并绑定到ListView
            _itemCollection = new ObservableCollection<ListViewItemData>();
            IconListView.ItemsSource = _itemCollection;

            // 可以先添加几个默认项测试
            _itemCollection.Add(new ListViewItemData
            {
                IconSource = "/Icons/folder.png", // 替换成你自己的图标路径
                DisplayText = "默认文件夹项"
            });
        }

        private void AddNewItem_Click(object sender, RoutedEventArgs e)
        {
            // 动态生成新项，这里可以根据业务需求修改图标和文本
            _itemCollection.Add(new ListViewItemData
            {
                IconSource = "/Icons/file.png", // 替换成你自己的图标路径
                DisplayText = $"新添加项 {_itemCollection.Count + 1}"
            });
        }
    }
}

几个实用小提示 #

• 图标资源设置：如果是项目内的图标文件，记得右键图标文件→属性→把生成操作改成资源，这样路径才能正确识别
• 图标路径也可以用pack URI格式，比如pack://application:,,,/WpfIconListView;component/Icons/file.png
• 如果不需要数据绑定，也可以直接创建ListViewItem对象手动添加，但数据绑定的方式更符合WPF的设计思想，后续维护更轻松

内容的提问来源于stack exchange，提问作者Dave