C# WPF: Creating UI for drawing shapes using mouse

3
votes

I am developing an application in C# .NET using WPF. I want the users to be able to draw shapes on a draw area. The shapes are zigzag lines and polygons. The end points of line segments should be small squares as shown in the image below. In some cases, I need arrows in the middle of line segments as shown in the image below.

Sample image

I have partially implemented the drawing by adding lines to a canvas and resizing the lines on mouse events. However, I have not been able to implement creation of small squares on the end points of line segments and arrows.

Is there any package or tool that provides the functionality of drawing such shapes?

Thank you for any help which you can provide.

1
c#.netwpfgraphics
Check out Adorners msdn.microsoft.com/en-us/library/ms743737.aspx – RQDQ
Have a look at this great project: codeproject.com/Articles/22952/WPF-Diagram-Designer-Part-1 It makes heavy use of thumbs and Adorners, which you could use to implement your rectangles and your lines .. – SvenG
@RQDQ - With a tad more explanation, that's pretty much an answer to this question. – JDB
+1 - This is a clear and well-expressed question which shows some work and seeks more information (rather than a fully-formed solution). Welcome to stackoverflow! – JDB
Thank you SvenG. The reference you have provided is really good. Thank you Cyborgx37 for the appreciation. – geekowl

1 Answers

2
votes

A common way to approach this is to use Adorners. Basically, there is a virtual layer rendered for adorners. You can use these to drag / resize (among other things) visual elements on the screen with a little bit of glue code.

Here is a page from Microsoft on the subject: http://msdn.microsoft.com/en-us/library/ms743737.aspx?ppud=4