Develop Reference

Resizing a resized bitmap image back to original size in WinForms

I have a PNG image of resolution 6000x4000, on which I have to draw upon. So I load the image into a pictureBox with of size 1280x800. After drawing on it, I need to save the PNG image in its original resolution of 6000x4000. So I reload it into a new bitmap of size 6000x4000 using
btm = new Bitmap(6000, 4000);
image = Graphics.FromImage(btm);
g.DrawImage(btm, Point.Empty);
And save it using
btm.Save(filePath, System.Drawing.Imaging.ImageFormat.Png);
Now I end up with the a white background png image of resolution 6000x4000 but with the edited image of 1280x800 on it like this Saved Image
How do I resize the image back to its original (6000x4000) size. Thank you.
Also please find my codebelow
private void drawImage(string imgLocation)
{
Bitmap b = new Bitmap(imgLocation);
////test
pictureBox1.Height = 800;
pictureBox1.Width = 1280;
g = pictureBox1.CreateGraphics();
btm = new Bitmap(6000, 4000);
image = Graphics.FromImage(btm);
image.CompositingMode = CompositingMode.SourceCopy;
image.CompositingQuality = CompositingQuality.HighQuality;
image.InterpolationMode = InterpolationMode.HighQualityBicubic;
image.SmoothingMode = SmoothingMode.HighQuality;
image.PixelOffsetMode = PixelOffsetMode.HighQuality;
image.Clear(Color.White);
image.DrawImage(b, new Rectangle(0, 0, pictureBox1.Width, pictureBox1.Height));
//image.DrawImage(btm, new Rectangle(0, 0, pictureBox1.Width, pictureBox1.Height));
g.SmoothingMode = SmoothingMode.HighQuality;
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
g.PixelOffsetMode = PixelOffsetMode.HighQuality;
//g.DrawImage(btm, Point.Empty);
g.DrawImage(btm, new Rectangle(0, 0, 6000,4000) );
}

What about this? g.DrawImage(btm, new Rectangle(0,0,6000,4000));

Below is a method that may help you with images upscaling/downscaling.
Note though that big upscaling ratio will cause serious image distortions in any case.
You may also try to play with other then graphics.CompositingMode properties like graphics.CompositingQuality
You will need following usings:
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Drawing.Imaging;
The method works fine in my app.
public static Image ImageResize(Image img, int width, int height)
{
var tgtRect = new Rectangle(0, 0, width, height);
var tgtImg = new Bitmap(width, height);
tgtImg.SetResolution(img.HorizontalResolution, img.VerticalResolution);
using (var graphics = Graphics.FromImage(tgtImg))
{
graphics.CompositingMode = CompositingMode.SourceCopy;
using (var wrapMode = new ImageAttributes())
{
wrapMode.SetWrapMode(WrapMode.TileFlipXY);
graphics.DrawImage(img, tgtRect, 0, 0, img.Width, img.Height, GraphicsUnit.Pixel, wrapMode);
}
return tgtImg;
}
}

c# when crop an image black border appear

Sorry for my English. I'm trying to crop an image after dragging. It works but my problem is, black bold borders appears on cropped image. I don't know how to solve it.
Here is my code:
using (Bitmap sourceBitmap = new Bitmap(fullSizeImage))
{
Rectangle cropRect = new Rectangle(0, 0, sourceWidth, sourceHeight);
using (Bitmap newBitMap = new Bitmap(cropRect.Width, cropRect.Height))
{
using (Graphics g = Graphics.FromImage(newBitMap))
{
g.SmoothingMode = SmoothingMode.HighQuality;
g.PixelOffsetMode = PixelOffsetMode.HighQuality;
g.CompositingQuality = CompositingQuality.HighQuality;
g.CompositingMode = CompositingMode.SourceCopy;
g.DrawImage(sourceBitmap, new Rectangle(0, pp, sourceWidth, sourceHeight), cropRect, GraphicsUnit.Pixel);
g.InterpolationMode = InterpolationMode.HighQualityBicubic;
ImageCodecInfo codec = ImageCodecInfo.GetImageEncoders()[4];
EncoderParameters parameters = new EncoderParameters(1);
parameters.Param[0] = new EncoderParameter(System.Drawing.Imaging.Encoder.Quality, 100L);
newBitMap.Save(filePath);
}
}
}
And here is cropped image:

Your destination image is the same physical size, because you use the same physical dimensions to create it:
Rectangle cropRect = new Rectangle(0, 0, sourceWidth, sourceHeight);
When you draw the original image into this new bitmap, you draw it with an offset pp, but still with the same height and width (so you're only cropping the bottom and right). This offset "colours" the memory of the new bitmap only from that y-coordinate downwards, and hence you have the black border.

Overlap one image as transparent on another in c#

I'm creating Heatmap depending on the gazed areas of a given image. I can create the heatmap and save it to my desktop as a new file. But I want to create another image, which is made of the heatmap and the image which was gazed to collect the eye tracking data. I want the original picture to be the solid background, and then overlap (or overlay I don't know) the heatmap as transparent, and merge them into one new file. Is there a way to do it in c#?
Thank you

Ok i found an answer,
first I resize my background picture
public static Bitmap ResizeImage(Bitmap image, int width, int height)
{
var destRect = new Rectangle(0, 0, width, height);
var destImage = new Bitmap(width, height);
destImage.SetResolution(image.HorizontalResolution, image.VerticalResolution);
using (var graphics = Graphics.FromImage(destImage))
{
graphics.CompositingMode = CompositingMode.SourceCopy;
graphics.CompositingQuality = CompositingQuality.HighQuality;
graphics.InterpolationMode = InterpolationMode.HighQualityBicubic;
graphics.SmoothingMode = SmoothingMode.HighQuality;
graphics.PixelOffsetMode = PixelOffsetMode.HighQuality;
using (var wrapMode = new ImageAttributes())
{
wrapMode.SetWrapMode(WrapMode.TileFlipXY);
graphics.DrawImage(image, destRect, 0, 0, image.Width, image.Height, GraphicsUnit.Pixel, wrapMode);
}
}
return destImage;
}
after that the heatmap must be set to another opacity level, in order to make background visible
public static Image SetImageOpacity(Image image, float opacity)
{
try
{
//create a Bitmap the size of the image provided
Bitmap bmp = new Bitmap(image.Width, image.Height);
//create a graphics object from the image
using (Graphics gfx = Graphics.FromImage(bmp))
{
//create a color matrix object
ColorMatrix matrix = new ColorMatrix();
//set the opacity
matrix.Matrix33 = opacity;
//create image attributes
ImageAttributes attributes = new ImageAttributes();
//set the color(opacity) of the image
attributes.SetColorMatrix(matrix, ColorMatrixFlag.Default, ColorAdjustType.Bitmap);
//now draw the image
gfx.DrawImage(image, new Rectangle(0, 0, bmp.Width, bmp.Height), 0, 0, image.Width, image.Height, GraphicsUnit.Pixel, attributes);
}
return bmp;
}
catch (Exception ex)
{
//MessageBox.Show(ex.Message);
throw ex;
//return null;
}
}
finally we need to merge those two
public static Image Overlap(Image source1, Image source2)
{
var target = new Bitmap(source1.Width, source1.Height, PixelFormat.Format32bppArgb);
var graphics = Graphics.FromImage(target);
graphics.CompositingMode = CompositingMode.SourceOver; // this is the default, but just to be clear
graphics.DrawImage(source1, 0, 0);
graphics.DrawImage(source2, 0, 0);
return target;
}
here is my background:
original RTE
and here is the merged version, with the heatmap of the eyetracking data
RTE + heatmap

Adding Height to Image for Subtitle

i want to add an additonal height to an Image to give it a subtitle.
I do not want to "compres" or resize my original image.
I want to keep it's size and add +40 px to its height on bottom and add a text like this example
The red part is the original image.
The blue part is my addition.
I tried this code but my text appears "outside" the image i think.
Image image = Image.FromFile("D:\\my_sample_image.jpg");
// Create graphics from image
Graphics graphics = Graphics.FromImage(image);
// Create font
Font font = new Font("Times New Roman", 42.0f);
// Create text position
PointF point = new PointF(150, image.Height+40);
// Draw text
graphics.DrawString("Watermark", font, Brushes.Red, point);
// Save image
image.Save("D:\\my_sample_output.jpg");
MessageBox.Show("FINISHED");
// Open generated image file in default image viewer installed in Windows
Process.Start("D:\\my_sample_output.jpg");

Make a new Bitmap, create a Graphics out of it, then draw the old image with room for text at the bottom.
Bitmap image = new Bitmap("path/resource");
Bitmap newImage = new Bitmap(image.Width, image.Height + 40);
using (Graphics g = Graphics.FromImage(newImage))
{
// Draw base image
Rectangle rect = new Rectangle(0, 0, image.Width, image.Height);
g.DrawImageUnscaledAndClipped(image, rect);
//Fill undrawn area
g.FillRectangle(new SolidBrush(Color.Black), 0, image.Height, newImage.Width, 40);
// Create font
Font font = new Font("Times New Roman", 22.0f);
// Create text position (play with positioning)
PointF point = new PointF(0, image.Height);
// Draw text
g.DrawString("Watermark", font, Brushes.Red, point);
}

public Image addSubtitleToImage(string path, int height, string title)
{
Bitmap image = new Bitmap(path);
Bitmap newImage = new Bitmap(image.Width, image.Height + height);
using (Graphics g = Graphics.FromImage(newImage))
{
g.FillRectangle(new SolidBrush(Color.Black), new Rectangle(0, 0, newImage.Width, newImage.Height));
g.DrawImage(image, new Rectangle(0, 0, image.Width, image.Height));
Font font = new Font("Tahoma", 30.0f);
g.DrawString(title, font, Brushes.White, new PointF(image.Width/2 , image.Height+));
}
return newImage;
}

RadioButtonRenderer with Transparent Background

I have a situation where I need to render a radio button to an System.Drawing.Image.
System.Drawing.Bitmap bitmap = new System.Drawing.Bitmap(20,16);
using (System.Drawing.Graphics g = System.Drawing.Graphics.FromImage(bitmap))
{
RadioButtonRenderer.DrawRadioButton(g, new Point(2, 2), RadioButtonState.CheckedPressed);
}
return System.Drawing.Image.FromHbitmap(bitmap.GetHbitmap());
This works except that it's drawing the default control-grey as the background. How can I set this the background color to Transparent?

Not sure how your button looks exactly, but using the Bitmap.MakeTransparent Method with the grey color should work.
If it is not to your liking, you can try more complex color transformation using the ColorMatrix Class:
ColorMatrix matrix = new ColorMatrix();
// This will change the image's opacity.
matrix.Matrix33 = 0.5f;
ImageAttributes imgAttrs = new ImageAttributes();
imgAttrs.SetColorMatrix(matrix, ColorMatrixFlag.Default, ColorAdjustType.Bitmap);
g.DrawImage(img, new Rectangle(0, 0, 50, 50), 0, 0, 50, 50, GraphicsUnit.Pixel, imgAttrs);