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.

UIElement.RenderTransform Property

Gets or sets transform information that affects the rendering position of this element. This is a dependency property.

Namespace: System.Windows
Assembly: PresentationCore (in presentationcore.dll)
XML Namespace:  http://schemas.microsoft.com/winfx/2006/xaml/presentation

public Transform RenderTransform { get; set; }
/** @property */
public Transform get_RenderTransform ()

/** @property */
public void set_RenderTransform (Transform value)

public function get RenderTransform () : Transform

public function set RenderTransform (value : Transform)

For XAML information, see the Transform type.

Property Value

Describes the specifics of the desired render transform. The default is Transform.Identity.

Identifier field

RenderTransformProperty

Metadata properties set to true

None

A render transform does not regenerate layout size or render size information. Render transforms are typically intended for animating or applying a temporary effect to an element. For example, the element might zoom when focused or moused over, or might jitter on load to draw the eye to that part of the user interface (UI).

This example shows how to use a ScaleTransform to flip a UIElement horizontally or vertically. In this example, a Button control (a type of UIElement) is flipped by applying a ScaleTransform to its RenderTransform property.

The following illustration shows the button to flip.

The UIElement to flip


A button with no transform

The following shows the code that creates the button.

<Button Content="Flip me!" Padding="5">
</Button>

To flip the button horizontally, create a ScaleTransform and set its ScaleX property to -1. Apply the ScaleTransform to the button's RenderTransform property.

<Button Content="Flip me!" Padding="5">
  <Button.RenderTransform>
    <ScaleTransform ScaleX="-1" />
  </Button.RenderTransform>
</Button>

The button after applying the ScaleTransform


A button flipped horizontally about (0,0)

As you can see from the previous illustration, the button was flipped, but it was also moved. That's because the button was flipped from its top left corner. To flip the button in place, you want to apply the ScaleTransform to its center, not its corner. An easy way to apply the ScaleTransform to the buttons center is to set the button's RenderTransformOrigin property to 0.5, 0.5.

<Button Content="Flip me!" Padding="5"
  RenderTransformOrigin="0.5,0.5">
  <Button.RenderTransform>
    <ScaleTransform ScaleX="-1" />
  </Button.RenderTransform>
</Button>

The button with a RenderTransformOrigin of 0.5, 0.5


A button flipped horizontally about its center

To flip the button vertically, set the ScaleTransform object's ScaleY property instead of its ScaleX property.

<Button Content="Flip me!" Padding="5"
  RenderTransformOrigin="0.5,0.5">
  <Button.RenderTransform>
    <ScaleTransform ScaleY="-1" />
  </Button.RenderTransform>
</Button>

The vertically flipped button


A button flipped vertically about its center

Windows 98, Windows Server 2000 SP4, Windows CE, Windows Millennium Edition, Windows Mobile for Pocket PC, Windows Mobile for Smartphone, Windows Server 2003, Windows XP Media Center Edition, Windows XP Professional x64 Edition, Windows XP SP2, Windows XP Starter Edition

The Microsoft .NET Framework 3.0 is supported on Windows Vista, Microsoft Windows XP SP2, and Windows Server 2003 SP1.

.NET Framework

Supported in: 3.0
Was this page helpful?
(1500 characters remaining)
Thank you for your feedback

Community Additions

Show:
© 2014 Microsoft