Custom Control to show an Image: move the image inside - c#

I'm developing and C# app for Windows Mobile. I have a custom control with OnPaint overrided to draw an image that the user moves with the pointer. My own OnPaint method is this:
protected override void OnPaint(PaintEventArgs e)
{
Graphics gxOff; //Offscreen graphics
Brush backBrush;
if (m_bmpOffscreen == null) //Bitmap for doublebuffering
{
m_bmpOffscreen = new Bitmap(ClientSize.Width, ClientSize.Height);
}
gxOff = Graphics.FromImage(m_bmpOffscreen);
gxOff.Clear(Color.White);
backBrush = new SolidBrush(Color.White);
gxOff.FillRectangle(backBrush, this.ClientRectangle);
//Draw some bitmap
gxOff.DrawImage(imageToShow, 0, 0, rectImageToShow, GraphicsUnit.Pixel);
//Draw from the memory bitmap
e.Graphics.DrawImage(m_bmpOffscreen, this.Left, this.Top);
base.OnPaint(e);
}
The imageToShow it's the image.
The rectImageToShow it's initialized on event OnResize in this way:
rectImageToShow =
new Rectangle(0, 0, this.ClientSize.Width, this.ClientSize.Height);
this.Top and this.Left are the topLeft corner to draw the image inside the custom control.
I think it'll work fine but when I move the image it never clean all the control. I always see a part of the previous drawing.
What I'm doing wrong?
Thank you!

I think you have not cleared the Control's image buffer. You have only cleared the back buffer. Try this between the 2 DrawImage calls:
e.Graphics.Clear(Color.White);
This should clear any leftover image first.
Alternatively, you can rewrite it so everything is painted on to the back buffer and the back buffer is then paint onto the screen at exactly (0, 0) so any problems will be because of the back buffer drawing logic instead of somewhere in between.
Something like this:
Graphics gxOff; //Offscreen graphics
Brush backBrush;
if (m_bmpOffscreen == null) //Bitmap for doublebuffering
{
m_bmpOffscreen = new Bitmap(ClientSize.Width, ClientSize.Height);
}
// draw back buffer
gxOff = Graphics.FromImage(m_bmpOffscreen);
gxOff.Clear(Color.White);
backBrush = new SolidBrush(Color.White);
gxOff.FillRectangle(backBrush, this.Left, this.Top,
this.ClientRectangle.Width,
this.ClientRectangle.Height);
//Draw some bitmap
gxOff.DrawImage(imageToShow, this.Left, this.Top, rectImageToShow, GraphicsUnit.Pixel);
//Draw from the memory bitmap
e.Graphics.DrawImage(m_bmpOffscreen, 0, 0);
base.OnPaint(e);
Not sure if that is correct, but you should get the idea.

Related

split image to multiple image from the bottom up

I have a picture I want to print, but it's too big for one page
so i have decided to split it into multiple images
i have tried a method, but now im using this (Talha Irfan answer)
i also tried the other solutions there but those didnt worked as well
(ex. bm.Clone(rec, bm.PixelFormat);)
and here's my code(this is on non-form class)
Bitmap bm = new Bitmap(frmPrint.Width, frmPrint.Height);
Rectangle rec = new Rectangle(0, 200, 576, 300);
Bitmap bitmap = cropImg(bm, rec);
frmPrint.DrawToBitmap(bitmap, rec);
frmPrint._img = bitmap;
frmPrint.setImage();
and setImage function(on some form)
public void setImage()
{
pictureBox3.BackgroundImage = _img;
this.ShowDialog();
}
and cropImg is the same as cropAtRect
the below shows the original image (on the left)
the wanted result in the blue rectangle
and the actual result on the right
PS
my actual image size is (height = 698, wifht = 576)
Edit - as suggested below
on non-form class
Rectangle cropRect = new Rectangle(0, 0, 576, 698);
Bitmap target = new Bitmap(cropRect.Width, cropRect.Height, bm.PixelFormat);
frmPrint.setImage(bm, target, cropRect);
target.Dispose();
at form class
public void setImage(Bitmap src, Bitmap target, Rectangle cropRect)
{
pictureBox3.Visible = false;
using (Graphics g = Graphics.FromImage(target))
{
g.DrawImage(src, new Rectangle(pictureBox3.Location.X, pictureBox3.Location.Y, target.Width, target.Height),
cropRect,
GraphicsUnit.Pixel);
}
this.ShowDialog();
}
Control.DrawToBitmap will always try to draw the whole control or form and will always start at the top. The parameter:
targetBounds
Type: System.Drawing.Rectangle
The bounds within which the control is rendered.
as the name implies, sets the target, not the source rectangle. Hence the white space above your result.
Move the line before cropping with a rectangle that holds the full area, maybe like this:
DrawToBitmap(bm, ClientRectangle);
and then crop the lower part as before..
Note that the cropping trick from your link will not work for DrawToBitmap; using a rectangle with a negative offset will cause a parameter exception.
Btw: to safely dispose of a Bitmap in a PictureBox use this:
Bitmap dummy = (Bitmap )somePictureBox.Image;
somePictureBox.Image = null;
if (dummy != null) dummy.Dispose;
And, indeed, the answer by ChrisJJ in the link leaks the Graphics object.
Update:
Since you seem to have lost control over the various changes and suggestions, here is the minimal code change from the original post:
Bitmap bm = new Bitmap(frmPrint.ClientWidth, frmPrint.ClientHeight);
DrawToBitmap(bm, frmPrint.ClientRectangle);
Rectangle rec = new Rectangle(0, 200, 576, 300);
Bitmap bitmap = cropImg(bm, rec);
frmPrint._img = bitmap;
frmPrint.setImage();
With:
public void setImage()
{
Bitmap dummy = pictureBox3.BackgroundImage;
pictureBox3.BackgroundImage = null;
if (dummy != bnull) dummy.Dispose();
pictureBox3.BackgroundImage = _img;
this.ShowDialog();
}
In the cropImg function add a g.Dispose before returning.

Bitmap C# - Drawing a line [duplicate]

There is only one picturebox in my form and I want to drawcircle with a method on this picturebox but I cant do that and not working.The method is:
private Bitmap Circle()
{
Bitmap bmp;
Graphics gfx;
SolidBrush firca_dis=new SolidBrush(Color.FromArgb(192,0,192));
bmp = new Bitmap(40, 40);
gfx = Graphics.FromImage(bmp);
gfx.FillRectangle(firca_dis, 0, 0, 40, 40);
return bmp;
}
Picturebox
private void pictureBox2_Paint(object sender, PaintEventArgs e)
{
Graphics gfx= Graphics.FromImage(Circle());
gfx=e.Graphics;
}
You need to decide what you want to do:
Draw into the Image or
draw onto the Control?
Your code is a mix of both, which is why it doesn't work.
Here is how to draw onto the Control:
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
e.Graphics.DrawEllipse(Pens.Red, new Rectangle(3, 4, 44, 44));
..
}
Here is how to draw into the Image of the PictureBox:
void drawIntoImage()
{
using (Graphics G = Graphics.FromImage(pictureBox1.Image))
{
G.DrawEllipse(Pens.Orange, new Rectangle(13, 14, 44, 44));
..
}
// when done with all drawing you can enforce the display update by calling:
pictureBox1.Refresh();
}
Both ways to draw are persistent. The latter changes to pixels of the Image, the former doesn't.
So if the pixels are drawn into the Image and you zoom, stretch or shift the Image the pixel will go with it. Pixels drawn onto the Top of the PictureBox control won't do that!
Of course for both ways to draw, you can alter all the usual parts like the drawing command, maybe add a FillEllipse before the DrawEllipse, the Pens and Brushes with their Brush type and Colors and the dimensions.
private static void DrawCircle(Graphics gfx)
{
SolidBrush firca_dis = new SolidBrush(Color.FromArgb(192, 0, 192));
Rectangle rec = new Rectangle(0, 0, 40, 40); //Size and location of the Circle
gfx.FillEllipse(firca_dis, rec); //Draw a Circle and fill it
gfx.DrawEllipse(new Pen(firca_dis), rec); //draw a the border of the cicle your choice
}

Bufferedgraphics change background to black c#

I try to do double buffer using BufferedGraphics. When i use BufferedGraphics.Render method background of my image changes to black. Here the simple code, that illustrate my issue
public partial class Form1 : Form {
public Form1() {
InitializeComponent();
this.Load += Form1_Load;
}
private void Form1_Load(object sender, EventArgs e) {
Paint += new PaintEventHandler(Form1_Paint);
}
private void print(Bitmap image, PaintEventArgs e) {
Graphics graphicsObj = e.Graphics;
graphicsObj.DrawImage(image, 60, 10);
graphicsObj.Dispose();
}
private void Form1_Paint(object sender, PaintEventArgs e) {
Rectangle rect = Screen.PrimaryScreen.Bounds;
PixelFormat pf;
pf = PixelFormat.Format32bppArgb;
Bitmap image = new Bitmap(rect.Width, rect.Height, pf);
Graphics g = Graphics.FromImage(image);
g.Clear(Color.Orange);
BufferedGraphicsContext context = new BufferedGraphicsContext();
BufferedGraphics buffer = context.Allocate(g, new Rectangle(0, 0, rect.Width + 20, rect.Height + 20));
buffer.Render(g);
print(image, e);
}
}
I expect to see orange rectangle on my screen, but it's black. I can't understand why this happen. Help me please :)
buffer.Render(g) renders the contents of the buffer to the graphics object. This means that the orange color is being overwritten by the empty buffer.
You'll have to choose between using BufferedGraphicsContext or creating a buffer yourself (the image).
The following would fix your issue using just the image:
...
Bitmap image = new Bitmap(rect.Width, rect.Height, pf);
using (Graphics g = Graphics.FromImage(image))
{
g.Clear(Color.Orange);
}
print(image, e);
You could also still use BufferedGraphicsContext, but you'd have to write the image to its Graphics property:
print(image, buffer.Graphics); // render your image to the buffer
buffer.Render(e.Graphics); // render the buffer to the paint event graphics
By the way, don't Dispose the graphics object provided by Form1_Paint (you currently do that in the print() method.
As a response to your comment, BufferedGraphicsContext seems to not support transparency when rendering it to the "main" graphics object, but you can draw transparent images to it correctly. The following example shows how the buffer is filled with a red color, and then a transparent image with a blue line is drawn to it:
protected override void OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
using (BufferedGraphicsContext context = new BufferedGraphicsContext())
using (BufferedGraphics buffer = context.Allocate(e.Graphics, new Rectangle(0, 0, 120, 120)))
{
// Create a bitmap with just a blue line on it
Bitmap bmp = new Bitmap(100, 100, PixelFormat.Format32bppArgb);
using (Graphics g = Graphics.FromImage(bmp))
{
g.DrawLine(Pens.Blue, 0, 0, 100, 100);
}
// Fill a red square
buffer.Graphics.FillRectangle(Brushes.Red, 5, 5, 110, 110);
// Draw the blue-line image over the red square area
buffer.Graphics.DrawImage(bmp, 10, 10);
// Render the buffer to the underlying graphics
buffer.Render(e.Graphics);
}
}
In the result you can clearly see the blue line from the image over the red color in the background buffer (the red background is not overwritten) and there's a black border around the red rectangle where no background pixels where drawn.

Generated Bitmap Displays Weirdly in PictureBox

I cannot seem to programmatically create a colored bitmap to display in a PictureBox. The bitmap saves normally as a file, but is faded at the edges when displayed in a PictureBox. Here is simplified code used to create and display the Bitmap (in actual code, the bitmap generation is completely separate from the form, so forcing the bitmap size to match the picturebox size isn't possible):
Bitmap Bmp = new Bitmap(4, 4, System.Drawing.Imaging.PixelFormat.Format24bppRgb);
using (Graphics gfx = Graphics.FromImage(Bmp))
using (SolidBrush brush = new SolidBrush(Color.BlueViolet))
{
gfx.FillRectangle(brush, 0, 0, 4, 4);
}
Then set the Image value on a PictureBox to the generated Bitmap:
pictureBox1.Image = Bmp;
Here is the resulting bitmap displayed in a 300x300 picturebox:
How do I set the Image on the PictureBox so that it displays the colored bitmap properly (full solid)?
EDIT: I am restricted to generating smaller source bitmaps, so upscaling into a PictureBox is unavoidable. The problem appears when the generated source bitmap is 4px or 100px square, so I believe these are relevant cases.
EDIT: The PictureBox scaling should be set to stretch or zoom for the issue to manifest. In this example case the 4x4 source bitmap is stretched to 300x300.
EDIT: The basic problem is PictureBox's inability to upscale small bitmaps into large controls. This is confusing because the Bitmap upscales nicely into a PictureBox.Background image. Unless you have a magic bullet that will fix the image upscaling problem, I think it might be best to go for clear and simple workarounds in your answer.
You are generating a 4x4 bitmap and it's being stretched. Specify the size to match the picture box instead:
int width = pictureBox1.Width;
int height = pictureBox1.Height;
var Bmp = new Bitmap(width, height, System.Drawing.Imaging.PixelFormat.Format24bppRgb);
using (Graphics gfx = Graphics.FromImage(Bmp))
using (var brush = new SolidBrush(Color.BlueViolet))
{
gfx.FillRectangle(brush, 0, 0, width, height);
}
pictureBox1.Image = Bmp;
You will need to turn anti-aliasing off. Also, since you are using one color for the whole picturebox, why not make the bitmap 1x1? If you need it 4x4, change the int the top of the example from 1 to 4.
int hw = 1;
Bitmap Bmp = new Bitmap(hw, hw,
System.Drawing.Imaging.PixelFormat.Format24bppRgb);
using (Graphics gfx = Graphics.FromImage(Bmp))
{
// Turn off anti-aliasing and draw an exact copy
gfx.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.None;
gfx.CompositingMode = System.Drawing.Drawing2D.CompositingMode.SourceCopy;
using (SolidBrush brush = new SolidBrush(Color.BlueViolet))
{
gfx.FillRectangle(brush, 0, 0, hw, hw);
}
}
pictureBox1.Image = Bmp;
UPDATE
Since you are still having the same issue by setting the picturebox to the image, you will have to get the graphics object from the picturebox and draw directly on it.
The code is very similar.
using (Graphics gfx = Graphics.FromImage(pictureBox1.Image))
{
// Turn off anti-aliasing and draw an exact copy
gfx.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.None;
gfx.CompositingMode = System.Drawing.Drawing2D.CompositingMode.SourceCopy;
using (SolidBrush brush = new SolidBrush(Color.BlueViolet))
{
gfx.FillRectangle(brush, 0, 0,
pictureBox11.Width - 1,
pictureBox11.Height - 1);
}
}
// Force the picturebox to redraw with the new image.
// You could also use pictureBox11.Refresh() to do the redraw.
pictureBox11.Invalidate();
I tried to test your code and the image were properly displayed.
But when i used this code:
Rectangle srcRect = New Rectangle(0, 0, Bmp.Width, Bmp.Height);
Rectangle dstRect = New Rectangle(0, 0, PictureBox1.Width, PictureBox1.Height);
g = PictureBox1.CreateGraphics;
g.DrawImage(Bmp, dstRect, srcRect, GraphicsUnit.Pixel);
g.Dispose();
I did get exactly your result. In order to fix it:
Rectangle srcRect = New Rectangle(0, 0, Bmp.Width - 1, Bmp.Height - 1);
Rectangle dstRect = New Rectangle(0, 0, PictureBox1.Width, PictureBox1.Height);
g = PictureBox1.CreateGraphics;
g.DrawImage(Bmp, dstRect, srcRect, GraphicsUnit.Pixel);
g.Dispose();
Edit:
So you have the bitmap and you want to stretch it. And the bitmap has ane solid color. Do this insted:
Color pixelColor = Bmp.GetPixel(0, 0);
PictureBox1.BackColor = pixelColor;
valter

Save non-transparent image from a PictureBox with transparent images

I have a PictureBox with lots of transparent png's drawn into...
Now I'd like to save the content of this PictureBox to a file, but without the transparency.
How can I do this?
I have already tried to remove transparency from the Image like this, but it didn't work, I still got a transparent image after the save.
...
removeTransparency(pictureBox.Image).Save(saveFileDialog.FileName);
private Bitmap removeTransparency(Image transparentImage)
{
Bitmap src = new Bitmap(transparentImage);
Bitmap newImage = new Bitmap(src.Size.Width, src.Size.Height);
Graphics g = Graphics.FromImage(newImage);
g.DrawRectangle(new Pen(new SolidBrush(Color.White)), 0, 0, newImage.Width, newImage.Height);
g.DrawImage(src, 0, 0);
return newImage;
}
You may cycle through all pixel (please not using GetPixel/SetPixel) to change the color or you may create another bitmap with the same size, create a graphics context from the image, clear the image with your favorite background color and then draw your image on it (so transparent pixels simply will be replaced by the background color).
Example
Did you do something like this?
public static Bitmap Repaint(Bitmap source, Color backgroundColor)
{
Bitmap result = new Bitmap(source.Width, source.Height, PixelFormat.Format32bppArgb);
using (Graphics g = Graphics.FromImage(result))
{
g.Clear(backgroundColor);
g.DrawImage(source, new Rectangle(0, 0, source.Width, source.Height));
}
return result;
}

Categories

Resources