A Tree’y Spidery Type WPF Diagram Control
I recently started a new job where I am employed as a WPF developer. When I arrived the guys there gave me a brief that was to make a cool app, and they really liked the look and feel of the FamilyShow exemplar by Vertigo. Which I also love, that and Tangerine by Infragistics are my favourite WPF demos.
What I liked in both where the fluid movements and the diagramming approach used in the FamilyShow exemplar particularly. The guys where I just started working asked me how hard it would be to create something like the diagramming component seen in the FamilyShow exemplar.
So without further ado I contacted my favourite partner in weird WPF briefs, Mr Fredrik Bornander, who I love working with on these stranger ideas. We seem to manage to do a reasonable job together, at least I think anyway.
Here is a screenshot of what we managed to achieve just to wet your appetite:
I have created a full codeproject article to detail the full implementation of this control, which is available using the codeproject article link, A Spider type control tree thingy for WPF
But here is brief list of what it does, hope it helps someone out:
- Uses a specialized
ScrollViewerwhich allows the user to use the mouse to create a friction enabled drag operation (this is pretty cool actually) - Only shows 3 layers of the tree Maximum to keep it clean
- Current node selected is centered within available area
- Node collapse expand buttons automatically enabled dependant on number of children the current node has
Enjoy
Ralph Arvesen said
am September 22 2008 @ 2:26 pm
Thanks for the sample project, I’ll try to check it out, it looks interesting.
- ralph (vertigo)
sacha said
am September 22 2008 @ 3:54 pm
No worries Ralph, thanks for you and Alan and Vertigo for doing such a great job on FamilyShow to begin with. Tell Bee Tan, I would still love to come work at Vertigo at some point.
2008 September 23 - Links for today « My (almost) Daily Links said
am September 23 2008 @ 11:38 am
[...] Barber branches out into A Tree’y Spidery Type WPF Diagram Control (sorry, couldn’t resist) and talks us through Binding And Using Localized Enums In WPF [...]
Mike said
am September 24 2008 @ 8:27 pm
Maybe you can take some ideas from this control: http://networkvisualiser.com/default.aspx
sacha said
am September 24 2008 @ 9:08 pm
Yes its by DotNetSolutions, and I am quite familiar with it, and have even been interviewed by them in the past. We used that control at my last company.
Thanks anyhow
Dr.Luiji said
am September 26 2008 @ 8:15 pm
I liked the article indeed.
Well done.
sacha said
am September 27 2008 @ 6:26 am
thanks man
Jo said
am January 31 2009 @ 2:46 pm
Wow, great control Sacha!
Just a quick question: Would you help me (of course not for free) to go on with the development of this control? At the moment we are using the above mentioned networkvisualizer control, but I think they stopped developing it and… I need some more cool gimmicks
(and we’re not able to program them on our own because we don’t have a real WPF Developer in our team)
If you’d like to, please contact me!
Regards, Jo