Using GDI+ and C#, I am trying to Draw a Rectangle with my Mouse Movement on a Panel (called DrawingPanel), I am using Double buffered as well I am doing the drawing in Paint Event, Still It is causing a Lots of flickering when my Mouse is Moving.
Here is my Code...
Rectangle mRect = new Rectangle();
Boolean isDragging = false;
public Form1()
{
InitializeComponent();
this.DrawingPanel.Paint += new PaintEventHandler(this.OnPanelPaint);
this.DrawingPanel.MouseMove += new MouseEventHandler(this.OnPanelMouseMove);
this.DrawingPanel.MouseDown += new MouseEventHandler(this.OnPanelMouseDown);
this.DrawingPanel.MouseUp += new MouseEventHandler(this.OnPanelMouseUp);
this.DoubleBuffered = true;
}
private void OnPanelPaint(object sender, PaintEventArgs e)
{
using (Graphics g = this.DrawingPanel.CreateGraphics())
{
g.DrawRectangle(Pens.Black, mRect);
g.FillRectangle(Brushes.SkyBlue, mRect);
}
}
private void OnPanelMouseMove(object sender, MouseEventArgs e)
{
if(isDragging)
{
mRect = new Rectangle(mRect.Left, mRect.Top, e.X - mRect.Left, e.Y - mRect.Top);
this.DrawingPanel.Invalidate();
}
}
private void OnPanelMouseDown(object sender, MouseEventArgs e)
{
mRect = new Rectangle(e.Location, new Size(0, 0));
this.DrawingPanel.Invalidate();
isDragging = true;
}
private void OnPanelMouseUp(object sender, MouseEventArgs e)
{
isDragging = false;
}
Any Idea why it is happening still ?
Related
I am trying to create a Form in Visual Studio Windows Forms Apps C# in which during runtime the user or operator can create a new picturebox with a left mouse click and then have the ability to move each picturebox created.
I really do not know where to begin. Anyone have any ideas?
To add a new PictureBox dynamically, you can subscribe to the event Form_MouseClick and create the PictureBox like this:
public Form1()
{
InitializeComponent();
this.MouseClick += Form_MouseClick;
}
private void Form_MouseClick(object sender, MouseEventArgs e)
{
PictureBox pictureBox = new PictureBox();
// cursor location
pictureBox.Location = new Point(e.X, e.Y);
pictureBox.BackColor = Color.Red;
this.Controls.Add(pictureBox);
}
To drag and move the PictureBox, you also nee to subscribe to the event MouseDown, MouseUp, and MouseMove.
Here is a simple demo you can refer to.
private void Form_MouseClick(object sender, MouseEventArgs e)
{
// create new control
PictureBox pictureBox = new PictureBox();
pictureBox.Location = new Point(e.X, e.Y);
pictureBox.BackColor = Color.Red;
this.Controls.Add(pictureBox);
// bind event for each PictureBox
pictureBox.MouseDown += pictureBox_MouseDown;
pictureBox.MouseUp += pictureBox_MouseUp;
pictureBox.MouseMove += pictureBox_MouseMove;
}
Point mouseDownPoint = Point.Empty;
Rectangle rect = Rectangle.Empty;
bool isDrag = false;
private void pictureBox_MouseDown(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
mouseDownPoint = e.Location;
rect = (sender as PictureBox).Bounds;
}
}
private void pictureBox_MouseUp(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
if (isDrag)
{
isDrag = false;
(sender as PictureBox).Location = rect.Location;
this.Refresh();
}
reset();
}
}
private void pictureBox_MouseMove(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
isDrag = true;
rect.Location = this.PointToClient((sender as PictureBox).PointToScreen(new Point(e.Location.X - mouseDownPoint.X, e.Location.Y - mouseDownPoint.Y)));
this.Refresh();
}
}
private void reset()
{
mouseDownPoint = Point.Empty;
rect = Rectangle.Empty;
isDrag = false;
}
You can add the form elements during runtime:
var picture = new PictureBox
{
Name = "pictureBox",
Size = new Size(16, 16),
Location = new Point(100, 100),
Image = Image.FromFile("test.jpg"),
};
this.Controls.Add(picture);
Afterward, you can move it with the Mouse Events
Hi I'm using the code below to draw a circle on a pictureBox, The problem is I don't know why some times if I draw a circle it whon show until I draw an other, some times it will show on the first circle.
public partial class Form1 : Form
{
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>>();
public Form1()
{
InitializeComponent();
//
// pictureBox1
//
this.pictureBox1.Location = new System.Drawing.Point(0, 0);
this.pictureBox1.Name = "pictureBox1";
this.pictureBox1.Size = new System.Drawing.Size(231, 235);
this.pictureBox1.TabIndex = 0;
this.pictureBox1.TabStop = false;
this.pictureBox1.Paint += new System.Windows.Forms.PaintEventHandler(this.pictureBox1_Paint);
this.pictureBox1.MouseDown += new System.Windows.Forms.MouseEventHandler(this.pictureBox1_MouseDown);
this.pictureBox1.MouseMove += new System.Windows.Forms.MouseEventHandler(this.pictureBox1_MouseMove);
this.pictureBox1.MouseUp += new System.Windows.Forms.MouseEventHandler(this.pictureBox1_MouseUp);
this.Controls.Add(this.pictureBox1);
}
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
var g = e.Graphics;
if (isMoving)
{
g.Clear(pictureBox1.BackColor);
g.DrawLine(Pens.Black, mouseDownPosition, mouseMovePosition);
foreach (var line in lines)
{
g.DrawLine(Pens.Black, line.Item1, line.Item2);
}
}
}
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;
}
}
Use Refresh() instead of using Invalidate(). This will force the re-paint event to be called. Note that you may see a performance drop if you excessively repaint the screen.
private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
{
if (isMoving)
{
mouseMovePosition = e.Location;
pictureBox1.Refresh();
}
}
I don't see any circles in your sample:)
I noticed your code was behaving a bit weird, when I added the following it seemed to make it run a bit better.
this.pictureBox1.MouseClick += pictureBox1_MouseClick;
...
void pictureBox1_MouseClick(object sender, MouseEventArgs e)
{
isMoving = false;
}
Hope this helps :)
When mouse move over a panel2, I need to draw lines. So far I have done following
public Form1()
{
InitializeComponent();
}
private void panel2_Paint(object sender, PaintEventArgs e)
{
if (isDragging)
{
letsPaint(sender, e);
}
}
private void panel2_MouseMove(object sender, MouseEventArgs e)
{
if (isDragging)
{
mouseMoveX = e.X;
mouseMoveY = e.Y;
this.Paint += new PaintEventHandler(panel2_Paint);
}
}
private void letsPaint(object sender, PaintEventArgs e)
{
Pen blackpen = new Pen(Color.Black, 3);
Graphics g = e.Graphics;
g.DrawLine(blackpen, mouseClickedX, mouseClickedY, mouseMoveX, mouseMoveY);
g.Dispose();
}
But nothing happens when I move mouse. I think I did something wrong PaintEventHandler() here. Please tell me how to do this and also if there is any better way for this.
Also I think my method will drawline on the form but I need to draw line on the panel2. How to do? Thanks in advance.
You invalidate:
public Form1()
{
InitializeComponent();
panel2.Paint += new letsPaint;
}
private void panel2_MouseMove(object sender, MouseEventArgs e)
{
if (isDragging) {
mouseMoveX = e.X;
mouseMoveY = e.Y;
panel2.Invalidate();
}
}
and you don't dispose the graphic object (you didn't create it), but you do the pen:
private void letsPaint(object sender, PaintEventArgs e) {
using (Pen blackpen = new Pen(Color.Black, 3)) {
e.Graphics.DrawLine(blackpen,
mouseClickedX, mouseClickedY, mouseMoveX, mouseMoveY);
}
}
Here is a quick little method that works with a bitmap:
Bitmap bmp;
Point lastPoint;
public Form1() {
InitializeComponent();
bmp = new Bitmap(panel1.ClientSize.Width, panel1.ClientSize.Height,
System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
panel1.MouseDown += panel1_MouseDown;
panel1.MouseMove += panel1_MouseMove;
panel1.Paint += panel1_Paint;
}
void panel1_Paint(object sender, PaintEventArgs e) {
e.Graphics.DrawImage(bmp, Point.Empty);
}
void panel1_MouseMove(object sender, MouseEventArgs e) {
if (e.Button == MouseButtons.Left) {
using (Graphics g = Graphics.FromImage(bmp)) {
g.DrawLine(Pens.Black, lastPoint, e.Location);
}
lastPoint = e.Location;
panel1.Invalidate();
}
}
void panel1_MouseDown(object sender, MouseEventArgs e) {
lastPoint = e.Location;
}
This will flicker, so you would want to replace your panel with a double-buffered panel. Something like this:
public class PanelEx : Panel {
public PanelEx() {
this.DoubleBuffered = true;
}
}
I have a custom PictureBox which can zoom in using MouseWheel event. Now I want to add a panning feature to it. I mean when PictureBox is in zoomed state, if user left clicks and holds the click then move the mouse, the image would pan within the picturebox.
Here is my code but unfortunately it does not work! I don't know where to look anymore...
private Point _panStartingPoint = Point.Empty;
private bool _panIsActive;
private void CurveBox_MouseDown(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
Focus();
_panIsActive = true;
_panStartingPoint = e.Location;
}
}
private void CurveBox_MouseUp(object sender, MouseEventArgs e)
{
_panIsActive = false;
}
private void CurveBox_MouseLeave(object sender, EventArgs e)
{
_panIsActive = false;
}
private void CurveBox_MouseMove(object sender, MouseEventArgs e)
{
if(_panIsActive && IsZoomed)
{
var g = CreateGraphics(); //Create graphics from PictureBox
var nx = _panStartingPoint.X + e.X;
var ny = _panStartingPoint.Y + e.Y;
var sourceRectangle = new Rectangle(nx, ny, Image.Width, Image.Height);
g.DrawImage(Image, nx, ny, sourceRectangle, GraphicsUnit.Pixel);
}
}
I am suspecting the MouseMove event...I am not sure if anything happens in this event and/or nx and ny does contain correct point.
Any helps/tips is really appriciated!
I think the math is backwards. Try it like this:
private Point startingPoint = Point.Empty;
private Point movingPoint = Point.Empty;
private bool panning = false;
void pictureBox1_MouseDown(object sender, MouseEventArgs e) {
panning = true;
startingPoint = new Point(e.Location.X - movingPoint.X,
e.Location.Y - movingPoint.Y);
}
void pictureBox1_MouseUp(object sender, MouseEventArgs e) {
panning = false;
}
void pictureBox1_MouseMove(object sender, MouseEventArgs e) {
if (panning) {
movingPoint = new Point(e.Location.X - startingPoint.X,
e.Location.Y - startingPoint.Y);
pictureBox1.Invalidate();
}
}
void pictureBox1_Paint(object sender, PaintEventArgs e) {
e.Graphics.Clear(Color.White);
e.Graphics.DrawImage(Image, movingPoint);
}
You aren't disposing your graphic object, and CreateGraphics is just a temporary drawing anyway (minimizing would erase it) so I moved the drawing code to the Paint event and am just invalidating as the user is panning.
My current code allows me to draw rectangles from a user defined spot but not in the way in whihc i desire. I need it to be like you would do it in paint, here is my current code:
namespace SimpleDraw2
{
///
/// Description of MainForm.
///
public partial class MainForm : Form
{
bool IsMouseDown = false;
Point MousePosition;
int DrawShape = 0;
Bitmap StoredImage;
public MainForm()
{
//
// The InitializeComponent() call is required for Windows Forms designer support.
//
InitializeComponent();
//
// TODO: Add constructor code after the InitializeComponent() call.
//
pictureBox1.Image = new Bitmap (pictureBox1.Width,pictureBox1.Height);
StoredImage = new Bitmap(pictureBox1.Width,pictureBox1.Height);
}
void PictureBox1MouseDown(object sender, MouseEventArgs e)
{
IsMouseDown = true;
MousePosition = e.Location;
Graphics gStored = Graphics.FromImage(StoredImage);
gStored.Clear(Color.Transparent);
gStored.DrawImage(pictureBox1.Image, 0, 0);
}
void PictureBox1MouseUp(object sender, MouseEventArgs e)
{
IsMouseDown = false;
}
void PictureBox1MouseMove(object sender, MouseEventArgs e)
{
Graphics g = Graphics.FromImage(pictureBox1.Image);
if (DrawShape == 0)
{
Pen p = new Pen(Color.Red, 10);
if (IsMouseDown)
{
g.DrawLine(p,MousePosition,e.Location);
MousePosition = e.Location;
}
}
if (DrawShape == 1)
{
g.Clear(Color.Transparent);
g.DrawImage(StoredImage,0,0);
g.DrawRectangle(Pens.Green,MousePosition.X,MousePosition.Y,e.X,e.Y);
}
if (DrawShape == 2)
{
g.Clear(Color.Transparent);
g.DrawImage(StoredImage, 0, 0);
g.DrawEllipse(Pens.HotPink, MousePosition.X, MousePosition.Y, e.X, e.Y);
}
if (DrawShape == 3)
{
g.Clear(Color.Transparent);
g.DrawImage(StoredImage, 0, 0);
g.DrawArc(Pens.Indigo,pictureBox1.Bounds, e.Y, e.X);
}
//if (DrawShape == 4)
//{
// g.Clear(Color.Transparent);
// g.DrawImage(StoredImage, 0, 0);
// g.DrawPolygon(Pens.Indigo, Point[] e.X);
//}
this.Refresh();
}
private void button2_Click(object sender, EventArgs e)
{
OpenFileDialog ofd = new OpenFileDialog();
if (ofd.ShowDialog() == DialogResult.OK)
{
axWindowsMediaPlayer1.URL = ofd.FileName;
}
}
private void button1_Click(object sender, EventArgs e)
{
axWindowsMediaPlayer1.Ctlcontrols.pause();
Bitmap bmp = new Bitmap(axWindowsMediaPlayer1.Width, axWindowsMediaPlayer1.Height);
Graphics gfx = Graphics.FromImage(bmp);
gfx.CopyFromScreen(PointToScreen(axWindowsMediaPlayer1.Location), new Point(0, 0), axWindowsMediaPlayer1.Bounds.Size, CopyPixelOperation.SourceCopy);
pictureBox1.BackgroundImage = bmp;
//axWindowsMediaPlayer1.Visible = false;
//pictureBox1.Visible = true;
}
private void button3_Click(object sender, EventArgs e)
{
Graphics gg = Graphics.FromImage(pictureBox1.BackgroundImage);
gg.Clear(Color.Transparent);
Graphics gStored = Graphics.FromImage(StoredImage);
gStored.Clear(Color.Transparent);
Graphics g = Graphics.FromImage(pictureBox1.Image);
g.Clear(Color.Transparent);
}
private void button4_Click(object sender, EventArgs e)
{
DrawShape = 1;
}
private void button6_Click(object sender, EventArgs e)
{
DrawShape = 2;
}
private void button8_Click(object sender, EventArgs e)
{
DrawShape = 3;
}
private void button7_Click(object sender, EventArgs e)
{
DrawShape = 0;
}
}
}
If someone could help me edit my code to iron out the issue to make it easy drag and draw system it would me much appreciate.
Thanks in Advance
Chris
From msdn:
Draws a rectangle specified by a
coordinate pair, a width, and a
height.
So your code won't work:
g.DrawRectangle(Pens.Green,MousePosition.X,MousePosition.Y,e.X,e.Y);
Should be something like
g.DrawRectangle(Pens.Green, MousePosition.X, MousePosition.Y, Math.Abs(e.X - MousePosition.X), Math.Abs(e.Y - MousePosition.Y));
The biggest problem I see is that you're trying to draw in the mouse events. This means your drawing will be wiped away the instant you get a refresh event.
Only draw in Paint events, never in mouse events. If you want your app to draw as a result of mouse events, set a point, rectangle, or whatever in the mouse events (like you start to do with IsMouseDown), invalidate the area you want to change in your MouseMoved event, then draw your rectangle or whatever in your Paint event.