Display THUMBNAIL images on a window, how?

[KevinHarrington]

My app lets a user click from one image file to another. They can then dbl click on it to edit the image.

What I want to add is the ability to display a scrolling window with all image files in a thumbnail format. So user will se 10 or 15 on the window at one time and can scroll to see more.

How do I do this?
Thanks, Kevin!

------------------
Kevin Harrington

[Shrog]

There are a few ways you can achieve this.

One way is to use the PaintPicture method to draw small versions of the bitmaps on a picture box. This does not allow you to respond to mouse events for individual thumbnails though, because all the thumbnails will make up the one picture property of the picture box it is drawn on.

Another way would be to have an Image control (imgThumb) on a picturebox (picContainer). Make the imgThumb an array by setting the Index property to 0. During runtime, create as many instances of imgThumb as you need by using the Load statement. For example, place the following code in a loop that loads the thumbnails:

NoOfThumbs = NoOfThumbs + 1
Load imgThumb(NoOfThumbs)

in the same loop, load each picture into each imgThumb:

imgThumb(NoOfThumbs).Picture = LoadPicture(FileName)

By setting the Stretch property of imgThumb to true, the pictures will be the same size as the image controls, so you get the thumbnail effect. This can be heavy on resources though, because even though the pictures are small (as big as the image boxes that contains them), the full bitmap is still stored in memory.

One more way: Instead of using image controls on picContainer, use picture boxes (picThumb). This works the same as the previous method, but instead of setting the picture property, use the PaintPicture method to draw a small version of each picture on each picThumb. This means that only the small picture is stored in memory, and not the whole original bitmap.

Your program can respond to the user clicking or double clicking on any of the thumbnails, whether you use image controls or picture boxes.

You can store the file name of each bitmap in the tag property of each picThumb, so if the user double clicks on picThumb(5), you can use picThumb(5).Tag to get the filename, and do your stuff with it.

Use the Move method to place each picThumb in the desired position on the parent (picContainer).

Make picContainer big enough to display all the thumbnails. If this is bigger than the space available on the form, allow the user to scroll picContainer up and down.

Hope this helps a bit. If you need any more information, please ask.

Regards
Robert