"Infinite" Panel in WPF

Question

For an internal tool, I need to create something akin to Blender's node editor (see image below) or UE4's blueprint editor with WPF.

The backend and individual blocks aren't a problem, but I'm not sure how to go about an arbitrary sized and expanding canvas. I thought about using a Canvas inside a ScrollViewer, but I think that would be difficult to scroll left (i.e. if the user had to add nodes to the left of what the ScrollViewer thinks is the edge). I'm relatively new to WPF, so could someone point me in the right direction?

Answer 1

You will have to write your own custom Panel implementation with IScrollInfo interface. Through this interface you can dynamically change extent size of your panel at any time using ScrollOwner.InvalidateScrollInfo() method. Here are some links that will get you started:

Ben Constable excellent blog post series about IScrollInfo

Virtualizing Canvas example implementation

Your final code should contain an ItemsControl that is using your custom panel inside a ScrollViewer. As for drawing the connections between blocks, I personally would use transparent layer above your panel with OnRender code that draws them using DrawingContext.

EDIT:

Check out this article. There is a working node editor-like control here.