How to draw a selectable line? - c#

I want to create an application which the user is able to manipulate the line he draw. Something like Deleting the line or Selecting it. How should I do that?
Thanks in advance
I managed to do it using a hard coded rectangle. But I don't still have an idea how to do it using the drawLine() Can I use drawPath to do the hit test?
Here is the code:
private bool selectGraph = false;
private Rectangle myrec = new Rectangle(50, 50, 100, 100);
private Graphics g;
private void panel1_Paint(object sender, PaintEventArgs e)
{
SolidBrush sb = new SolidBrush(Color.Blue);
Pen p = new Pen(Color.Blue, 5);
e.Graphics.DrawRectangle(p, myrec);
e.Graphics.FillRectangle(sb, myrec);
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
Point mPT = new Point(e.X, e.Y);
if (e.Button == MouseButtons.Left)
{
if (myrec.Contains(mPT))
{
selectGraph = true;
button1.Enabled = true;
}
else
{
selectGraph = false;
button1.Enabled = false;
}
}
Invalidate();
}

Well you could start with something like a simple Line class:
public class Line
{
public Point Start { get; set; }
public Point End { get; set; }
}
Then you could have your form:
private Line Line = new Line();
protected override void OnPaint(PaintEventArgs e)
{
e.Graphics.DrawLine(Pens.Red, this.Line.Start, this.Line.End);
}
protected override void OnMouseMove(MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
this.Line.Start = e.Location;
this.Refresh();
}
else if (e.Button == MouseButtons.Right)
{
this.Line.End = e.Location;
this.Refresh();
}
}
So basically then they could delete the this.Line maybe on "MiddleButton" click or something. This should be enough to get you started.
I've created a sample that shows how this can be done. Set some break points and see how things are done.

There is no easy one line solution for this. You would have to program this yourself.
You have to keep track of every object you have drawn. In the onmousedown event you have to find out if the mouse has clicked on or near an object you want to move/delete by comparing coordinates. Then you need to draw some visual guide that the line is 'selected'. Deleting is now quite easy by removing the object from the collection.
For drag and drop you have to do something similar by changing the coordinates of the object according to the mouse move.

Related

Method to create a workspace to draw on in C#

I'm new to c#, coming from a python / wxpython background. I'm still very inexperienced.
I'm trying to create a user workspace that allows objects that have a representative shape (box or circle) to be placed. I'd like the user to be able to pan and zoom within the workspace. Eventually I want to have the items have attributes and be able to be connected together with lines.
I created a simple c# app that allows me to paint squares over a tiled .png grid background, but I can't figure out to set up a real workspace to pan or zoom.
At this stage some high level suggestions would be great.
Here is my code just FYI (be kind)
public partial class MainForm : Form
{
bool global_draw_redbox = false;
public MainForm()
{
InitializeComponent();
}
private void redbox(Point mousepos)
{
System.Drawing.Graphics graphicsObj;
graphicsObj = CreateGraphics();
Pen myPen = new Pen(System.Drawing.Color.Red, 3);
Rectangle myRectangle = new Rectangle(mousepos.X - 125, mousepos.Y - 100, 250, 200);
graphicsObj.DrawRectangle(myPen, myRectangle);
}
private void Form1_MouseClick(object sender, MouseEventArgs e)
{
var relativePoint = this.PointToClient(Cursor.Position);
if (global_draw_redbox)
{
//Draw the object based on the mouse position
redbox(relativePoint);
//Reset the flag so we draw just one
global_draw_redbox = false;
}
else
{
MessageBox.Show("No object selected");
}
}
private void Form1_MouseDoubleClick(object sender, MouseEventArgs e)
{
MessageBox.Show("Test Mouse Double Click");
}
private void Form1_MouseMove(object sender, MouseEventArgs e)
{
var relativePoint = this.PointToClient(Cursor.Position);
XY_Mouse_Position.Text = relativePoint.ToString();
}
private void boxToolStripMenuItem_Click(object sender, EventArgs e)
{
global_draw_redbox = true;
}
}

Moving multiple controls in Winforms runtime

I'm building a runtime designer for Winforms. The goal of this designer is to move controls in their container (e.g. a Form or a Panel).
When I move one control at a time everything work perfect. When I select multiple controls, things go wrong, but not always:
When I select two Buttons, the move works OK, but when I select a Label and a TextBox, the label moves in the wrong direction.
Here is an example what happens: https://www.screencast.com/t/sPaH4VNr
Here's my code:
protected virtual void ControlMouseDown(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
IsMouseDown = true;
Point startPosition = Control.PointToScreen(new Point(e.X, e.Y));
OffsetMove = new Point();
OffsetMove.X = Control.Location.X - startPosition.X;
OffsetMove.Y = Control.Location.Y - startPosition.Y;
}
else
{
IsMouseDown = false;
}
}
protected virtual void ControlMouseMove(object sender, MouseEventArgs e)
{
this.Control.Cursor = IsMovable && IsMoveAllowed(e) ? Cursors.SizeAll : Cursors.Default;
if (IsMouseDown && this.Control.Cursor == Cursors.SizeAll)
{
foreach (var control in Parent.SelectedControls.Select(sc => sc.Control))
{
Point newPoint = control.PointToScreen(e.Location);
newPoint.Offset(OffsetMove);
if (control.Location != newPoint)
{
control.Location = newPoint;
control.Parent.Invalidate();
}
}
}
}
I hope someone sees what I am doing wrong.
Thanks in advance.

Use Fillpath with mouse input as flood fill between drawn paths?

(New to this and playing around with a basic paint application) Ive found detailed instructions to code a flood-fill but as i am new it is very hard to understand every bits of it, and instead of copying, i would like to try to make my own simple(small scale) flood-fill.
Would it be possible to use fillpath as a flood-fill? i would draw paths and use my mouse to determine my x,y, on screen and have the graphicspath find out if it has borders(points from the drawn paths) and if so, fill these paths with a color?
this is what ive come up with but obviously it doesnt work, so how would i go about to make this working?
namespace WindowsFormsApplication3
{
public partial class Form1 : Form
{
Graphics g;
readonly Pen pen = new Pen(Color.Navy, 2);
Point oldCoords;
GraphicsPath graphicsPaths = new GraphicsPath();
bool spaceFound = false;
public Form1()
{
InitializeComponent();
g = panel1.CreateGraphics();
}
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
Point mousePt = new Point(e.X, e.Y);
if (e.Button == MouseButtons.Right &&
graphicsPaths.IsVisible(mousePt))
{
spaceFound = true;
}
}
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
if (oldCoords.IsEmpty)
graphicsPaths.StartFigure();
else
{
graphicsPaths.AddLine(oldCoords, new Point(e.X, e.Y));
g.DrawPath(pen, graphicsPaths);
}
oldCoords = new Point(e.X, e.Y);
}
else
oldCoords = Point.Empty;
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
}
private void panel1_Paint(object sender, PaintEventArgs e)
{
g.DrawPath(pen, graphicsPaths);
if(spaceFound == true)
{
g.FillPath(Brushes.AliceBlue, graphicsPaths);
}
}
}
}
Yes, this is quite possible; of course you would want to store the path in a List<GraphicsPath> in the MouseUp event to allow for more filled shapes..
You need to correct a few issues in your code:
Set the path.FillMode to Winding
Never cache a Graphics object
Never use control.CreateGraphics()
Don't cache Pens or Brushes
Only draw in the Paint event, unless you do not want the drawing to persist
The last point might actually apply here: Maybe you don't want the currently drawing outline to stay visible? In that, and only that case you can stick with drawing it in the MouseMove with a Graphics object created there on the fly.
Here is a corrected version:
Point oldCoords;
GraphicsPath graphicsPaths = new GraphicsPath() { FillMode = FillMode.Winding };
bool spaceFound = false;
private void drawPanel1_MouseDown(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Right && graphicsPaths.IsVisible(e.Location))
{
spaceFound = true;
drawPanel1.Invalidate();
}
}
private void drawPanel1_MouseMove(object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
if (oldCoords.IsEmpty) graphicsPaths.StartFigure();
else
{
graphicsPaths.AddLine(oldCoords, new Point(e.X, e.Y));
drawPanel1.Invalidate();
}
oldCoords = new Point(e.X, e.Y);
}
else oldCoords = Point.Empty;
}
private void drawPanel1_Paint(object sender, PaintEventArgs e)
{
using (Pen pen = new Pen(Color.Black, 2f))
e.Graphics.DrawPath(pen, graphicsPaths);
if (spaceFound == true)
{
e.Graphics.FillPath(Brushes.AliceBlue, graphicsPaths);
}
}
Note that it will fill your path but not in the way of a true floodfill, i.e. it will always fill the whole path, not just the innermost segment you have clicked in. For a true floodfill much more involved code is needed that actually goes over all neighbouring pixels starting at the click location..
Examples of a true floodfill are here and here

Why isn't my application drawing anything?

I'm very new(read 3 weeks exp) to C#(programming in general),started with html/css and javascript and now on my way with C#.
I'm trying to make my own simple 'Paint' application in windows form. But i've encountered an issue and just cant wrap my head around it, doesnt matter how much i read or follow other mans code, i'm stuck. The following code works fine but when resizing the application window the drawing dissappears.
As a solution ive read that declaring the Graphics method within the panel1_Paint event this should be resolved And here is my issue. See last code sample, ive come up with this(yes like i said, im new to this)and its not drawing anything.
ive simply tried to recreate the first example under the panel1_Paint event but i guess something went wrong during the mouseMove event and i cant figure out what it is.
Could someone explain to me what i am missing here, that would be very appreciated. thanks in advance.
[Old code]
namespace Painter
{
public partial class Form1 : Form
{
Graphics graphics;
Pen pen = new Pen(Color.Black, 1);
Point startingPoint = new Point(0, 0);
Point endPoint = new Point(0, 0);
bool mousePaint = false;
public Form1()
{
InitializeComponent();
this.DoubleBuffered = true;
}
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
startingPoint = e.Location;
if (e.Button == MouseButtons.Left)
{
mousePaint = true;
}
}
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if(mousePaint == true)
{
endPoint = e.Location;
graphics = panel1.CreateGraphics();
graphics.DrawLine(pen, startingPoint, endPoint);
}
startingPoint = endPoint;
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
mousePaint = false;
}
}
}
[New Code]
namespace Painter
{
public partial class Form1 : Form
{
Pen pen = new Pen(Color.Black, 1);
Point startingPoint = new Point(0, 0);
Point endPoint = new Point(0, 0);
bool mousePaint = false;
public Form1()
{
InitializeComponent();
this.DoubleBuffered = true;
}
private void panel1_Paint(object sender, PaintEventArgs e)
{
Graphics graphics = panel1.CreateGraphics();
if (mousePaint == true)
{
graphics.DrawLine(pen, startingPoint, endPoint);
}
}
private void panel1_MouseDown(object sender, MouseEventArgs e)
{
startingPoint = e.Location;
if (e.Button == MouseButtons.Left)
{
mousePaint = true;
}
}
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
if(mousePaint == true)
{
endPoint = e.Location;
}
startingPoint = endPoint;
}
private void panel1_MouseUp(object sender, MouseEventArgs e)
{
mousePaint = false;
}
}
}
private void panel1_Paint(object sender, PaintEventArgs e)
{
Graphics graphics = panel1.CreateGraphics();
This is nonsense! Always and only use the e.Graphics object from the Paint param!!
Also: To trigger the Paint event do a panel1.Invalidate(); whenever your drawing data have changed!
Also: Make sure you understand just what your mousePaint flag is supposed to control: the mouse painting (i.e. adding new shapes to draw) or the regular painting (i. all shape previously drawn)!? Note that all drawing, current and previous needs to be done from the Paint event, whenever necessary i.e. over and over again!
To be able to do so: Collect all the shpes' data in a List<T>..
To Doublebuffer a Panel you need to subclass it. Your code turns on DoubleBuffering for the Form, which fine but won't help the Panel..
Instead simply use a PictureBox, which is control meant for drawing on!
A DoubleBuffered Panel subclass is as simple as this:
class DrawPanel : Panel
{
public DrawPanel()
{
DoubleBuffered = true;
}
}
Update: Instead you can also use a Label (with Autosize=false); it also has the DoubleBuffered property turned on out of the box and supports drawing better than Panels do.
The following code works fine but when resizing the application window the drawing dissappears.
This happens because resizing the application window invalidates portion of your panel which causes the portion to be redrawn.
Reason why your second approach is not working (the one labelled as [NEW CODE]) is because the Paint event is called only when relevant component is redrawn. You could partially solve this by forcing redraw of the panel in your MouseDown/MouseMove event handlers but you would still lose your previously painted stuff.
Possible solution is to create instance of Bitmap and paint there. Then just set this Bitmap as BackgroundImage of the panel. You can find more information on that here. Of course you would need to think about stuff like resizing and what should happen to the bitmap if application window gets shrunk or enlarged.
Here is some code that I quickly put together to get you started:
namespace WinForms_PaintTest
{
public partial class Form1 : Form
{
private Pen pen;
private Bitmap bitmap;
public Form1()
{
InitializeComponent();
this.pen = new Pen(Color.Black, 1);
this.bitmap = new Bitmap(this.panel1.Width, this.panel1.Height);
this.panel1.BackgroundImage = this.bitmap;
}
private void panel1_MouseMove(Object sender, MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
using (Graphics g = Graphics.FromImage(this.bitmap))
{
g.DrawRectangle(this.pen, e.Location.X, e.Location.Y, 1, 1);
}
this.panel1.Refresh();
}
}
private void Form1_FormClosed(Object sender, FormClosedEventArgs e)
{
this.pen.Dispose();
this.bitmap.Dispose();
}
}
}
Also regarding this:
this.DoubleBuffered = true;
I believe your intention was to prevent the flickering when relevant control is being redrawn? If that is case you need to set this property against the panel and not against the form itself. It is little bit tricky though because DoubleBuffered property of the panel is protected so you will need to either inherit from the panel or resort to reflection. You can find more information here .

Drag and Drop - Moving a Label in Winforms

I've created a label override that will allow my new control to be moved around the screen easily.
I've attached the code below, but when I run the application or attempt to move the label it's always off. It also will sometimes just completely vanish, leave a trail or reset to the 0,0 location. Have a look at the screenshot.
I used to have this working 100%, but after some recent tweaking it has gone to the dogs again and I'm not sure how to get it working.
Screenshot:
Code:
internal sealed class DraggableLabel : Label
{
private bool _dragging;
private int _mouseX, _mouseY;
public DraggableLabel()
{
DoubleBuffered = true;
}
protected override void OnMouseMove(MouseEventArgs e)
{
if (_dragging)
{
Point mposition = PointToClient(MousePosition);
mposition.Offset(_mouseX, _mouseY);
Location = mposition;
}
base.OnMouseMove(e);
}
protected override void OnMouseDown(MouseEventArgs e)
{
if (e.Button == MouseButtons.Left)
{
_dragging = true;
_mouseX = -e.X;
_mouseY = -e.Y;
BringToFront();
Invalidate();
}
base.OnMouseDown(e);
}
protected override void OnMouseUp(MouseEventArgs e)
{
if (_dragging)
{
_dragging = false;
Cursor.Clip = new Rectangle();
Invalidate();
}
base.OnMouseUp(e);
}
}
The OnMouseMove() code is bad. Do it like this instead:
private Point lastPos;
protected override void OnMouseMove(MouseEventArgs e) {
if (e.Button == MouseButtons.Left) {
int dx = e.X - lastPos.X;
int dy = e.Y - lastPos.Y;
Location = new Point(Left + dx, Top + dy);
// NOTE: do NOT update lastPos, the relative mouse position changed
}
base.OnMouseMove(e);
}
protected override void OnMouseDown(MouseEventArgs e) {
if (e.Button == MouseButtons.Left) {
lastPos = e.Location;
BringToFront();
this.Capture = true;
}
base.OnMouseDown(e);
}
protected override void OnMouseUp(MouseEventArgs e) {
this.Capture = false;
base.OnMouseUp(e);
}
The screen shot also shows evidence of the form not redrawing properly. You didn't leave any clue as to what might cause that.
I had a problem like this recently, and I solved it by setting the background color of the label to Color.Transparent.
If this doesn't solve it, then you should consider monitoring your event handling. It could be that you're registering more than one mouse move event and thus each method would interfere with the other.
EDIT :
Have you also tried overriding the OnPaint method of its parent class?
protected override void OnPaint(PaintEventArgs pe)
{
base.OnPaint(pe);
}
Maybe you should put focus on your element like
label1.Focus();

Categories

Resources