Draw line on a dynamically created picturebox - c#

i need to draw a line for example, in a dynamically created PictureBox. What happens is that the picture box is created and shown in the form but the line is missing. My code is below, any ideas?? thnx
public void create_pb()
{
PictureBox pb = new PictureBox();
pb.Size = new Size(200, 200);
pb.BorderStyle = BorderStyle.Fixed3D;
pb.Location = new Point(0,0);
panel1.Controls.Add(pb);
g = pb.CreateGraphics();
Pen p = new Pen(Color.Black, 2);
g.DrawLine(p, 0, 0, 200, 200);
}
g is defined as public Graphics g;

Don't use CreateGraphics. You need to do your drawing in the Paint event handler instead, using e.Graphics from the event arguments passed to you.
Otherwise your line will simply be erased when the picture box is next repainted (e.g. when the form is moved, resized, covered by another form, etc).
Example:
pb.Paint += (sender, e) =>
{
Pen p = new Pen(Color.Black, 2);
e.Graphics.DrawLine(p, 0, 0, 200, 200);
};

Related

How to draw graph in c#

I'm new ,and I don't understand why this method when copied to windows forms doesn't do anything when running the program. I was copy it from MSDN page.
public void DrawLinesPoint(PaintEventArgs e)
{
// Create pen.
Pen pen = new Pen(Color.Black, 3);
// Create array of points that define lines to draw.
Point[] points =
{
new Point(10, 10),
new Point(10, 100),
new Point(200, 50),
new Point(250, 300)
};
//Draw lines to screen.
e.Graphics.DrawLines(pen, points);
}
Typically, when you draw on a form, you handle the form’s Paint event and perform the drawing using the Graphics property of the PaintEventArgs
In your code you need to add the DrawLinesPoint to the paint event before being able to use it
In your Constructor() add
InitializeComponent();
this.Paint += new System.Windows.Forms.PaintEventHandler(this.DrawLinesPoint);
And in your Paint PaintEventHandler
private void DrawLinesPoint(object sender, PaintEventArgs e)
{
Pen pen = new Pen(Color.Black, 3);
// Create array of points that define lines to draw.
Point[] points =
{
new Point(10, 10),
new Point(10, 100),
new Point(200, 50),
new Point(250, 300)
};
//Draw lines to screen.
e.Graphics.DrawLines(pen, points);
}

Draw on Image in Winforms

I am drawing a rectangle on a image which is within a picture box. The problem I have is that the rectangle is drawn behind the image. Please see the picture attached.
How can I draw on top of the image?
My on paint of the picture is as below. My paint is on my picturebox - I wonder if that is the problem ? but there is no paint on the image?
Rectangle ZoomRect1 = new Rectangle(Math.Min(ZoomToRectangleLeftButtonLocation.X, ZoomToRectangleCurrentButtonLocation.X),
Math.Min(ZoomToRectangleLeftButtonLocation.Y, ZoomToRectangleCurrentButtonLocation.Y),
Math.Abs(ZoomToRectangleLeftButtonLocation.X - ZoomToRectangleCurrentButtonLocation.X),
Math.Abs(ZoomToRectangleLeftButtonLocation.Y - ZoomToRectangleCurrentButtonLocation.Y));
Graphics g1 = e.Graphics;
Pen pen = new Pen(Color.Red, 2);
g1.DrawRectangle(pen, ZoomRect1);
pen.Dispose();
I believe you are using OnPaint method of the form ! Not the pictureBox and that's why the rectangle is in form.
To draw rec on PictureBox you have to do like :
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
Rectangle ee = new Rectangle(10, 10, 30, 30);
using (Pen pen = new Pen(Color.Red, 2))
{
e.Graphics.DrawRectangle(pen, ee);
}
}
And here the graphics e is for the pictureBox not the form itself.
EDIT
If the first answer didn't help : try this out.
Add this method where ever you want and call it
public void paintOnPictureBox()
{
Rectangle ee = new Rectangle(10, 10, 50, 50);
Graphics gr = Graphics.FromImage(pictureBox1.Image);
using (Pen pen = new Pen(Color.Green, 2))
{
gr.DrawRectangle(pen, ee);
}
}
DON'T FORGET : on pictureBox OnPaint event, add this line :
this.Refresh();
and the results :
EDIT 2 :
It's bad to add
this.Refresh();
in the onPaint method since it may cause other components to flickering. As it slows the form on showing and operating !
It's better to add it in the end of painting method like :
public void paintOnPictureBox()
{
Rectangle ee = new Rectangle(10, 10, 50, 50);
Graphics gr = Graphics.FromImage(pictureBox1.Image);
using (Pen pen = new Pen(Color.Green, 2))
{
gr.DrawRectangle(pen, ee);
}
this.Refresh();
}
I guess you are setting image source to control
Try to draw image, than rectangle
Graphics g1 = e.Graphics;
g1.DrawImage(...);
Pen pen = new Pen(Color.Red, 2);
g1.DrawRectangle(pen, ZoomRect1);
pen.Dispose();

Print Text with DrawString() next to an existing bitmap

Greetings fellow users,
A virgin post on my end since its the first time i am abusing stack overflow with a question! I have been trying to get a bitmap print along with a String to print. Basically the view i want to achieve is the Image and the text to the right of the image as we see the printout. Below is the code I am using
Bitmap qrCodeImage = qrCode.GetGraphic(20);
senderQR = qrCodeImage;
PrintDocument pd = new PrintDocument();
Margins margins = new Margins(10, 10, 10, 10);
pd.DefaultPageSettings.Margins = margins;
pd.PrintPage += PrintPage;
pd.Print();
Here is the PrintPage method
private void PrintPage(object sender, PrintPageEventArgs e)
{
System.Drawing.Image img = senderQR;
Bitmap batchCode = new Bitmap(80, 700);
Rectangle m = e.MarginBounds;
RectangleF batch1 = new RectangleF(80, 700, 650, 1000);
m.Width = img.Width / 5;
m.Height = img.Height / 5;
Graphics g = Graphics.FromImage(batchCode);
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;
g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBilinear;
g.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.HighQuality;
g.DrawString(batch, new Font("Arial", 40), Brushes.Black, batch1);
g.Flush();
e.Graphics.DrawImage(img, m);
}
What am i doing wrong? what seems to be the issue? I have been struggling a whole lot to achieve this but no luck!
Additional Notes:
I want the text on the right to Wrap under itself and not under or on top of the existing bitmap within a size of 3,5 x 2 (inches) (label printing).
This is the printout i get with the existing code;
https://prnt.sc/h1ecb0
https://prnt.sc/h1edex
The image you're drawing on (batchCode) is 80 pixels wide and 700 high. When you write your text over it, you set the top-left point of your writing to 80,700 - exactly to the bottom-right corner of your picture. Basically, you write your text outside of the picture.
Update
I've created a small example to make it reproducible, below is a form class for a basic WinForms application:
public partial class Form1 : Form
{
private PictureBox pictureBox2;
public Form1()
{
InitializeComponent();
pictureBox2 = new PictureBox();
pictureBox2.Size = ClientSize;
pictureBox2.SizeMode = PictureBoxSizeMode.AutoSize;
this.Click += Form1_Click;
pictureBox2.Click += Form1_Click;
Controls.Add(pictureBox2);
}
private void Form1_Click(object sender, EventArgs e)
{
var batch = "hello there!";
Bitmap batchCode = new Bitmap(1000, 1000);
var batch1 = new RectangleF(150, 150, 850, 850);
using (Graphics g = Graphics.FromImage(batchCode))
{
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;
g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBilinear;
g.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.HighQuality;
g.DrawString(batch, new Font("Arial", 40), Brushes.Black, batch1);
}
pictureBox2.Image = batchCode;
}
}

C# Non-rectangular pictureboxes

Is there a way to create non-rectangular pictureBoxes. I have round shapes that should overlap and if possible should be in different pictureboxes..
I tried the this here, but you could not see both pictureboxes that are overlapping at a time, but just one..
Here the picture that resulted from my tests:
You can make the PictureBoxes circular by adding an Ellipse to a GraphicsPath and then building a new Region from it.
Here's a quick example:
public class Target : PictureBox
{
public Target()
{
this.Size = new Size(100, 100);
this.Paint += Target_Paint;
Rectangle rc = this.ClientRectangle;
rc.Inflate(-10, -10);
System.Drawing.Drawing2D.GraphicsPath gp = new System.Drawing.Drawing2D.GraphicsPath();
gp.AddEllipse(rc);
this.Region = new Region(gp);
}
void Target_Paint(object sender, PaintEventArgs e)
{
Rectangle rc = this.ClientRectangle;
rc.Inflate(-10, -10);
using (Pen pen = new Pen(Color.Blue, 5))
{
e.Graphics.DrawEllipse(pen, rc);
}
rc = new Rectangle(new Point(this.Size.Width / 2, this.Size.Height / 2), new Size(1, 1));
rc.Inflate(9, 9);
e.Graphics.FillEllipse(Brushes.Red, rc);
}
}
After compiling, the new control appears at the top of your ToolBox.
Here's a screenshot with three of them overlapping each other:

Drawing to a new "layer" in C#

Building a little paint program and am trying to incorporate the concept of layers.
I'm using a PictureBox control to display the image, and getting the Graphics object from the image being displayed by the PictureBox and drawing to that.
My problem is I'm trying to figure out how to draw to a new Graphics object that is overlayed on top of the picture box, and be able to get the newly drawn image without the original image absorbed into the graphic.
If I do something like:
Graphics gr = Graphics.FromImage(myPictureBox.image);
gr.DrawRectangle(blah blah)
...I am editing the original image in the picture box. I want a way to only capture the new stuff being drawn as a separate image, but still have it displayed as an overlay over top of what was already there.
Anyone able to point me in the right direction? Thanks!
I would reckon to use the transparent control and do some modification so it can be used as image layers:
http://www.codeproject.com/Articles/26878/Making-Transparent-Controls-No-Flickering
Probably something like this (make any modification as necessary).
class LayerControl : UserControl
{
private Image image;
private Graphics graphics;
public LayerControl(int width, int height)
{
this.Width = width;
this.Height = height;
image = new Bitmap(width, height);
graphics = Graphics.FromImage(image);
// Set style for control
SetStyle(ControlStyles.OptimizedDoubleBuffer |
ControlStyles.AllPaintingInWmPaint |
ControlStyles.UserPaint, true);
}
// this function will draw your image
protected override void OnPaint(PaintEventArgs e)
{
var bitMap = new Bitmap(image);
// by default the background color for bitmap is white
// you can modify this to follow your image background
// or create a new Property so it can dynamically assigned
bitMap.MakeTransparent(Color.White);
image = bitMap;
Graphics g = e.Graphics;
g.SmoothingMode = SmoothingMode.AntiAlias;
g.PixelOffsetMode = PixelOffsetMode.HighQuality;
g.CompositingQuality = CompositingQuality.GammaCorrected;
float[][] mtxItens = {
new float[] {1,0,0,0,0},
new float[] {0,1,0,0,0},
new float[] {0,0,1,0,0},
new float[] {0,0,0,1,0},
new float[] {0,0,0,0,1}};
ColorMatrix colorMatrix = new ColorMatrix(mtxItens);
ImageAttributes imgAtb = new ImageAttributes();
imgAtb.SetColorMatrix(
colorMatrix,
ColorMatrixFlag.Default,
ColorAdjustType.Bitmap);
g.DrawImage(image,
ClientRectangle,
0.0f,
0.0f,
image.Width,
image.Height,
GraphicsUnit.Pixel,
imgAtb);
}
// this function will grab the background image to the control it self
protected override void OnPaintBackground(PaintEventArgs e)
{
base.OnPaintBackground(e);
Graphics g = e.Graphics;
if (Parent != null)
{
BackColor = Color.Transparent;
int index = Parent.Controls.GetChildIndex(this);
for (int i = Parent.Controls.Count - 1; i > index; i--)
{
Control c = Parent.Controls[i];
if (c.Bounds.IntersectsWith(Bounds) && c.Visible)
{
Bitmap bmp = new Bitmap(c.Width, c.Height, g);
c.DrawToBitmap(bmp, c.ClientRectangle);
g.TranslateTransform(c.Left - Left, c.Top - Top);
g.DrawImageUnscaled(bmp, Point.Empty);
g.TranslateTransform(Left - c.Left, Top - c.Top);
bmp.Dispose();
}
}
}
else
{
g.Clear(Parent.BackColor);
g.FillRectangle(new SolidBrush(Color.FromArgb(255, Color.Transparent)), this.ClientRectangle);
}
}
// simple drawing circle function
public void DrawCircles()
{
using (Brush b = new SolidBrush(Color.Red))
{
using (Pen p = new Pen(Color.Green, 3))
{
this.graphics.DrawEllipse(p, 25, 25, 20, 20);
}
}
}
// simple drawing rectable function
public void DrawRectangle()
{
using (Brush b = new SolidBrush(Color.Red))
{
using (Pen p = new Pen(Color.Red, 3))
{
this.graphics.DrawRectangle(p, 50, 50, 40, 40);
}
}
}
// Layer control image property
public Image Image
{
get
{
return image;
}
set
{
image = value;
// this will make the control to be redrawn
this.Invalidate();
}
}
}
Example how to use it:
LayerControl lc = new LayerControl(100, 100);
lc.Location = new Point(0, 0);
lc.DrawRectangle();
LayerControl lc2 = new LayerControl(100, 100);
lc2.Location = new Point(0, 0);
lc2.DrawCircles();
LayerControl lc3 = new LayerControl(100, 100);
lc3.Location = new Point(0, 0);
lc3.Image = new Bitmap(#"<Image Path>");
// adding control
this.Controls.Add(dc);
this.Controls.Add(dc2);
this.Controls.Add(dc3);
With this method you can have multiple layers that can put overlapping each other (due to the transparency feature it has).
If you want to add it in top of your PictureBox make sure to re-order the control. The Layer Control should be added before your PictureBox control.
// adding control
this.Controls.Clear();
this.Controls.Add(dc);
this.Controls.Add(dc2);
this.Controls.Add(dc3);
this.Controls.Add(PictureBox1);
Hopefully it help.
example code which working fine - take dummy image and layered the original image with custom text
public void LayerImage(System.Drawing.Image Current, int LayerOpacity)
{
Bitmap bitmap = new Bitmap(Current);
int h = bitmap.Height;
int w = bitmap.Width;
Bitmap backg = new Bitmap(w, h + 20);
Graphics g = null;
try
{
g = Graphics.FromImage(backg);
g.Clear(Color.White);
Font font = new Font("Arial", 12, FontStyle.Bold, GraphicsUnit.Pixel);
RectangleF rectf = new RectangleF(70, 90, 90, 50);
Color color = Color.FromArgb(255, 128, 128, 128);
Point atpoint = new Point(backg.Width / 2, backg.Height - 10);
SolidBrush brush = new SolidBrush(color);
StringFormat sf = new StringFormat();
sf.Alignment = StringAlignment.Center;
sf.LineAlignment = StringAlignment.Center;
g.DrawString("BRAND AMBASSADOR", font, brush, atpoint, sf);
g.Dispose();
MemoryStream m = new MemoryStream();
backg.Save(m, System.Drawing.Imaging.ImageFormat.Jpeg);
}
catch { }
Color pixel = new Color();
for (int x = 0; x < bitmap.Width; x++)
{
for (int y = 0; y < bitmap.Height; y++)
{
pixel = bitmap.GetPixel(x, y);
backg.SetPixel(x, y, Color.FromArgb(LayerOpacity, pixel));
}
}
MemoryStream m1 = new MemoryStream();
backg.Save(m1, System.Drawing.Imaging.ImageFormat.Jpeg);
m1.WriteTo(Response.OutputStream);
m1.Dispose();
base.Dispose();
}
Got it working, perhaps I wasn't clear enough in my original question.
Essentially what I ended up doing was storing each layer as a separate Image object, then just hooking into the OnPaint method of my control and manually drawing the graphics in order, instead of just drawing to PictureBox.Image. Works like a charm!
The graphics capabilities of .NET drawing libraries are simple. Their main purpose is direct drawing of GUI. If you want to have layering, alpha transparency or advanced filters, then you should either use 3rd party library or roll your own drawing code.

Categories