Develop Reference

C# Graphics class want to make signature panel : input from drawing tablet

i am trying to make signature panel in c# windowsform application where input is from drawing tablet
my code as below this code working for line drawing not dot created.
So please suggest how dot and line both are create.
{
Graphics graphics;
Boolean cusorMoving = false;
Pen cursorPen;
int cursorX = -1;
int cursorY = -1;
public SignPad()
{
InitializeComponent();
graphics = panel2.CreateGraphics();
cursorPen = new Pen(Color.Black, 2);
graphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;
cursorPen.StartCap = System.Drawing.Drawing2D.LineCap.Round;
cursorPen.EndCap = System.Drawing.Drawing2D.LineCap.Round;
}
Mouse Down event
private void panel2_MouseDown(object sender, MouseEventArgs e)
{
cusorMoving = true;
cursorX = e.X;
cursorY = e.Y;
}
private void panel2_MouseUp(object sender, MouseEventArgs e)
{
cusorMoving = false;
cursorX = -1;
cursorY = -1;
}
Mouse Move event
private void panel2_MouseMove(object sender, MouseEventArgs e)
{
if (cursorX != -1 && cursorY != -1 && cusorMoving == true)
{
graphics.DrawLine(cursorPen, new Point(cursorX, cursorY), e.Location);
cursorX = e.X;
cursorY = e.Y;
}
}

You need to store individual points in a collection and draw them separately in the Paint handler. Every time you add a point to the collection, you also need to tell the panel to draw the area where the new segment was added. Something like this:
using System.Collections.Generic;
using System.Drawing;
namespace Lines
{
public partial class SignPad : Form
{
Pen cursorPen = SystemPens.ControlText;
List<Point> points = new List<Point>();
bool cursorMoving = false;
public SignPad()
{
InitializeComponent();
cursorPen = new Pen(Color.Black, 2);
cursorPen.StartCap = System.Drawing.Drawing2D.LineCap.Round;
cursorPen.EndCap = System.Drawing.Drawing2D.LineCap.Round;
}
private void panel2_Paint(object? sender, PaintEventArgs e)
{
var g = e.Graphics;
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;
for (int i = 1; i < points.Count; ++i)
g.DrawLine(cursorPen, points[i - 1], points[i]);
}
private void panel2_MouseDown(object? sender, MouseEventArgs e)
{
if (!cursorMoving)
{
cursorMoving = true;
points.Clear();
points.Add(e.Location);
panel2.Invalidate();
}
}
private void panel2_MouseMove(object? sender, MouseEventArgs e)
{
if (cursorMoving && points.Count > 0)
{
var p = e.Location;
var q = points[points.Count - 1];
var r = Rectangle.FromLTRB(Math.Min(p.X, q.X), Math.Min(p.Y, q.Y), Math.Max(p.X, q.X), Math.Max(p.Y, q.Y));
r = Rectangle.Inflate(r, (int)cursorPen.Width, (int)cursorPen.Width);
points.Add(p);
panel2.Invalidate(r);
}
}
private void panel2_MouseUp(object? sender, MouseEventArgs e)
{
cursorMoving = false;
}
}
}
Don't forget to add the Paint handler the same way you added MouseMove, MouseDown and MouseUp handlers - in the Designer.

The image is supposed to be moved inside the PictureBox via MouseMove events

Before starting a project, I want to know beforehand whether the following would work.
The application creates a System.Drawing.Bitmap and paints on it.
The Bitmap is much larger than the PictureBox. The Height of the Bitmap and the PictureBox are the same. Now I would like to be able to move the Image from left to right within (along) the PictureBox by pressing the left mouse button and moving it.
See the drawing:

I just realized that I haven't answered yet, which I am trying to make up for.
As a solution, I use Jimi's solution. I've shortened the code here to meet my needs.
using System;
using System.ComponentModel;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.IO;
using System.Windows.Forms;
namespace Zoom_an_image_from_the_mouse_location
{
public partial class FormMain : Form
{
public FormMain()
{
InitializeComponent();
string imagePath = "C:\\Users\\yourPath\\Pictures\\....jpeg";
drawingImage = (Bitmap)Image.FromStream(new MemoryStream(File.ReadAllBytes(imagePath)));
imageRect = new RectangleF(Point.Empty, drawingImage.Size);
canvas = new PictureBoxEx(new Size(525,700));
canvas.Location = new Point(10, 10);
canvas.MouseMove += this.canvas_MouseMove;
canvas.MouseDown += this.canvas_MouseDown;
canvas.MouseUp += this.canvas_MouseUp;
canvas.Paint += this.canvas_Paint;
this.Controls.Add(canvas);
}
private void FormMain_Load(object sender, EventArgs e)
{
this.BackColor = Color.FromArgb(174, 184, 177);
}
private void FormMain_FormClosing(object sender, FormClosingEventArgs e)
{
}
private float rotationAngle = 0.0f;
private float zoomFactor = 1.0f;
private RectangleF imageRect = RectangleF.Empty;
private PointF imageLocation = PointF.Empty;
private PointF mouseLocation = PointF.Empty;
private Bitmap drawingImage = null;
private PictureBoxEx canvas = null;
private void canvas_MouseDown(object sender, MouseEventArgs e)
{
if (e.Button != MouseButtons.Left) return;
mouseLocation = e.Location;
imageLocation = imageRect.Location;
canvas.Cursor = Cursors.NoMove2D;
}
private void canvas_MouseMove(object sender, MouseEventArgs e)
{
if (e.Button != MouseButtons.Left) return;
imageRect.Location =
new PointF(imageLocation.X + (e.Location.X - mouseLocation.X),
imageLocation.Y); //+ (e.Location.Y - mouseLocation.Y));
canvas.Invalidate();
}
private void canvas_MouseUp(object sender, MouseEventArgs e) =>
canvas.Cursor = Cursors.Default;
private void canvas_Paint(object sender, PaintEventArgs e)
{
var drawingRect = GetDrawingImageRect(imageRect);
using (var mxRotation = new Matrix())
using (var mxTransform = new Matrix())
{
e.Graphics.InterpolationMode = InterpolationMode.HighQualityBicubic;
e.Graphics.PixelOffsetMode = PixelOffsetMode.Half;
mxRotation.RotateAt(rotationAngle, GetDrawingImageCenterPoint(drawingRect));
mxTransform.Multiply(mxRotation);
e.Graphics.Transform = mxTransform;
e.Graphics.DrawImage(drawingImage, drawingRect);
}
}
#region Drawing Methods
public RectangleF GetScaledRect(RectangleF rect, float scaleFactor) =>
new RectangleF(rect.Location,
new SizeF(rect.Width * scaleFactor, rect.Height * scaleFactor));
public RectangleF GetDrawingImageRect(RectangleF rect) =>
GetScaledRect(rect, zoomFactor);
public PointF GetDrawingImageCenterPoint(RectangleF rect) =>
new PointF(rect.X + rect.Width / 2f, rect.Y + rect.Height / 2f);
#endregion
}
}
[DesignerCategory("Code")]
public class PictureBoxEx : PictureBox
{
public PictureBoxEx() : this(new Size(525, 700)) { }
public PictureBoxEx(Size size)
{
SetStyle(ControlStyles.Selectable | ControlStyles.UserMouse, true);
this.BorderStyle = BorderStyle.FixedSingle;
this.Size = size;
}
}

How can I click on drawn points and make a external window opening?

I want to click on points that I drew.
It would be also cool if a window would popup and I could do something with that. But the general thing i want to do is clicking on a drawn point. I want to make it work, that i can click on the map on points that I drew.
Example image:
public partial class Form1 : Form
{
Graphics g;
Pen p;
Point cursor;
int k = 0;
Point[] points = new Point[50];
public Form1()
{
InitializeComponent();
g = pbxkarte.CreateGraphics();
p = new Pen(Color.DeepSkyBlue, 3);
}
private void Form1_Load(object sender, EventArgs e)
{
}
private void Pbxkarte_Click(object sender, EventArgs e)
{
if (drawmodecbx.Checked == true)
{
g.DrawEllipse(p, cursor.X - 10, cursor.Y - 10, 20, 20);
points[k++] = new Point(cursor.X, cursor.Y);
lbxDrawnPoints.Items.Add("X:" + cursor.X + "Y:" + cursor.Y);
}
}
private void Pbxkarte_MouseMove(object sender, MouseEventArgs e)
{
cursor = this.PointToClient(Cursor.Position);
xydisplay.Text = "X:" + cursor.X + "Y:" + cursor.Y;
}
}
}

Example code:
Two class level variables and a helper function:
List<Point> dots = new List<Point>();
int dotSize = 12;
Rectangle fromPoint(Point pt, int size)
{
return new Rectangle(pt.X - size/ 2, pt.Y - size / 2, size, size);
}
The mouseclick (as opposed to the click event) contains the location:
private void Pbxkarte_MouseClick(object sender, MouseEventArgs e)
{
if (!dots.Contains(e.Location))
{
dots.Add(e.Location);
Pbxkarte.Invalidate(); // show the dots
}
}
You could add code to remove dots or change the properties, esp. if you create a dot class. - If you want to avoid overlapping dots you can to use code like the one in the mousemove to detect this. But. Don't repeat the code! Instead factor out a boolOrPoint IsDotAt(Point) function you can use both times!!
In the mousemove I only show the hit state. You do your thing..
private void Pbxkarte_MouseMove(object sender, MouseEventArgs e)
{
bool hit = false;
foreach (var dot in dots)
{
using (GraphicsPath gp = new GraphicsPath())
{
gp.AddEllipse(fromPoint(dot, dotSize));
if (gp.IsVisible(e.Location))
{
hit = true; break;
}
}
}
Cursor = hit ? Cursors.Hand : Cursors.Default;
}
All dot in the list must get shown every time anything changes, both in the list or in the system.:
private void Pbxkarte_Paint(object sender, PaintEventArgs e)
{
foreach (var dot in dots)
{
using (GraphicsPath gp = new GraphicsPath())
{
gp.AddEllipse(fromPoint(dot, dotSize));
e.Graphics.FillPath(Brushes.Red, gp);
}
}
}
If you want more properties, like texts or colors do create a class dot and use a List<dot> !

Drawing a line by mouse in a panel

I want to draw a line by mouse(interactively) , I used C# and WinForm, the line should appear at any time from the starting point(when the mouse press on the panel) to the current position of the mouse, exactly like drawing a line in Paint program.
but the code produces a lot of lines, i know why but i don't know how to overcome this problem
Here is my code:
namespace WindowsFormsApplication2
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
Graphics g;
Pen myPen = new Pen(Color.Red);
Point p = new Point();
bool flag = false;
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
flag = true;
p = e.Location;
}
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if (flag)
{
g = panel1.CreateGraphics();
myPen.Width = 3;
Point p2 = new Point();
p2 = e.Location;
g.DrawLine(myPen, p, p2);
}
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
flag = false;
}
}}
Any Help? i want to draw many lines and keep the code simple as possible!

You will need to better manage the drawing. Some pointers:
Don't use CreateGraphics. Instead, use the Paint event already provided by the control.
Do your drawing in an inherited class of your own. Don't draw in the Form class unless you're drawing on the form.
Here's an example class. It's inherited from Panel. Simply add this to a form, such as in the Form's constructor using something like this.Controls.Add(new PanelWithMouseDraw());.
Note: this uses Tuple which I believe requires .NET 4.0 or above. You could replace this structure with something else, if need be...you just need to keep a list of Point pairs.
namespace WindowsFormsApplication1
{
public class PanelWithMouseDraw : Panel
{
private Point _origin = Point.Empty;
private Point _terminus = Point.Empty;
private Boolean _draw = false;
private List<Tuple<Point, Point>> _lines = new List<Tuple<Point, Point>>();
public PanelWithMouseDraw()
{
Dock = DockStyle.Fill;
DoubleBuffered = true;
}
protected override void OnMouseDown(MouseEventArgs e)
{
base.OnMouseDown(e);
if (e.Button == MouseButtons.Left)
{
_draw = true;
_origin = e.Location;
}
else
{
_draw = false;
_origin = Point.Empty;
}
_terminus = Point.Empty;
Invalidate();
}
protected override void OnMouseUp(MouseEventArgs e)
{
base.OnMouseUp(e);
if (_draw && !_origin.IsEmpty && !_terminus.IsEmpty)
_lines.Add(new Tuple<Point, Point>(_origin, _terminus));
_draw = false;
_origin = Point.Empty;
_terminus = Point.Empty;
Invalidate();
}
protected override void OnMouseMove(MouseEventArgs e)
{
base.OnMouseMove(e);
if (e.Button == MouseButtons.Left)
_terminus = e.Location;
Invalidate();
}
protected override void OnPaint(PaintEventArgs e)
{
foreach (var line in _lines)
e.Graphics.DrawLine(Pens.Blue, line.Item1, line.Item2);
if (!_origin.IsEmpty && !_terminus.IsEmpty)
e.Graphics.DrawLine(Pens.Red, _origin, _terminus);
}
}
}

Simple fix, change the method panel1_MouseMove as follows:
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if (flag)
{
g = panel1.CreateGraphics();
myPen.Width = 3;
Point p2 = new Point();
p2 = e.Location;
g.DrawLine(myPen, p, p2);
p = p2; // just add this
}
}
Keep in mind this will work with any mouse button down, left or right doesnt matter.
Edit1:
This should draw a straight line and all the previous ones.
namespace WindowsFormsApplication2
{
public partial class Form1 : Form
{
public struct Line
{
public Point start;
public Point end;
}
public Form1()
{
InitializeComponent();
}
Pen erasePen = new Pen(Color.White, 3.0F);
Pen myPen = new Pen(Color.Red, 3.0F);
Point p = new Point();
Point endPoint = new Point();
bool flag = false;
List<WindowsFormsApplication2.Form1.Line> lines = new List<WindowsFormsApplication2.Form1.Line>();
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
flag = true;
p = e.Location;
endPoint = p;
}
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if (flag)
{
Graphics g = panel1.CreateGraphics();
Point p2 = e.Location;
EraseLine(p, endPoint, g);
DrawAllLines(lines, g);
DrawLine(p, p2, g);
endPoint = p2;
g.Dispose();
}
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
// redraw for one last time...
Graphics g = panel1.CreateGraphics();
Point p2 = e.Location;
lines.Add(new Line { start = p, end = p2} );
EraseLine(p, endPoint, g);
DrawAllLines(lines, g);
flag = false;
g.Dispose();
}
private void DrawLine(Point start, Point end, Graphics g)
{
g.DrawLine(myPen, start, end);
}
private void DrawLine(WindowsFormsApplication2.Form1.Line line, Graphics g)
{
g.DrawLine(myPen, line.start, line.end);
}
private void DrawAllLines(List<WindowsFormsApplication2.Form1.Line> allLines, Graphics g)
{
foreach(WindowsFormsApplication2.Form1.Line l in allLines)
{
g.DrawLine(myPen, l.start, l.end);
}
}
private void EraseLine(Point start, Point end, Graphics g)
{
g.DrawLine(erasePen, start, end);
}
}}

I keep getting a Null exception when using g.FillEllipse();

I am a beginner at this so cut me a little slack please. I am trying to draw a dot on the form window at the location where the mouse is clicked. I keep getting a Null Exception at g.FillEllipse is called. What am I missing or doing wrong?
namespace ConvexHullScan
{
public partial class convexHullForm : Form
{
Graphics g;
//Brush blue = new SolidBrush(Color.Blue);
Pen bluePen = new Pen(Color.Blue, 10);
Pen redPen = new Pen(Color.Red);
public convexHullForm()
{
InitializeComponent();
}
private void mainForm_Load(object sender, EventArgs e)
{
Graphics g = this.CreateGraphics();
}
private void convexHullForm_MouseDown(object sender, MouseEventArgs e)
{
if (e.Button == System.Windows.Forms.MouseButtons.Left)
{
int x, y;
Brush blue = new SolidBrush(Color.Blue);
x = e.X;
y = e.Y;
**g.FillEllipse(blue, x, y, 20, 20);**
}
}
}
}

Replace Graphics g = this.CreateGraphics(); with just g = this.CreateGraphics(); because otherwise you are defining a new variable that lives only inside the scope of the mainForm_Load function rather than assigning a value to the variable defined at the higher-level scope of convexHullForm

It's not clear what your end goal is, but those dots drawn with CreateGraphics() will only be temporary. They will get erased when the form repaints itself, such as when you minimize and restore, or if another window obscures yours. To make them "persistent", use the supplied e.Graphics in the Paint() Event of the Form:
public partial class convexHullForm : Form
{
private List<Point> Points = new List<Point>();
public convexHullForm()
{
InitializeComponent();
this.Paint += new PaintEventHandler(convexHullForm_Paint);
this.MouseDown += new MouseEventHandler(convexHullForm_MouseDown);
}
private void convexHullForm_MouseDown(object sender, MouseEventArgs e)
{
if (e.Button == System.Windows.Forms.MouseButtons.Left)
{
Points.Add(new Point(e.X, e.Y));
this.Refresh();
}
}
void convexHullForm_Paint(object sender, PaintEventArgs e)
{
foreach (Point pt in Points)
{
e.Graphics.FillEllipse(Brushes.Blue, pt.X, pt.Y, 20, 20);
}
}
}