This documentation is archived and is not being maintained.

How to: Apply a LayoutTransform to an Element

This example shows how to apply a LayoutTransform to an element. The example creates an instance of Button and hosts it within a parent Grid. It also uses the LayoutTransform property to apply a RotateTransform to the Button.

Performance Note: Before using LayoutTransform, be sure that you understand how this property can affect performance.

LayoutTransform can lead to poor application performance if you invoke it in a scenario that does not require a full pass by the layout system. When you apply a LayoutTransform to the Children collection of the Panel, it triggers a new pass by the layout system and forces all on-screen objects to be remeasured and rearranged. If you are updating the complete application user interface (UI), this functionality might be exactly what you need. However, if you do not need a full layout pass, use the RenderTransform property, which does not invoke the layout system, and therefore, is typically a better choice for this scenario.

Button btn2 = new Button();
btn2.Background = Brushes.LightCoral;
btn2.Content = "RotateTransform";
btn2.LayoutTransform = new RotateTransform(45, 25, 25);
Grid.SetRow(btn2, 0);
Grid.SetColumn(btn2, 1);
grid1.Children.Add(btn2);
<Button Grid.Row="0" Grid.Column="1" Background="LightCoral" Content="RotateTransform Applied">
  <Button.LayoutTransform>
    <RotateTransform CenterX="25" CenterY="25" Angle="45" />
  </Button.LayoutTransform>
</Button>

For the complete sample, which shows each of the available layout transforms, see Applying a LayoutTransform to an Element Sample.

Show: