Information
The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

How to: Translate an Element

This example shows how to translate (move) an element by using a TranslateTransform.

The TranslateTransform class is especially useful for moving elements inside panels that do not support absolute positioning. For example, by applying a TranslateTransform to the RenderTransform property of an element, you can move an element within a StackPanel or DockPanel.

Use the X property of the TranslateTransform to specify the amount, in pixels, to move the element along the x-axis. Use the Y property to specify the amount, in pixels, to move the element along the y-axis. Finally, apply the TranslateTransform to the RenderTransform property of the element.

The following example uses a TranslateTransform to move an element 50 pixels to the right and 50 pixels down.

<Rectangle Height="50" Width="50" 
  Fill="#CCCCCCFF" Stroke="Blue" StrokeThickness="2"
  Canvas.Left="100" Canvas.Top="100">
  <Rectangle.RenderTransform>
    <TranslateTransform X="50" Y="50" />
  </Rectangle.RenderTransform>
</Rectangle>

For the complete sample, see 2-D Transforms Sample.

Show:
© 2014 Microsoft