Add images to Listview control in C#.net with 3.5 frame work.

Question

Hi,
   I am using C#.net with 3.5 frame work. I have a form having a listview and imagelist controls. i want to add images from a folder to listview. How can i do this with these controls.

Regards,
Sujith.

Answer 1

Off-topic in the VSTO forum. VSTO is a set of tools for extending the UI of some Office 2003 and 2007 applications. WinForms questions are not supported here. I'm moving your question to a forum supporting Windows Forms.

 

Answer 2

Hi, Sujith

Thanks for your post.

If you want to do this in the designer, you can take the following steps to add the images to the ListView control:

1. Switch to the designer, click on the ImageList component on the Component Tray, there will be a smart tag appear on the top-right corner of the ImageList.
2. Click the smart tag, and click "Choose Images" on the pane.
3. On the pop-up Image Collection Editor dialog, choose the images from the folder your want.
4. Click OK to finish adding images to the ImageList.
5. Click the ListView on the form, there will be a smart tag appear on the top-right corner.
6. Click the smart tag, you will find there're three ComboBoxes there, choose a ImageList from the list as you want.
7. Click the "Add items" option on the smart tag, a ListViewItem Collection Editor will appear, you can add items to the ListView, it's important here to set the ImageIndex or ImageKey property, or the image won't appear.
8. Click OK to finish item editing, now you'll find the images are displayed on the ListView.

If you want to add the images to the ListView by code, you can do something like this

Code Snippet

private void Form10_Load(object sender, EventArgs e)

        {

            DirectoryInfo dir = new DirectoryInfo(@"c:\pic");

            foreach (FileInfo file in dir.GetFiles())

            {

                try

                {

                    this.imageList1.Images.Add(Image.FromFile(file.FullName));

                }

                catch{

                    Console.WriteLine("This is not an image file");

                }

            }

            this.listView1.View = View.LargeIcon;

            this.imageList1.ImageSize = new Size(32, 32);

            this.listView1.LargeImageList = this.imageList1;

            //or

            //this.listView1.View = View.SmallIcon;

            //this.listView1.SmallImageList = this.imageList1;

 

            for (int j = 0; j < this.imageList1.Images.Count; j++)

            {

                ListViewItem item = new ListViewItem();

                item.ImageIndex = j;

                this.listView1.Items.Add(item);

            }

        }

 

 

Hope this helps.

Windows Forms Forum Support Team
Windows Forms General FAQ
DataBinding and Data Controls FAQ

Best Regards
Zhi-xin Ye

Answer 3

Hi,
   Thanks for your reply.

Regards,
Sujith

Answer 4

hi,
this is very useful and its working fine. I am using listview in WPF in this i dont see any such properties like  this.listView1.LargeImageList = this.imageList1; i want to show images in WPF Listview. How to approch this. Please help me out.

Thank You,
Sarada

Answer 5

Hi,

Thanks a lot for the perfect solution for this problem......

Answer 6

Hi,

Thanks a lot for the perfect solution for this problem......

Now i want to get the name of the selected image name in the list view on click Event. How i do that ?....

kindly guide me asap.

Answer 7

Hi, Sujith

Thanks for your post.

If you want to do this in the designer, you can take the following steps to add the images to the ListView control:

1. Switch to the designer, click on the ImageList component on the Component Tray, there will be a smart tag appear on the top-right corner of the ImageList.
2. Click the smart tag, and click "Choose Images" on the pane.
3. On the pop-up Image Collection Editor dialog, choose the images from the folder your want.
4. Click OK to finish adding images to the ImageList.
5. Click the ListView on the form, there will be a smart tag appear on the top-right corner.
6. Click the smart tag, you will find there're three ComboBoxes there, choose a ImageList from the list as you want.
7. Click the "Add items" option on the smart tag, a ListViewItem Collection Editor will appear, you can add items to the ListView, it's important here to set the ImageIndex or ImageKey property, or the image won't appear.
8. Click OK to finish item editing, now you'll find the images are displayed on the ListView.

If you want to add the images to the ListView by code, you can do something like this

Code Snippet

private void Form10_Load(object sender, EventArgs e)

        {

            DirectoryInfo dir = new DirectoryInfo(@"c:\pic");

            foreach (FileInfo file in dir.GetFiles())

            {

                try

                {

                    this.imageList1.Images.Add(Image.FromFile(file.FullName));

                }

                catch{

                    Console.WriteLine("This is not an image file");

                }

            }

            this.listView1.View = View.LargeIcon;

            this.imageList1.ImageSize = new Size(32, 32);

            this.listView1.LargeImageList = this.imageList1;

            //or

            //this.listView1.View = View.SmallIcon;

            //this.listView1.SmallImageList = this.imageList1;

 

            for (int j = 0; j < this.imageList1.Images.Count; j++)

            {

                ListViewItem item = new ListViewItem();

                item.ImageIndex = j;

                this.listView1.Items.Add(item);

            }

        }

 

 

 

Hope this helps.

Windows Forms Forum Support Team
Windows Forms General FAQ
DataBinding and Data Controls FAQ

Best Regards
Zhi-xin Ye

 

 

Hi Zhi-Xin Ye,
Thank you very much. I was wondering why the images are not displayed when the application is executed. Now after reading the article posted by you I unerstood that I have to Image index property. I was searchin for a solution from almost a day, finally its working now. However the image is displayed with a white square box around it. now have to search how to make it transparent or to have it the back color of the listview.

thank you again,
have a nice time

Answer 8

very helpful post solved my problem thnx..

Answer 9

How many icon images should I put in  c:\pic. Is there any process to load windows default Icon for each file.

---

pawan kumar saw

Answer 10

Zhi-xin Ye ....Thanks for "The best" solution!!!

Answer 11

I can easily tell from the response that will quite work well (for the problem posted). I was particularly looking for something different: displaying images in a dataGrid combo column that I believe are read from an ImageList:  perhaps same problem except that I'm interested when using a dataGrid combo box column...thanks (chagbert).

Answer 12

if i set  the   listviewl.view  = view.details;

and also want to show an icon  at the fisrt column   how can  I  do it  in code  Thx.

---

Thx