I just want to know how can i drag and drop a line which was created dynamically at runtime (mouse draw line) in c# . The dynamic line was placed over a panel.
I have used two ways in the past:
On MouseDown calculate the distance between the line and the mouse cursor. If it is within a couple of pixels start dragging. While the MouseButton is down respond to the MouseMove by translating the startpoint and the endpoint of the line over the same vector (current mouse position - start dragging mouse position)
On MouseDown test the color of the pixel under the mouse cursor to see if it is over the line. If so do the same dragging as above.
The tricky thing is that option 1 is hard when there are multiple lines that are close and you need to find out which line needs to be dragged
Option 2 is hard when the line is very thin.
Another way is to draw a thicker line on an invisible bitmap when a line is drawn and test the pixel on the invisible bitmap. That way you can give a bit more tolerance AND you could give each invisible line a color that is distinct so it is easier to identify what line has been clicked.
Does this make sense?
Related
I have a canvas where i draw a Line during mouse move. After I have the line, I want to show an overlay when the mouse is over/near the line. I know that I can use the MouseEnter and MouseLeave events from the Line object, but this is really hard when the Line object was created with a StrokeThickness of 1px. So how can I increase the MouseEnter or MouseLeave area to show my overlay even if the mouse pointer is not exactly on the line itself (some defined area around)?
I've been learning how to draw lines in winforms apps, and I'd like to be able to select something (rectangle, for example) that has already been drawn by left clicking it, and then be able to move it around to another location by dragging it with the mouse.
How can this be done? I don't see any methods for this so I think I will need to figure out if there is anything where I left-click on the form, and if there is, then somehow figure out the dimensions of it and redraw it appropriately. Is this correct? And how would I know where the reactangle starts, where it ends, how heigh it is, what color(s) it has, and what if it's overlapping another line, rectangle or another shape?
I've not been able to find much on the System.Drawing namespace for things like this, and what I have found so far is just basic "How to draw lines" type stuff.
Your drawing is a bitmap, not a vectorial image. Basically, it's just lots of pixels. Once your rectangle is drawn, it's just some pixels, but the rectangle itself (with coordinates and size) doesn't exist anymore.
What you can do is saving data for every shape (in a List for example). Then, when you click on your image to select something, you test every object in your list in reverse order until the mouse coordinates are within your shape. Then, if, for example, you want to delete the shape, you remove the shape from your list, then you clear your image and redraw every shape in your list.
I want to write a GUI editor in C# for AutoIt, but I am not good enough with C#. I want to draw a square (focused) around an object when any object in the GUI is pressed. Like this:
Is there any library to make easier to write this kind of thing?
Square is drawn with one of DrawRectangle functions. Each of them requires a pen. Usually we use ordinary solid pen, but you need a pen with changed DashStyle property. For dotted lines change this property to DashStyle.Dot. You can also experiment with DashPattern property.
To draw little squares around the big square you need one of FillRectangle functions. Each of them requires a brush. You need a white brush, which is conveniently predefined for you to use. After filling a rectangle, you have to draw a rectangle over it with the same dimensions. These two functions together give an impression of empty and lined rectangle.
To make little squares a little rounded, like they are in the image, you have to change a pen parameter used when calling DrawRectangle. Experiment with LineJoin, and other properties of the Pen class.
This is very hard for a simple question that you posted. There are a lot of things that you need to take care of.
First I would suggest to make a class that will have a Rectangle property since you can't subclass Rectangle because it is a structure.
You will need to handle the drawing, that is the simplest task as mentioned in the other answers so I'm not going to be specific about that.
Since you have small squares that indicate that the rectangle can be resized, you will have to implement method that checks whether the mouse point is within the big rectangle or some of the small suqares. In this case you should change your cursor to indicate the possibility of resizing.
To handle moving (but not resizing) of the rectangle you will have either to make a new small square with the sign for moving in all directions or you will handle that using cursor when the mouse position is within the Big Rectangle.
The main problem is identifying what to change when resizing, you have two options:(1) to change Location and Size properties or to change X, Y, Width and (2)Height properties of the rectangle. For instance, when you are moving top-right corner you should change both Location and Size in first case or Y and Width is you are using second option.
When you move the mouse while it is clicked, you should watch out in which direction mouse moves. If you split the viewport in quadrants where the center of your rectangle is the center of the Decartes coordinate system, by identifying in which quadrant is the mouse you will know which corner (or edge) of the quadrant you need to move.
Each mouse move will have to call Invalidate() because you can't use Xor like in C++. Therefore, when your Rectangle is displayed, you should be in a special mode where everything that not moves (not changes, everything except Rectangle and selected control) should be drawn to the Bitmap that is used between two redraws and you should only draw what is moving.
As you can see, there is a lot of things that should be taken care of. You should start with this only after you are sure that you have already implemented other parts of your program.
I want to achieve the following with a WPF application (in a certain area/defined area):
When clicking and holding on the app, you can draw a square
You can do this as many times, but not overlap any squares
You can drag squares around the application
What do I need to achieve this, I assume a bunch of onclick/onmove's. Is there an easier way, such as using canvas? Any insight would be great.
You will have to use a canvas if you want the squares to appear where the user clicks and drags.
The mouse down event would define one corner and the mouse up the second. You'd have to constrain the movement of the cursor so that the x and y dimensions of the rectangle were the same.
On each mouse move event you'd have to check if the cursor were over one of the existing squares and prevent the square growing any further.
For the dragging of existing squares modify the mouse down event to check what's under the cursor. If it's the canvas start the square drawing mode, if it's a rectangle (square) then start the dragging mode. Again you'd need to use the mouse move event to check that the square doesn't intersect with any existing squares.
There's a code project article describing how to drag elements inside a Canvas: Dragging Elements in a Canvas
Speaking of ChrisF's mentioning of using a Canvas, I would suggest you use DragCanvas (found in the article)
I am creating a silverlight application which will allow you to click at two places on the screen and will draw an ellipse whose major axis starts and ends at the click locations. The clickable area is a Silverlight Grid control. Currently:
When you first click, I am:
Dropping a marker at the click
point.
Creating an ellipse and parenting it
to the Grid.
Creating and setting an
AngleTransform on the ellipse.
As you move the mouse, I am:
Calculating the distance to the
first click point.
Setting the Width of the ellipse to
this length.
Calculating the angle of a line to
the click point and the Grid's
X-Axis.
Setting the Ellipse's AngleTransform Angle to this angle.
So far, so good. The ellipse is displayed, and its length and angle of rotation follow the mouse as it moves.
However, the major axis of the ellipse is offset from the click point.
How do I position the Ellipse so its major axis starts at the click point and ends at the current mouse position?
The answer turned out to be:
Don't use System.Windows.Shapes.Ellipse. Instead use System.Windows.Shapes.Path and embed an EllipseGeometry in it.
Also set the Path.RenderTransform to a RotateTransform.
Don't set Width or Height or Stretch on the Path. Instead set the Center, RadiusX, and RadiusY of the EllipseGeometry.
Finally, set the RotateTransform.Angle to the angle of intersection of the Ellipse major-axis and the X-axis (the ArcTan of the major-axis slope). Also set RotateTransform.CenterX and CenterY to the EllipseGeometry Center.
If I had to guess (code would help), I would think that you could add padding from the difference of the beginning click point to the left side of the grid, which should help move it over by the offset.
May be it's a good idea to use Canvas instead of grid for your application, than you will be able to set up shapes coordianates directly.