We Keep Coding

Keep Picturebox Image While Painting on top of it

In my form, I have a picturebox. I wanted to be able to draw arrows on top of an image. I managed to get halfway there. On the Form load event, I assign an image to the picturebox. I'm able to create arrows with the code below. The problem is every time I create the arrow the picture I assigned on my form load event gets erased. Why does my image get erased? How do I maintain my image that I assigned on form load while drawing arrows on top of it?
private bool isMoving = false;
private Point mouseDownPosition = Point.Empty;
private Point mouseMovePosition = Point.Empty;
private List<Tuple<Point, Point>> lines = new List<Tuple<Point, Point>>();
Pen _Pen;
private void Test_Load(object sender, EventArgs e)
{
pictureBox1.Image = Properties.Resources.background;
}
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
if (isMoving)
{
if (pictureBox1.Image == null)
{
Bitmap bmp = new Bitmap(pictureBox1.Width, pictureBox1.Height);
using (Graphics g = Graphics.FromImage(bmp))
{
g.Clear(Color.White);
}
pictureBox1.Image = bmp;
}
using (Graphics g = Graphics.FromImage(pictureBox1.Image))
{
g.Clear(pictureBox1.BackColor);
AdjustableArrowCap bigArrow = new AdjustableArrowCap(5, 5);
_Pen = new Pen(Color.IndianRed, 3);
_Pen.CustomEndCap = bigArrow;
g.DrawLine(_Pen, mouseDownPosition, mouseMovePosition);
_Pen.Dispose();
}
}
}
private void pictureBox1_MouseDown(object sender, MouseEventArgs e)
{
isMoving = true;
mouseDownPosition = e.Location;
}
private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
{
if (isMoving)
{
mouseMovePosition = e.Location;
pictureBox1.Invalidate();
}
}
private void pictureBox1_MouseUp(object sender, MouseEventArgs e)
{
if (isMoving)
{
lines.Add(Tuple.Create(mouseDownPosition, mouseMovePosition));
}
isMoving = false;
}
I think the problem is with this line here g.Clear(pictureBox1.BackColor);

Yes, problem is with this line here g.Clear(pictureBox1.BackColor); You erase entire the control area before you draw the line.
You should draw to e.Graphics directly:
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
if (isMoving)
{
if (pictureBox1.Image == null) e.Graphics.Clear(Color.White);
// Add this line for high quality drawing:
e.Graphics.SmoothingMode = SmoothingMode.HighQuality;
AdjustableArrowCap bigArrow = new AdjustableArrowCap(5, 5);
_Pen = new Pen(Color.IndianRed, 3);
_Pen.CustomEndCap = bigArrow;
e.Graphics.DrawLine(_Pen, mouseDownPosition, mouseMovePosition);
_Pen.Dispose();
}
}

C#, How do i save picture using savefiledialog for paint-like program

I've tried many methods including bitmap converting and etc.
Here's my code. Would love it someone will explain to me how to save it and why. Thanks!
public partial class Form1 : Form
{
Graphics G;
Pen myPen = new Pen(Color.Black);
Point sp = new Point(0, 0);
Point ep = new Point(0, 0);
int ctrl = 0;
public Form1()
{
InitializeComponent();
}
private void panel1_Paint(object sender, PaintEventArgs e)
{
}
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
sp = e.Location;
if(e.Button == MouseButtons.Left)
{
ctrl = 1;
}
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
ctrl = 0;
}
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if(ctrl == 1)
{
ep = e.Location;
G = panel1.CreateGraphics();
G.DrawLine(myPen, sp, ep);
}
sp = ep;
}
private void button1_Click(object sender, EventArgs e)
{
colorDialog1.ShowDialog();
myPen.Color = colorDialog1.Color;
colourBtn.BackColor = colorDialog1.Color;
}
private void clrBtn_Click(object sender, EventArgs e)
{
G.Clear(colorDialog2.Color);
}
private void button1_Click_1(object sender, EventArgs e)
{
colorDialog2.ShowDialog();
panel1.BackColor = colorDialog2.Color;
panel1Colourbtn.BackColor = colorDialog2.Color;
}
private void button1_Click_2(object sender, EventArgs e)
{
SaveFileDialog dlgSave = new SaveFileDialog();
dlgSave.Title = "Save Image";
dlgSave.Filter = "Bitmap Images (*.bmp)|*.bmp|All Files (*.*)|*.*";
if (dlgSave.ShowDialog(this) == DialogResult.OK)
{
using (Bitmap bmp = new Bitmap(panel1.Width, panel1.Height))
{
// how do i save my drawing using savefiledialog?
}
}
}

After you edited your question I suggest to do the following:
create a Bitmap member in your Form with the same dimensions as the panel
create the Graphics G from that bitmap
in your panel1_MouseMove draw on that Graphics (effectivly drawing into the bitmp`
in your panel1_Paint draw that bitmap on the panel and
in your button1_Click_2 save that bitmap:
Code example:
public partial class Form1 : Form
{
Bitmap bmp;
Graphics G;
Pen myPen = new Pen(Color.Black);
Point sp = new Point(0, 0);
Point ep = new Point(0, 0);
int ctrl = 0;
public Form1()
{
InitializeComponent();
// create bitmap
bmp = new Bitmap(panel1.Width, panel1.Height);
// create Graphics
G = Graphics.FromImage(bmp);
G.Clear(Color.Black);
// redraw panel
panel1.Invalidate();
}
private void panel1_Paint(object sender, PaintEventArgs e)
{
// draw bitmap on panel
if (bmp != null)
e.Grahics.DrawImage(bmp, Point.Empty);
}
// shortened for clarity
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if(ctrl == 1)
{
ep = e.Location;
// draw onto graphics -> bmp
G.DrawLine(myPen, sp, ep);
}
sp = ep;
// redraw panel
panel1.Invalidate();
}
private void button1_Click_2(object sender, EventArgs e)
{
SaveFileDialog dlgSave = new SaveFileDialog();
dlgSave.Title = "Save Image";
dlgSave.Filter = "Bitmap Images (*.bmp)|*.bmp|All Files (*.*)|*.*";
if (dlgSave.ShowDialog(this) == DialogResult.OK)
{
bmp.Save(dlgSave.FileName);
}
}
}

Try this:
panel1.DrawToBitmap(bmp, new Rectangle(0, 0, panel1.Width, panel1.Height));
bmp.Save(dlgSave.FileName);

Mouse moving too fast when drawing in a graphics Object

i'm doing a C# project with my friend. We have to take a signature and save it to a JPG file. We don't have much idea of how doing this, but at least we are trying. We have 2 problems:
1.
When drawing the Graphics, if the mouse moves too fast, not all the points are caught by the mousemove Event and the result image are separated points. How can i improve this?
Here is my code:
private void ingresoFirma_Load(object sender, EventArgs e)
{
myBrush = new SolidBrush(Color.Black);
myGraphics = panel1.CreateGraphics();
}
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
isDrawing = true;
}
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if (isDrawing)
{
myGraphics.FillEllipse(myBrush, e.X, e.Y, 10, 10);
}
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
isDrawing = false;
}
The second problem is that we have no idea of how to save the Graphics to a .jpg image. We used something like this:
private void saveSign_Click(object sender, EventArgs e)
{
Bitmap signature = new Bitmap(100,100,myGraphics);
signature.Save("c:\\myBitmap.bmp");
}
But it saves a blank image.

Here's something to get you started...
public partial class ingresoFirma : Form
{
private List<Point> stroke = null;
private List<List<Point>> Strokes = new List<List<Point>>();
public ingresoFirma()
{
InitializeComponent();
}
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
if (e.Button == System.Windows.Forms.MouseButtons.Left)
{
stroke = new List<Point>();
stroke.Add(new Point(e.X, e.Y));
}
}
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if (e.Button == System.Windows.Forms.MouseButtons.Left)
{
stroke.Add(new Point(e.X, e.Y));
if (stroke.Count == 2)
{
Strokes.Add(stroke);
}
panel1.Refresh();
}
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
if (e.Button == System.Windows.Forms.MouseButtons.Left)
{
stroke = null;
}
}
private void panel1_Paint(object sender, PaintEventArgs e)
{
foreach(List<Point> curStroke in Strokes)
{
e.Graphics.DrawLines(Pens.Black, curStroke.ToArray());
}
}
private void btnClear_Click(object sender, EventArgs e)
{
Strokes.Clear();
panel1.Refresh();
}
private void btnSave_Click(object sender, EventArgs e)
{
SaveFileDialog sfd = new SaveFileDialog();
sfd.Filter = "JPG Files(*.JPG)|*.JPG";
if (sfd.ShowDialog() == System.Windows.Forms.DialogResult.OK)
{
Bitmap bmp = new Bitmap(panel1.Width, panel1.Height);
panel1.DrawToBitmap(bmp, panel1.ClientRectangle);
bmp.Save(sfd.FileName, System.Drawing.Imaging.ImageFormat.Jpeg);
}
}
}

With the DrawToBitmap() method of Control, you can save the image:
Bitmap theBitmap = new Bitmap(panel1.Width, panel1.Height)) ;
panel1.DrawToBitmap(theBitmap, new Rectangle(0, 0, bmp.Width, bmp.Height));
theBitmap.Save("c:\\myBitmap.bmp");

Draw on Panel, save as Bitmap

I'm trying to make a simple application where the user can draw on the Panel and save it to their computer as a bitmap. When I proceed to the save part, however, all I get is an empty (white) bitmap.
I've been browsing many other solutions and I am pretty sure I am saving the bitmap the correct way, so I am starting to wonder if my drawing process is incorrect. What exactly is wrong here?
public partial class Form1 : Form
{
SolidBrush brush;
Pen pen;
Point[] points = new Point[3];
Graphics display;
Bitmap bmap;
public Form1()
{
InitializeComponent();
display = panel1.CreateGraphics();
bmap = new Bitmap(panel1.Width, panel1.Height);
}
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
brush = new SolidBrush(Color.Black);
pen = new Pen(Color.Black);
display.FillEllipse(brush, e.X, e.Y, 10, 10);
panel1.DrawToBitmap(bmap, new Rectangle(0, 0, panel1.Width, panel1.Height));
//this.Invalidate();
}
private void clearToolStripMenuItem_Click(object sender, EventArgs e)
{
Graphics display = panel1.CreateGraphics();
display.Clear(panel1.BackColor);
}
private void saveToolStripMenuItem_Click(object sender, EventArgs e)
{
bmap.Save(#"C:\Temp\Test.bmp");
}
}
EDIT
With this revision, I just get a black bmp and I don't even see elipses being created anymore on my screen. Although I did notice that if I put invalidate and Draw to bitmap back in the mousedown event, then the save button will save the last ellipse, while there is still nothing appearing on my screen.
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
mousedown = true;
x = e.X;
y = e.Y;
}
private void panel1_Paint(object sender, PaintEventArgs e)
{
//Graphics g = e.Graphics;
if(mousedown==true)
{
brush = new SolidBrush(Color.Black);
pen = new Pen(Color.Black);
Graphics.FromImage(bmap).FillEllipse(brush, x, y, 10, 10);
panel1.Invalidate();
//panel1.DrawToBitmap(bmap, new Rectangle(0, 0, panel1.Width, panel1.Height));
//panel1.Invalidate();
}
}

As Hans did most of the work in his comment, here is how your code should probably look:
public partial class Form1 : Form {
Bitmap bmap;
public Form1() {
InitializeComponent();
bmap = new Bitmap(panel1.ClientWidth, panel1.ClientHeight);
panel1.MouseDown += panel1_MouseDown;
panel1.Paint += panel1_Paint;
}
void panel1_Paint(object sender, PaintEventArgs e) {
e.Graphics.DrawImage(bmap, Point.Empty);
}
void panel1_MouseDown(object sender, MouseEventArgs e) {
using (Graphics g = Graphics.FromImage(bmap)) {
g.FillEllipse(Brushes.Black, e.X, e.Y, 10, 10);
}
panel1.Invalidate();
}
private void clearToolStripMenuItem_Click(object sender, EventArgs e) {
using (Graphics g = Graphics.FromImage(bmap)) {
g.Clear(Color.White);
}
panel1.Invalidate();
}
private void saveToolStripMenuItem_Click(object sender, EventArgs e) {
bmap.Save(#"c:\temp\bmap.bmp");
}
}
CreateGraphics is just a temporary canvas, so you rarely, if ever, use that for drawing purposes, especially since you are trying to save an image.

This will works fine. I tested it and worked well
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Drawing.Imaging;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
namespace drawing
{
public partial class Form2 : Form
{
Graphics g;
bool startPaint = false;
int? initX = null;
int? initY = null;
bool drawSquare = false;
bool drawRectangle = false;
bool drawCircle = false;
public Form2()
{
InitializeComponent();
bmp = new Bitmap(panel1.ClientSize.Width, panel1.ClientSize.Height);
}
Bitmap bmp;
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
}
void panel1_MouseMove(object sender, MouseEventArgs e)
{
if (startPaint)
{
using ( g = Graphics.FromImage(bmp))
{
// g.FillEllipse(Brushes.Black, new Rectangle(e.X, e.Y , 5, 5));
Pen p = new Pen(btn_PenColor.BackColor, float.Parse(cmb_PenSize.Text));
g.DrawLine(p, new Point(initX ?? e.X, initY ?? e.Y), new Point(e.X, e.Y));
initX = e.X;
initY = e.Y;
//g.DrawImage(bmp, new Rectangle(e.X - 4, e.Y - 4, 8, 8));
}
panel1.Invalidate();
}
}
private void pnl_Draw_MouseDown(object sender, MouseEventArgs e)
{
startPaint = true;
if (drawSquare)
{
//Use Solid Brush for filling the graphic shapes
SolidBrush sb = new SolidBrush(btn_PenColor.BackColor);
//setting the width and height same for creating square.
//Getting the width and Heigt value from Textbox(txt_ShapeSize)
g.FillRectangle(sb, e.X, e.Y, int.Parse(txt_ShapeSize.Text), int.Parse(txt_ShapeSize.Text));
//setting startPaint and drawSquare value to false for creating one graphic on one click.
startPaint = false;
drawSquare = false;
}
if (drawRectangle)
{
SolidBrush sb = new SolidBrush(btn_PenColor.BackColor);
//setting the width twice of the height
g.FillRectangle(sb, e.X, e.Y, 2 * int.Parse(txt_ShapeSize.Text), int.Parse(txt_ShapeSize.Text));
startPaint = false;
drawRectangle = false;
}
if (drawCircle)
{
SolidBrush sb = new SolidBrush(btn_PenColor.BackColor);
g.FillEllipse(sb, e.X, e.Y, int.Parse(txt_ShapeSize.Text), int.Parse(txt_ShapeSize.Text));
startPaint = false;
drawCircle = false;
}
}
private void pnl_Draw_MouseUp(object sender, MouseEventArgs e)
{
startPaint = false;
initX = null;
initY = null;
}
void panel1_Paint(object sender, PaintEventArgs e)
{
e.Graphics.DrawImage(bmp, Point.Empty);
}
private void button1_Click(object sender, EventArgs e)
{
bmp.Save("D://filename.jpg", ImageFormat.Png);
}
}
}

C# PrintDocument prints blank page. Why?

I have the following picture box I populate with a barcode then try to print.
Here's the code:
private void button1_Click(object sender, EventArgs e)
{
printDocument1.OriginAtMargins = true;
printDocument1.DocumentName = "TEST IMAGE PRINTING";
printDialog1.Document = printDocument1;
printDialog1.ShowDialog();
printDocument1.Print();
}
private void printDocument1_PrintPage_1(object sender, PrintPageEventArgs e)
{
System.Drawing.Graphics formGraphics = System.Drawing.Graphics.FromImage(picpdf417.Image);
}

You need to actually draw the image:
private void printDocument1_PrintPage_1(object sender, PrintPageEventArgs e)
{
e.Graphics.DrawImage(picpdf417.Image, Point.Empty);
}