[.net] Bitmaps, ImageLists, and the allmighty ListView

Started by
7 comments, last by Gorg 19 years, 5 months ago
I'm writing a little tool for my mother, and it uses "picto's", which really are icons. I scanned in a page with all those picto's, and cut out all the icons. This is what I am trying to do: - Load an icon - Create a new bitmap for the result icon with the size of (50,50) - Copy the icon to the center of the new image (new.w/2-icon.w/2, new.h/2-icon.h/2) - Draw a border around the new image. I want to do this because not all icons are the same size, while the results needs them to be like that. To display the resulting icons - with names - I added a ListView to my form, and an ImageList to store the images. It works, but the end result is not what I expected it to be: Free Image Hosting at www.ImageShack.us The icons are centered to the top-left of the image. Besides, there are weird blue lines. This is a sample of the stored icons: Free Image Hosting at www.ImageShack.us Here is the code that loads an icon:

Bitmap raw = new Bitmap(file.FullName);
Bitmap picto = new Bitmap(imgSize, imgSize);

Graphics pictog = Graphics.FromImage(picto);
pictog.DrawImage(raw, (picto.Width/2)-(raw.Width/2),	(picto.Height/2)-(raw.Height/2));
pictog.DrawRectangle(borderPen, 0, 0, imgSize, imgSize);

raw.Dispose();
pictog.Dispose();

ret.Add(new Picto(picto, file.Name));
This is the code that inserts one into the ListView:

images.Images.Add(picto.Image);
ListViewItem item = new ListViewItem(picto.Name, images.Images.Count-1);
item.Tag = picto;
pictoView.Items.Add(item);
What am I doing wrong here? Thanks!
Advertisement
I don't understand why your trying to center the image in the new bitmap.

If all you are trying to do is get a copy of your image in a different size, all you need is to fully copy your icon in your new bitmap specify the target dimension.

So your draw call should be :
pictog.DrawImage(raw, 0,0, imgSize, imgSize );


Well.. I want it to be in the center of the new bitmap. The 0,0 one worked okay, but that's really not what I want. And even then, I still have those weird blue lines.
Quote:Original post by Sijmen
Well.. I want it to be in the center of the new bitmap. The 0,0 one worked okay, but that's really not what I want. And even then, I still have those weird blue lines.


I don't understand what you want them.

Do you want to see the full image scaled to your new bitmap? Can you make a fake picture of what you want for final result?
This is the raw image:
Image Hosted by ImageShack.us

And I want this bordered, centered image:
Image Hosted by ImageShack.us

It needs to happen from within the program.

Thanks for reading this thread, and trying to help me out!
I see. You were close. You were just missing the right render width and height. (I have no clue what the framework does when you don't pass the width and height)

Though, your position call seems ok, I am not sure why it was positioned like it was.

Here is some code that I have tested and works. Just fill in the blanks.

The code assumes your destination bitmap is bigger than your source bitmap.

I do not know why you have a blue line. Maybe because you did not clear the destination bitmap? It seems funny it would be just a line though.

Image source = Bitmap.FromFile( imageFile );            Bitmap dest = new Bitmap(imageWidth,imageHeight, source.PixelFormat );            Graphics g = Graphics.FromImage(dest);            //find center of destination image            int xcenter = imageWidth / 2;            int ycenter = imageHeight / 2;            //offset the center with half of source picture to position            //it aroud the center of the destination            int sourceXPos = source.Width / 2;            int sourceYPos = source.Height / 2;            g.Clear( Color.White );            g.DrawImage( source, sourceXPos, sourceYPos, source.Width, source.Height);            g.DrawRectangle( myPen, 0,0, dest.Width, dest.Height );



Hopefully your pictos are all the same size because otherwise, they will not be centered the same way.

If the sizes vary, the proper way would be to find how many pixels of border you want. Then scale your source image the destination image size minus the borders and then draw in that region.
I could be totaly off here, but it looks like the images are drawing at a negitive coord instead of the positive coord that you are trying make with:
(picto.Width/2)-(raw.Width/2), (picto.Height/2)-(raw.Height/2)
I have had the experience (in other languages) of images not reporting the correct size until they are initalized by a draw or load operation.

Try printing out the picto.Width & picto.Width variables to make sure they are the values that you expect and prefer using the imgSize variable (which ought to have the same value).

int borderWidth = (imgSize - raw.Width)/2;
int borderHeight = (imgSize - raw.Height)/2;

less division == less error.

hope this helps.

[blast ... too slow.]
Quote:Original post by Gorg
I see. You were close. You were just missing the right render width and height. (I have no clue what the framework does when you don't pass the width and height)

Though, your position call seems ok, I am not sure why it was positioned like it was.

Here is some code that I have tested and works. Just fill in the blanks.

The code assumes your destination bitmap is bigger than your source bitmap.

I do not know why you have a blue line. Maybe because you did not clear the destination bitmap? It seems funny it would be just a line though.

*** Source Snippet Removed ***


Hopefully your pictos are all the same size because otherwise, they will not be centered the same way.

If the sizes vary, the proper way would be to find how many pixels of border you want. Then scale your source image the destination image size minus the borders and then draw in that region.


That's weird. Shouldn't those xcenter and ycenter vars be used? And how come that the X/Y position is half of the size of the image? Shouldn't half of the original image size original image size be substracted from the destination image size?

:|
Quote:Original post by Sijmen
That's weird. Shouldn't those xcenter and ycenter vars be used? And how come that the X/Y position is half of the size of the image? Shouldn't half of the original image size original image size be substracted from the destination image size?

:|


Oups. Sorry.

Code should be.
//offset the center with half of source picture to position            //it aroud the center of the destination            int sourceXPos = xcenter - (source.Width / 2);            int sourceYPos = ycenter - (source.Height / 2);


It happened to work for me because I picked 200 for imageWidth and imageHeight and my source image was 100 X 100. So even if I forgot to substract from xcenter and ycenter it was giving 50.



This topic is closed to new replies.

Advertisement