How do you do relative positioning in WPF?

Question

How can you relatively position elements in WPF? The standard model is to use layout managers for everything, but what if you want to position elements (on a Canvas, for example) simply based on the position of other elements?

For example, you may want one element (say a button) to be attached the side of another (perhaps a panel) independent of the position or layout of that panel. Anyone that's worked with engineering tools (SolidWorks, AutoCad, etc.) is familiar with this sort of relative positioning.

Forcing everything into layout managers (the different WPF Panels) does not make much sense for certain scenarios, where you don't care that elements are maintained by some parent container and you do not want the other children to be affected by a change in the layout/appearance of each other. Does WPF support this relative positioning model in any way?

Answer 1

Instead of putting (as in your example) a button directly on the canvas, you could put a stackpanel on the canvas, horizontally aligned, and put the two buttons in there.

Like so:

<Canvas>
  <StackPanel Canvas.Left="100" Canvas.Top="100" Orientation="Horizontal">
    <Button>Button 1</Button><Button>Button 2</Button>
  </StackPanel>
</Canvas>

I think that it's quite flexible when you use more than 1 layout in a form, and you can create pretty much any configuration you want.

Answer 2

Good question. As far as I know, we need to have a different custom panel to get this feature. Since WPF is based on Visual Hierarchy there is no way to have this sort of Flat structure for the elements in the platform.

But Here is a trick to do this. Place your elements in the same position and give relative displacement by using RenderTransform.TranslateTransform. This way your TranslateTransfrom's X and Y will always be relatuve to the other element.