Develop Reference

After image resize transparency is removed - gdi+

I am reading an image from file that contains transparency area in the center (frame image type).
Image myFrame = Image.FromFile("d:\mypngfile.png");
After i call image resize custome function:
myFrame = resizeImage(myFrame, new Size(otherbmp.Width, otherbmp.Height));
The problem is that after reszing the image it seems transparency is removed.
resize function:
public Image resizeImage(Image imgToResize, Size size)
{
int sourceWidth = imgToResize.Width;
int sourceHeight = imgToResize.Height;
float nPercent = 0;
float nPercentW = 0;
float nPercentH = 0;
nPercentW = ((float)size.Width / (float)sourceWidth);
nPercentH = ((float)size.Height / (float)sourceHeight);
if (nPercentH < nPercentW)
nPercent = nPercentH;
else
nPercent = nPercentW;
int destWidth = (int)(sourceWidth * nPercent);
int destHeight = (int)(sourceHeight * nPercent);
Bitmap b = new Bitmap(destWidth, destHeight,PixelFormat.Format32bppArgb);
b.MakeTransparent();
Graphics g = Graphics.FromImage((Image)b);
g.CompositingQuality = CompositingQuality.HighQuality;
g.CompositingMode = CompositingMode.SourceOver;
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.SmoothingMode = SmoothingMode.AntiAlias;
g.PixelOffsetMode = PixelOffsetMode.HighQuality;
g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
g.Dispose();
return (Image)b;
}
After i am checking the alpha pixels which doesn't work after resize (it does work before resizing and returns a value). It always return 0!
public int GetBorderWidth(Bitmap bmp)
{
var hy = bmp.Height/ 2;
while (bmp.GetPixel(0, hy).A == 255 && sz.Width < hx)
sz.Width++;
return sz.width;
}
I can't seem to solve this issue no matter what i try...

I found the issue, it was related that after resizing the image it seems that the border has some transparent pixels ..(like Alpha 150) so the border was not ALPHA 255..
What i did i changed the function GetBorderWidth code with
while (bmp.GetPixel(sz.Width, hy).A > 10 && sz.Width < hx)
sz.Width++;
and it seems it fixed the issue.
thank you all for giving me some idea of what to check.

Scaling image to 1600px X 700 px

When an user uploads any image, can we scale it to 1600 X 700?
I'm using the code below to scale the images which are 1996 X 1442 , but it never scales to 1600 X 700.
Any better way or other way to achieve it?
private static Image resizeImage(Image imgToResize, Size size)
{
int sourceWidth = imgToResize.Width;
int sourceHeight = imgToResize.Height;
float nPercent = 0;
float nPercentW = 0;
float nPercentH = 0;
nPercentW = ((float)size.Width / (float)sourceWidth);
nPercentH = ((float)size.Height / (float)sourceHeight);
if (nPercentH < nPercentW)
nPercent = nPercentH;
else
nPercent = nPercentW;
int destWidth = (int)(sourceWidth * nPercent);
int destHeight = (int)(sourceHeight * nPercent);
Bitmap b = new Bitmap(destWidth, destHeight);
Graphics g = Graphics.FromImage((Image)b);
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
g.Dispose();
return (Image)b;
}
If you check the comments below, they say it's not possible to archive it without loosing aspect ratio, but if I see the HERO images from airbnb they have images which are of 1600 X 700...
So I think it's somehow possible but I don't know how to achieve it...

Of course not, as 1600 x 700 has a different aspect ratio (0.4375) than 1996 x 1442 (0.7724). The way you do it is to scale keeping the aspect ratio, so you'll never get to 1600 x 700 from 1996 x 1442.
You could:
Scale the image so that the longer corner is 1600 long and then cut out a relevant part of size 1600 x 700 (keeping the aspect ratio).
Scale the image to 1600 x 700, probably distorting the image as it is vertically "squeezed".
Another problem in your code are rounding issues.
int destWidth = (int)...;
int destHeight = (int)...;
simply cuts off the decimal places. Even if the computation result would be 699.9, destWidth would be 699.
You might want to use Math.Round instead, which would round 699.9 to 700 as expected.

Well, actually yes! There is almost nothing impossible in this world. Just try to search information about "seam carving". Sorry, no code here, because I'm not so familiar with these algorithms.

I've tweaked your method in a few ways:
It now scales according to the bigger ratio, not the smaller one, so you will end up trimming bits off your image rather than leaving white(?) letterboxing. (This is just < vs > though so it's easy to change.)
For the side that should be equal, this ensures it's equal, rather than scaling and rounding and hoping you don't end up with one pixel difference.
If the aspect ratios do not match, it centers the drawn image on g so you end up with equal amounts trimmed off left and right or top and bottom. (Without knowing that the original image is in the correct ratio, you have to decide somehow which bits of the image to trim off.)
Give it a try and see if you like the results.
private static Image resizeImage(Image imgToResize, Size size)
{
int sourceWidth = imgToResize.Width;
int sourceHeight = imgToResize.Height;
double wRatio = (double)size.Width / sourceWidth;
double hRatio = (double)size.Height / sourceHeight;
int destWidth, destHeight;
float top, left;
if (wRatio > hRatio) // reverse for white bars rather than trimming
{
destWidth = size.Width;
destHeight = (int)Math.Ceiling(sourceHeight * wRatio);
left = 0;
top = (destHeight - size.Height) / 2f;
}
else
{
destHeight = size.Height;
destWidth = (int)Math.Ceiling(sourceWidth * hRatio);
top = 0;
left = (destWidth - size.Width) / 2f;
}
Bitmap b = new Bitmap(size.Width, size.Height);
Graphics g = Graphics.FromImage((Image)b);
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.DrawImage(imgToResize, left, top, destWidth, destHeight);
g.Dispose();
return (Image)b;
}

This code preserves the Aspect Ratio of the original image. If preserving it is not important, then you can get rid of the ratio calculation part and create a Bitmap object with the size provided directly.
private static Image resizeImage(Image imgToResize, Size size)
{
Bitmap b = new Bitmap(size.Width, size.Height);
Graphics g = Graphics.FromImage((Image)b);
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
g.Dispose();
return (Image)b;
}

After resize bitmap the result of the new bitmap is smooth bitmnap

I using simple re-size method to change my bitmap to new size.
The original bitmap size is 320x240 and i change the size two times
To 250x160
Doing some process on the bitmap
Change it back to 320x240
I found out that after i change it back to 320x240 i see that the bitmap is little smooth and not as i excepted.
How can i avoid this smooth to appear ?
The Resize method:
private static Image resizeImage(Image imgToResize, Size size)
{
int sourceWidth = imgToResize.Width;
int sourceHeight = imgToResize.Height;
float nPercent = 0;
float nPercentW = 0;
float nPercentH = 0;
nPercentW = ((float)size.Width / (float)sourceWidth);
nPercentH = ((float)size.Height / (float)sourceHeight);
if (nPercentH < nPercentW)
nPercent = nPercentH;
else
nPercent = nPercentW;
int destWidth = (int)(sourceWidth * nPercent);
int destHeight = (int)(sourceHeight * nPercent);
Bitmap b = new Bitmap(destWidth, destHeight);
Graphics g = Graphics.FromImage((Image)b);
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
g.Dispose();
return (Image)b;
}

The sad thing is you cannot.
When you resize your bitmap to a smaller size, information is lost. And information is interpolated from the small image (with less information) to create the new redimensionned image with the original size. It's this interpolation that gives the resulting image its smooth aspect.
To avoid this, the only thing you can do is finding a way to do the processing you have to without resizing down your image as part of your process.

Since you're using the HighQualityBicubic interpolation mode, the image will be prefiltered and resized using the highest possible quality, resulting in the "smoothing effect".
You can try setting the InterpolationMode property to NearestNeighbor to obtain a "rougher" result:
Bitmap b = new Bitmap(destWidth, destHeight);
using (Graphics g = Graphics.FromImage((Image) b)) {
g.InterpolationMode = InterpolationMode.NearestNeighbor;
g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
}

Quality problem when resizing image?

I'am using this code to resize image. But result is not fine, I want to best quality. I know its low quality because I also resize same image with photoshop and result is different so better. How do I fix it?
private static Image resizeImage(Image imgToResize, Size size)
{
int sourceWidth = imgToResize.Width;
int sourceHeight = imgToResize.Height;
float nPercent = 0;
float nPercentW = 0;
float nPercentH = 0;
nPercentW = ((float)size.Width / (float)sourceWidth);
nPercentH = ((float)size.Height / (float)sourceHeight);
if (nPercentH < nPercentW)
nPercent = nPercentH;
else
nPercent = nPercentW;
int destWidth = (int)(sourceWidth * nPercent);
int destHeight = (int)(sourceHeight * nPercent);
Bitmap b = new Bitmap(destWidth, destHeight);
Graphics g = Graphics.FromImage((Image)b);
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
g.Dispose();
return (Image)b;
}

This is the routine I use. Perhaps you'll find it useful. It is an extension method, to boot. The only difference is that I omit the code to preserve the aspect ratio, which you could just as easily plug in.
public static Image GetImageHiQualityResized(this Image image, int width, int height)
{
var thumb = new Bitmap(width, height);
using (var g = Graphics.FromImage(thumb))
{
g.SmoothingMode = SmoothingMode.HighQuality;
g.CompositingQuality = CompositingQuality.HighQuality;
g.InterpolationMode = InterpolationMode.High;
g.DrawImage(image, new Rectangle(0, 0, thumb.Width, thumb.Height));
return thumb;
}
}
Example usage of this extension method could include:
// Load the original image
using(var original = Image.FromFile(#"C:\myimage.jpg"))
using(var thumb = image.GetImageHiQualityResized(120, 80))
{
thumb.Save(#"C:\mythumb.png", ImageFormat.Png);
}
Notes
See http://msdn.microsoft.com/en-us/library/84767bxk.aspx for additional methods of saving and loading images.
The difference between the default JPG encoding and the default PNG encoding is, indeed, very different. Below are two thumbs using your example, one saved with ImageFormat.Png and one with ImageFormat.Jpeg.
PNG Image
JPEG Image
You may find the work done by the original poster in this question to be helpful if you determine that you absolutely must use JPEG. It involves configuring the image codec and encoding parameters to high-quality settings. .NET Saving jpeg with the same quality as it was loaded
Were it me, I'd just as soon use the PNG format, as it is lossless.

Resizing gives me to heavy image

I'm resizing jpeg 1200x900 ,556kb by method:
public static Image ResizeImage(Image imgToResize, int height) //height=400
{
int destWidth;
int destHeight;
int sourceWidth = imgToResize.Width;
int sourceHeight = imgToResize.Height;
float nPercent = 0;
float nPercentH = 0;
nPercentH = ((float)height / (float)sourceHeight);
nPercent = nPercentH;
destWidth = (int)(sourceWidth * nPercent);
destHeight = height;
Bitmap b = new Bitmap(destWidth, destHeight);
Graphics g = Graphics.FromImage((Image)b);
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.DrawImage(imgToResize, 0, 0, destWidth, destHeight);
g.Dispose();
return b;
}
SavingŁ
Image image = Image.FromStream(new FileStream(path, FileMode.Open));
Image imageAfterResizing =ResizeImage(image,400);
imageAfterResizing.Save(#"c:\myPhoto.jpg");
gives me 555kb 533x400 jpeg.
Why this photo is so heavy.
For photo jpeg 2111kb 2156x1571
I get 556kb 533x400 jpeg
Why in first case is so terrible !
http://img6.imageshack.us/img6/1127/photo1nz.jpg
http://img248.imageshack.us/img248/8063/photo2y.jpg

Looks like you aren't specifying the save format, it's likely coming out the other end as a bitmap.
Specify the format during the save: img.Save("C:\\foo.jpg", ImageFormat.Jpeg);

The compression of the JPEG image is decided when you save it, which is not included in the code that you show.
The default level of compression is pretty low, so you can set it to compress the image a bit more when you save it.

I think you'll find that in both cases you've converted larger jpegs into bitmap images.
Both bitmaps are 533x400 pixels and both have roughly the same file size 556kb.
If you want to resize the file size, you'll need to use a different format than a bitmap image.

Are you sure it is an JPEG, not some other file format with a JPEG file extension?
Set the JPEG quality lower.