Question

I need to develope a WPF custom control to show the layout and connectivity of nodes in a wireless mesh network. The user needs to be able to drag the nodes around. The canvas should grown and Scrollbars should appear as required if elements get draged off the available space. The ability to zoom in/out might be required.
My first take on this is to use a ListBox derived CustomControl with a Canvas based ItemsPanelTemplate. To get things moving Im using Josh Smiths DragCanvas that allows UIElements children of the canvas to be dragged around. My “node” class is not currently UIElement derived (the DragCanvas is currently working with the ListBoxItems that wrap my nodes).
1. Is this a bacially sensible approach or should I be abonding the ListBox idea and going something lower level?
2. I have to overlay the inter node link lines – not currently sure how to go about this (as a UIElement class that is part of the ControlTemplate?)
3. A few people seem to be having a headache with scrolbars in Canvases – is this going to be an issue?
Any general or specific advice most appreciated.

Answer 1

Wow, not bad as a control!

I am doing something similar, but it is not so simple.

1) IMHO, the DragCanvas is a basic way to host+drag elements. Since you will have to host labels (nodes), arcs and labels again (arcs’ weight), I think the DragCanvas would be harder than write a custom control by yourself.

Not everything comes easy with templating: sometime is much better the “old” approach winforms-like, or even a hybrid way.

2) As stated, I’d create a Canvas-derived panel, which will host several UIElements (labels, arcs, etc). All of them should be governed by a model+viewmodel. That’s a bit harder at the beginning, but it will give you a lot of satisfaction and flexibility in the future.

3) I don’t think the Canvas will give you any headache! A Canvas full of elements has always a size of zero. That leads “headaches” for those trying to add a scrollviewer.

Instead, the Canvas-derived class (above) should override the MeasureOverride method, so that its size will fit any of the hosted objects. However, it is a bit annoying the fact you cannot use negative coordinates (it will cause scrolling problems).

It’s hard to describe in few lines all the work behind a similar “editor”. The task isn’t easy, and the problems are many.

Hope it helps, anyway.

Cheers