How to: Apply Multiple Transforms to an Object

This example shows how to use a TransformGroup to group two or more Transform objects into a single composite Transform.

Example

The following example uses a TransformGroup to apply a ScaleTransform and a RotateTransform to a Button.

<Page 
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" >
  <StackPanel Margin="50">

      <Button 
        RenderTransformOrigin="0.5,0.5"
        HorizontalAlignment="Center">Click
        <Button.RenderTransform>

          <!-- TransformGroup enables you to apply multiple transforms. In 
               this example, the button is scaled and rotated. -->
          <TransformGroup>

            <!-- Triple the size (scale) of the button in the Y direction. -->
            <ScaleTransform ScaleY="3" />

            <!-- Rotate the button by 45 degrees. -->
            <RotateTransform Angle="45" />
            
          </TransformGroup>
        </Button.RenderTransform>
      </Button>
    
  </StackPanel>
</Page>

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;

namespace SDKSample
{
    public partial class MultipleTransformsExample : Page
    {
        public MultipleTransformsExample()
        {
            // Create a Button that will have two transforms applied to it.
            Button myButton = new Button();
            myButton.Content = "Click";
            
            // Set the center point of the transforms.
            myButton.RenderTransformOrigin = new Point(0.5,0.5);

            // Create a transform to scale the size of the button.
            ScaleTransform myScaleTransform = new ScaleTransform();

            // Set the transform to triple the scale in the Y direction.
            myScaleTransform.ScaleY = 3;

            // Create a transform to rotate the button
            RotateTransform myRotateTransform = new RotateTransform();

            // Set the rotation of the transform to 45 degrees.
            myRotateTransform.Angle = 45;

            // Create a TransformGroup to contain the transforms
            // and add the transforms to it.
            TransformGroup myTransformGroup = new TransformGroup();
            myTransformGroup.Children.Add(myScaleTransform);
            myTransformGroup.Children.Add(myRotateTransform);

            // Associate the transforms to the button.
            myButton.RenderTransform = myTransformGroup;

            // Create a StackPanel which will contain the Button.
            StackPanel myStackPanel = new StackPanel();
            myStackPanel.Margin = new Thickness(50);
            myStackPanel.Children.Add(myButton);
            this.Content = myStackPanel;

        }
    }
}

See Also

Reference

RenderTransform
TransformGroup

Concepts

Transforms Overview

Other Resources

2-D Transforms Sample