WPF 2D SkewTransform

<Window x:Class="WpfApplication13.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="SkewTransform" Height="330" Width="710">
<Window.Resources >
<SolidColorBrush x:Key="MyGrayGridBrush" Color="YellowGreen"/>
</Window.Resources>
<Viewbox Stretch="Uniform">
<Grid Width="725" Height="330" 
HorizontalAlignment="Left" 
VerticalAlignment="Top"  
ShowGridLines="True">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="310" />
<ColumnDefinition Width="410" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0">
<TextBlock HorizontalAlignment="Center" 
Margin="10,10,10,0" 
TextWrapping="Wrap"  
FontSize="14" FontWeight="Bold" 
Text="Skew Animation"/>
<TextBlock Margin="10,10,10,0"  
TextWrapping="Wrap" 
Text="The Skew properties AngleX and AngleY are animated form 0 to 360"/>
<Border Margin="10" BorderBrush="Black" 
BorderThickness="1"  
Background="{StaticResource MyGrayGridBrush}" 
HorizontalAlignment="Left">
	<Canvas ClipToBounds="True" Width="240" 
Height="250">
		<Rectangle Canvas.Left="100"  
Canvas.Top="80"  
Width="50" Height="70" 
Fill="LightCoral"  
Opacity="0.5" 
Stroke="Black"  
StrokeThickness="2">
			<Rectangle.RenderTransform>
				<SkewTransform x:Name="skew" CenterX="25" CenterY="35"/>
			</Rectangle.RenderTransform>
		</Rectangle>
		<!-- Animate the rectangle: -->
		<Canvas.Triggers>
			<EventTrigger RoutedEvent="Canvas.Loaded">
				<BeginStoryboard>
					<Storyboard RepeatBehavior="Forever">
						<DoubleAnimation Storyboard.TargetName="skew" 
Storyboard.TargetProperty="AngleX" 
From="0" To="360" Duration="0:0:10"/>
						<DoubleAnimation Storyboard.TargetName="skew" 
Storyboard.TargetProperty="AngleY" 
From="0" To="360" Duration="0:0:10"/>
					</Storyboard>
				</BeginStoryboard>
			</EventTrigger>
		</Canvas.Triggers>
	</Canvas>
</Border>
</StackPanel>
 
<StackPanel Grid.Column="1">
<TextBlock  HorizontalAlignment="Center" 
Margin="10,10,10,10" 
TextWrapping="Wrap" 
FontSize="14" FontWeight="Bold" 
Text="Interactive Skew"/>
<Grid Width="360" Height="26" 
HorizontalAlignment="Left" 
VerticalAlignment="Top">
	<Grid.ColumnDefinitions>
		<ColumnDefinition Width="70" />
		<ColumnDefinition Width="50" />
		<ColumnDefinition Width="70" />
		<ColumnDefinition Width="50" />
	</Grid.ColumnDefinitions>
 
	<TextBlock Margin="2,2,10,2" 
TextAlignment="Right" 
Text="AngleX"/>
	<Slider Name="tbAngleX" Width="50" 
Height="20" Grid.Column="1" 
Maximum="360" Minimum="0" Value="0"/>
	<TextBlock Margin="2,2,10,2" 
Grid.Column="2" 
TextAlignment="Right" 
Text="AngleY"/>
	<Slider Name="tbAngleY" Width="50" 
Height="20" Grid.Column="3" 
Maximum="360" Minimum="0" Value="0"/>
</Grid>
 
<Border Margin="10" BorderBrush="Black" 
BorderThickness="1" 
Background="{StaticResource MyGrayGridBrush}" 
HorizontalAlignment="Left">
	<Canvas ClipToBounds="True"  
Width="410" Height="250">
		<TextBlock Canvas.Left="90"  
Canvas.Top="63"  
Text="Original shape"/>
		<Rectangle Canvas.Top="80" 
Canvas.Left="100" 
Width="50" Height="70" 
Stroke="Black" 
StrokeThickness="1" 
StrokeDashArray="3,1"/>
 
		<Rectangle Canvas.Top="80" 
Canvas.Left="100"  
Width="50" Height="70" 
Fill="LightCoral"  
Opacity="0.5"  
Stroke="Black"  
StrokeThickness="2">
			<!-- Set interactive scale: -->
			<Rectangle.RenderTransform>
				<SkewTransform CenterX="25" CenterY="35" 
AngleX="{Binding ElementName=tbAngleX,Path=Value}" 
AngleY="{Binding ElementName=tbAngleY,Path=Value}"/>
			</Rectangle.RenderTransform>
		</Rectangle>
	</Canvas>
</Border>
</StackPanel>
</Grid>
</Viewbox>
</Window>
 

reference : Practical WPF Graphics Programming