在C#窗体应用开发中,listview是常用的列表展示控件,很多时候我们需要给它添加图片来增强界面的可读性和美观度。下面先通过一张示意图了解整体实现思路,再逐步讲解具体代码。

实现前的准备工作
要实现listview插入图片,核心需要用到ImageList控件,它的作用是存储和管理要展示的图片资源,再和listview控件进行绑定。首先我们需要在窗体设计器中拖入两个控件:一个是listView1,另一个是imageList1。
基础属性配置
先对两个控件的基础属性做简单设置,确保后续功能正常:
- 设置
imageList1的ImageSize属性,比如设置为new Size(32, 32),决定图片的显示尺寸 - 设置
listView1的SmallImageList属性为imageList1,如果是大图标视图还需要设置LargeImageList属性 - 根据需求设置
listView1的View属性,可选值有LargeIcon、SmallIcon、List、Details等
核心实现代码
加载图片到ImageList
首先需要将本地的图片资源加载到imageList1中,这里以加载项目根目录下的图片为例:
using System;
using System.Drawing;
using System.Windows.Forms;
namespace ListViewImageDemo
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
// 加载图片到ImageList
LoadImagesToImageList();
// 初始化ListView数据
InitListViewData();
}
private void LoadImagesToImageList()
{
try
{
// 加载本地图片,路径根据实际项目调整
Image img1 = Image.FromFile("icon1.png");
Image img2 = Image.FromFile("icon2.png");
Image img3 = Image.FromFile("icon3.png");
// 将图片添加到ImageList,每个图片可以设置对应的key方便后续获取
imageList1.Images.Add("icon1", img1);
imageList1.Images.Add("icon2", img2);
imageList1.Images.Add("icon3", img3);
}
catch (Exception ex)
{
MessageBox.Show("图片加载失败:" + ex.Message);
}
}
}
}给ListView项绑定图片
加载完图片后,需要在创建ListViewItem的时候指定对应的图片索引或者key,这样列表项就会显示对应的图片:
private void InitListViewData()
{
// 设置listview的视图模式为Details,同时显示列
listView1.View = View.Details;
listView1.Columns.Add("名称", 100);
listView1.Columns.Add("描述", 200);
// 创建第一个列表项,使用图片key绑定
ListViewItem item1 = new ListViewItem("文件1", "icon1");
item1.SubItems.Add("这是一个文本文件");
listView1.Items.Add(item1);
// 创建第二个列表项,使用图片索引绑定(索引从0开始)
ListViewItem item2 = new ListViewItem("文件2", 1);
item2.SubItems.Add("这是一个图片文件");
listView1.Items.Add(item2);
// 创建第三个列表项
ListViewItem item3 = new ListViewItem("文件3", "icon3");
item3.SubItems.Add("这是一个压缩文件");
listView1.Items.Add(item3);
}不同视图模式下的显示效果
如果切换listView1的View属性,图片的显示效果会有所不同:
| View属性值 | 图片显示效果 |
|---|---|
| LargeIcon | 显示大尺寸图标,图片大小由imageList1的LargeImageList关联的尺寸决定 |
| SmallIcon | 显示小尺寸图标,对应SmallImageList的尺寸设置 |
| List | 以列表形式展示,图标在文字左侧 |
| Details | 在多列详情视图中,首列左侧显示对应图标 |
注意事项
- 图片路径需要确认存在,避免出现文件找不到的异常,建议可以把图片设置为项目的嵌入资源,通过资源管理的方式加载
- 如果listview需要同时支持大图标和小图标视图,需要分别设置
LargeImageList和SmallImageList属性,对应不同尺寸的ImageList - 绑定图片的时候,如果使用key绑定,要确保key在ImageList中已经存在,否则会显示空白
以上代码可以直接复制到你的C#窗体项目中运行,只需要替换对应的图片路径即可看到效果,实际开发中可以根据需求调整图片尺寸和列表展示逻辑。
如果需要动态更新某一项的图片,可以直接修改该ListViewItem的ImageKey或者ImageIndex属性,listview会自动刷新显示对应的图片。