Silverlight - Creating a canvas with auto-alignment and scale

How can i create a canvas of this kind - http://www.silverdiagram.net/Projects/SilverDiagram/SilverDiagram_Demo.aspx? I want to position the controls exactly aligned to each other. 开发者_高级运维I want to help users to align it properly using auto-alignment (like visual studio) and by providing user the scale.

The Canvas is the right container to use as you can position its child control by coordinates. Your problem is more about moving elements around, which is in fact drag & drop.

You'll have to handle mouse events: MouseDown to select an item, MouseMove to detect a drag and MouseUp to drop it. During the move or at the drop, you can change the element's coordinates to auto-align it on a grid or compared to surrounding elements.

I successfully made such a project in Silverlight and used Adorners to add resize handlers to the elements.

I solved the panning and zooming question by putting the Canvas into a Viewbox, which was in a ScrollViewer. If you want to let the user control the zoom factor, apply a LayoutTransform to the Canvas (available in the Toolkit).