Re: Poor thumbnail quality when using listview - C# Discussion Boards

26-Feb-10 9:36

Hi,

I am having an issue regarding the thumbnail quality and image size. I am using ImageList and ListView to display the images. The problem occurs when i try to create the image from the filepath or from a memorystream object. The quality appears to be blurry.

I did set the quality to "Depth.32Bit". But this still hasnt solve the problem.

I also want to maintain the aspect ratio of the ImageSize dynamically if possible?

Can anyone help kindly me please regarding the above requests/issues?

Here is the code i created behind a datagridview click event.

this.StaffListView.View = View.LargeIcon;
            this.StaffListView.LargeImageList = StaffImageList;
            StaffImageList.ImageSize = new Size(120, 120);
            StaffImageList.ColorDepth = ColorDepth.Depth32Bit;

            int pos = StaffDataGridView.CurrentRow.Index;
            try
            {
                if (File.Exists(StaffDataGridView.Rows[pos].Cells[1].Value.ToString()))
                {
                    byte[] ImageD = (byte[])StaffDataGridView.Rows[pos].Cells[2].Value;
                    String RfilePath = StaffsDataGridView.Rows[pos].Cells[1].Value.ToString();

                    MemoryStream memStream = new MemoryStream(ImageD);
                    Image image = Image.FromStream(memStream, true);
                    string filename = fileNameExtractor(RfilePath);
                    StaffImageList.Images.Add(RfilePath, image);
                    StaffListView.Items.Add(filename, RfilePath);

                }
            }
            catch (Exception e)
            {
                Console.WriteLine(e.Message.ToString());
            }

I also tried not to use the thumbnail thats in the database by creating a thumbnail image from scratch by using an overidden thumbnail method to create a thumbnail and then add that thumbnail to the ListView. This was to check if the problem is with the image in the database but thats where i am having difficulty identifying the where the issue is actually occuring.

I would appreciate if you could get back to me please?

Thanks,

Luc Pattyn26-Feb-10 10:13

26-Feb-10 10:13

Hi,

from what I read in the documentation, not from experience, I would say you can't get what you want in that way. There may actually be multiple problems:

1.
ImageSize sets the size of all images in the list (defaults to 16*16). If the images you add have a different size, they will be rescaled. If you set a size of 160*160 while the images have smaller size originally, they will be scaled up resulting in poor quality. What is the typical size of the images in the database?

2.
The rescaling is also likely to alter the aspect ratio. You could preserve aspect ratio by creating a new, square, image yourself. One way to do that is like this:
- create an empty Bitmap of the right size;
- call CreateGraphics on it;
- fill it with the background color you want using Graphics.FillRectangle()
- then use an appropriate Graphics.DrawImage() overload to paint the image, homogenously rescaled, and centered, leaving the borders (top and bottom, or right and left, depending on how the aspect ratio fits) in the background color.
You now have a square image of correct size fitting your ListView requirements.

Smile | :)

Luc Pattyn [Forum Guidelines] [Why QA sucks] [My Articles]

I only read code that is properly formatted, adding PRE tags is the easiest way to obtain that.
All Toronto weekends should be extremely wet until we get it automated in regular forums, not just QA.

Eagle3226-Feb-10 11:38

Re: Poor thumbnail quality when using listview [modified]

26-Feb-10 11:38

Hi,

A typical image may vary because i am using different size images. Typical size may be 1024 x 768 or 640 x 480.

if you dont mind could you give me some sample code regarding #2 please?

Thanks,

Luc Pattyn26-Feb-10 12:20

26-Feb-10 12:20

Untested (see also my next message):

// input:  Bitmap bm1, size w1*h1
// output: Bitmap bm2, size w2*h2
public Bitmap ResizeImageKeepingAspectRatio(Bitmap bm1, int w2, int h2, Brush backColor) {
    int w1=bm1.Width;
    int h1=bm1.Height;
    Bitmap bm2=new Bitmap(w2, h2);
    Graphics g=Graphics.FromImage(bm2);
    g.FillRectangle(backColor, 0, 0, w2, h2);
    int x2=0;
    int y2=0;
    float scale=1;
    if (w1*h2>w2*h1) {// w2 is the limiting factor
       y2=h2-h1*w2/w1);
       scale=w2/(float)w1;
    } else {          // h2 is the limiting factor
       x2=w2-w1*h2/h1);
       scale=h2/(float)h1;
    }
    g.ScaleTransform(scale, scale);
    g.TranslateTransform(x2/2, y2/2);
    g.DrawImage(bm1, 0, 0);
    g.Dispose();
    return bm2;
}

You need to test this; I suggest you give it a 100*100 and convert it to first a 40*50, and then a 50*40.

Smile | :)

Luc Pattyn [Forum Guidelines] [Why QA sucks] [My Articles]

modified on Friday, February 26, 2010 6:54 PM

Eagle3227-Feb-10 0:24

27-Feb-10 0:24

Hi Luc,

Thanks for your help. I do have a small problem regarding images which have 640(width)and 480(height). The right hand side of the image appears to be cut off so i cant see whats on the right hand side of the image. I did pass in the paramters as suggested.

I tried using the Width and Height property of ImageList size(100,100) and passed it into your method to test the if it would work. Now images which are 1024 by 768 scale nicely. I then increased the size of the ImageList to (150,150) but that hasnt solved the issue.

if i set the ImageListSize to (40,50) or vice versa than the images look small.

if i pass in just the values 40, 50 or 50, 40 into your method the images look small and the corner of the images are cut off(the 640 by 480 image).

I tried to adjust your code so i could fix the problem but i havent yet been able to solve it.

Can you advise please?

Thanks,

Luc Pattyn27-Feb-10 0:37

27-Feb-10 0:37

forget the 40,50 and 50,40; that was for testing my code only, which I did, see my other post.
No need to adjust my code any further, it does what its name implies.

If you can't get your stuff right, explain in detail and provide code and symptoms.

Smile | :)

Luc Pattyn [Forum Guidelines] [Why QA sucks] [My Articles]

Eagle3227-Feb-10 6:44

27-Feb-10 6:44

Hi,

I am testing the following code. Its just the images which are 640 x 480 appear to be cut off on the right hand side. What i mean is say you have a picture(640 x 480) of a Table but on the right side of the table there is something there, say a bowl of fruit, if i use the method below it cuts it off so you dont see the remaining contents of the image.

I did set the boolean parameter to true but i am not sure why the problem is occuring with those image sizes? I assumed that it would keep the aspect ratio.

public Bitmap ResizeImageKeepingAspectRatio(Image bm1, int w2, int h2, Brush backColor, bool centered) 
{
			int w1=bm1.Width;
			int h1=bm1.Height;
			Bitmap bm2=new Bitmap(w2, h2);
			Graphics g=Graphics.FromImage(bm2);
			g.FillRectangle(backColor, 0, 0, w2, h2);
			int x2=0;
			int y2=0;
			float scale=1;
			if (w1*h2 > w2*h1) {// w2 is the limiting factor
			   if (centered) y2=h2*w1/w2-h1;
			   scale=w2/(float)w1;
			} else {          // h2 is the limiting factor
			   if (centered) x2=w2*h1/h2-w1;
			   scale=h2/(float)h1;
			}
			g.ScaleTransform(scale, scale);
			g.TranslateTransform(x2/2, y2/2);
			g.DrawImage(bm1, 0, 0);
			g.Dispose();
			return bm2;
		}

Here is the code i am using in the button click

StaffImageList.ImageSize = new Size(120, 120);
this.StaffListView.View = View.LargeIcon;
StaffImageList.Images.Add(fPath, ResizeImageKeepingAspectRatio(img,StaffImageList.ImageSize.Width,StaffImageList.ImageSize.Height, brush, true));

Could you advise please?

Thanks

Luc Pattyn27-Feb-10 7:40

27-Feb-10 7:40

I checked again with your sizes (640*480 -> 120*120) and my resizing method works as expected. You can verify by saving the returned image to a file, then inspecting it with whatever image viewer you have. If anything goes wrong, it would be in the ListView. I'm not all that familiar with it, I can't advise any further.

Smile | :)

Luc Pattyn [Forum Guidelines] [Why QA sucks] [My Articles]

Eagle3227-Feb-10 7:59

27-Feb-10 7:59

Hi,

Can you confirm the following please?

So did you use an image of 640 x 480?

Regarding the ImageList size, did you pass the ImageSize.Width and ImageSize.Height into your modified method?

I will try this again.

Thanks

Luc Pattyn27-Feb-10 8:14

27-Feb-10 8:14

As I said before, I used a 640*480 image and asked for it to be rescaled to 120*120, no ListView involved. All is well.

You should learn to debug, look at the end result and stare at your code; instead check your inputs, observe intermediate results, and if needed split statements into a few lines so you can see more. What I typically do is add log statements abundantly, logging relevant information to the Console and/or to a text file.

Smile | :)

Luc Pattyn [Forum Guidelines] [Why QA sucks] [My Articles]

Eagle325-Mar-10 10:08

5-Mar-10 10:08

Hi,

I have sorted the issue out. Thanks.

Luc Pattyn26-Feb-10 12:53