WinForms and WPF Diagram Control (Coming soon in v15.2)

It's that time of year again - time to talk about the new features/products we'll ship as part of v15.2.

First on my list is our new Visio inspired Diagram Control.

Before I start describing this new WinForms and WPF control, I want to ask those of you using or planning to use diagrams in a WinForms/WPF project to send an email to beta@devexpress.com. We want to engage you directly during our beta so we can better understand your needs, how you specifically use diagrams within your apps and how we can improve this product going forward.

WinForms Diagram Control - Designer

Because this is a significant control, I'm going to write a series of blog posts to detail its capabilities. For today, I'll share a few of its core options and as I mentioned a moment ago, ask active subscribers who are using diagrams to reach out to us so we can get you our beta.

Standard Operations

As you'd expect, the DevExpress Diagram Control for WinForms and WPF will support the following functionality:

  1. Drag & Drop
  2. Resizing
  3. Moving
  4. Rotation
  5. Zoom
  6. Cut/Copy/Paste
  7. Delete
  8. Undo/Redo
  9. Snap to Grid
  10. Snap to Items
  11. Animations (WinForms only - WPF will support animations in a later release)
  12. Rulers
  13. Dynamic Grid Background (grid size adjusts to zoom level)
  14. In-place Text Editing
  15. Context Menu + Popup Options Panel
Shape Collection

You can't have a diagram without shapes and in this release, we'll ship the following:

Basic Shape category - 45 shapes
Basic Flowchart Shape category - 14 shapes
SDL Diagram Shape category - 21 shapes
Arrow Shape category - 17 shapes
Software Icon category - 22
Decorative Shape category - 10 shapes

These 130 shapes support parameterization, allowing you to customize shape path. And yes, we've laid the foundation for you to define custom shapes as needed.

Connectors

DevExpress Diagram will include Visio inspired connectors (straight, curved and right angle) and automatic routing algorithms. You can also select arrow type (15 options to choose from) and its size.

===============

I'll stop there for now - please keep tuned to our website and these blogs over the next few weeks as I'll dig deeper into this new control and share more of its capabilities with you.



Nice work guys, great addition to a great toolset

10 November, 2015

Greate job! Will you support adding 'controls' as well?

10 November, 2015

Looks promising.  I sent an email to beta@.

10 November, 2015

WOW! I see a LOT of potential here!!

10 November, 2015

I'm currently using ILog Diagramming in LLBLGen Pro's designer (ILog was bought by IBM which killed the diagramming part right after that), and I'd love to use another diagramming library instead of ILog, but the features I'm looking for don't seem to be in your product for now it seems.

What I'm after is in particular:

- a way to create my own shapes, complex ones, so you can have a shape build from other shapes, like a list of fields inside a box with a header. If you can create a basic UML editor with it, you're good to go ;)

- a way to create a diagram with my shapes and connections between them which is laid out using an algorithm (configurable) and which layout can be altered by the user (move shapes around).

IMHO there are two kinds of applications for diagramming tooling: 1) showing a diagram with custom shapes in whatever form, build by software and 2) giving the user a canvas onto which the user can create a diagram (like the one in the picture), like in visio, using simple shapes, which have a form and a text label.

Hope this helps :)

10 November, 2015

Great!, now support a background image too please!

10 November, 2015

Great news!  Have two projects already in mind.

10 November, 2015

Great work guys. Another great addition to an already great tool set.

10 November, 2015

Amazing, a great control, exactly what I was looking for.

10 November, 2015

Really really great addition. Another reason why DevExpress is the right choice for me...

10 November, 2015

Webforms?

11 November, 2015

On what time would you release the Version 15.2?

11 November, 2015

Excellent, I definitely will use this new component. I rekon to use it for visualize my workflow status. Each node should have capability to display text / picture / Badge and can handle click/ double click event.

It will be nice if we can save /restore/ parsing to xml the control layout.

11 November, 2015

Any plan to implement the diagram viewer for asp.net?

11 November, 2015

Cool.

It would be nice to implement a feature to implement a custom algorithm to place items on the canvas (the automatic routing algorithm?). Currently I have an app where I visualise (goods) flows. In there I use a derived Kozo Sugiyama style to determine positions of shapes and (path of) lines in order to minimise crossed lines.

It would be also nice to have a zoom control/window just like the MapControl has.

11 November, 2015

Excellent addition , thank you

11 November, 2015

Hope it supports writing RTL text within the shapes with no problem , even like a memo edit from left to right but the letters are still displaying correct at the end. (Im talking about Arabic language)

Thanks

11 November, 2015

Nice start, but don't forget that we need this in ASP.Net too!

Also, in future blogs, I'm very interested in the databinding aspects.

11 November, 2015

Great news what an addition to the suite :)

11 November, 2015

It's ideal if you can link this diagram with the concept of Business Process Model (you can consult the web site www.bpmn.org) or integrate with workflow management (you can consult the web site www.processmaker.com)

11 November, 2015

We're looking forward to it!

11 November, 2015

Does it support automatic layout?

11 November, 2015

W00t!

11 November, 2015

this is great

11 November, 2015

Like Ngo Tung and DHOUIB Walid,

can imagine a solution for XAF (StateMachine module) to display and edit transitions. or making an own "Windows Workflow" module, without the overhead of WF4 (and its pitfalls).

Processes are hard to visualize (and edit) so it would be cool to "validate" a node when a connection is made.

As always, awesome work guys!

11 November, 2015

This is really great. I can think of some great enhancements to my current application with some modifications.

Will you attach events to each shape and path?

13 November, 2015

I'm so looking forward to using this new control. Great job!!

Actually I'm looking for a third party's diagram control as there is no one from DevExpress yet. My plan is combine "state machine" from Xaf with a GUI to visualize tasks and transitions for users. How about this?

14 November, 2015

Hi guys,

We appreciate all the comments in this blog post and share your feedback with our development team. In the meantime, discussing each of the requirements here would only create a mess in the comments. If you want to make sure that a specific feature is supported or want to share your requirement with us, please feel free to write us at beta@devexpress.com.

Thanks,

Alex

16 November, 2015

Excelent! Congrats it's a great addition

18 November, 2015

As some others have mentioned:

- Integrate with Business Process Management

- Make available in ASP.NET MVC

- Integrate with Windows Workflow

18 November, 2015

Was waiting for such a control for long. You are doing a really great job.

18 November, 2015

Our plan is to use them in generating our company organogram or building it dynamically from HR data stored.

thanks for the feature, looking forward to improving it

19 November, 2015

Automatically generating org chart off related data would be wonderful.

27 November, 2015

I would like to say - yeah - great. Some features I like, if not yet implemented:

* Add support for custom controls within a shape (a container)

* Add layout interface, so anyone can provide algorithms

* Add BPM shapes and swimlanes

* Add a grid shape so it will be easy to extend upon it (UML shapes)

* Add layers

I plan to use it for my modeldriven stuff and add a nice graphical representation.

@lollisoft

5 December, 2015

Great work

Please support an image in items and support org diagram with image

16 December, 2015

We have a home brew tool in our app.  It is for in house work and so ... its pretty rough.  Our application is slightly different but its a close fit: visualized construction and monitoring of objects and connections between those objects.

Many of the same concepts apply,

1) drop on custom shapes that represent different widgets

2) connect shapes with directed edges

3) set fields / configure the widgets

4) auto-layout of the shapes based on connections between shapes

This kind of applications needs:

1) graph routing or perhaps more flexible, a mechanism on which we could add custom auto-layout of the shapes and edges en.wikipedia.org/.../Graph_drawing

2) would be nice:  animated shapes.  Ability to add independent text fields to each shape that we can update on a timer.  Ability to animate visual indicators on the shapes - grouped shapes?

16 December, 2015

Thanks for your work.

I vote for implementation in ASP.NET too...

20 February, 2016

Please login or register to post comments.