The key to scaling your WPF elements in a specific direction other than down and to the right are the CenterX and CenterY properties of the ScaleTransform.  It’s easy enough to set these manually, but that’s just lazy and asking for long term trouble.  Instead, decide how you want it to animate and bind it to something.  For instance, I have a touch screen keyboard I’m working on that I’d like to animate Up and to the Right when you are holding down the key.  Here’s how I did it:

<Page xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'>
  <Button Margin="5,5,5,5" Width="50" Height="50" x:Name="btnKey">
    My Button
    <Button.RenderTransform>
      <ScaleTransform x:Name="buttonscale" ScaleX="1" ScaleY="1" CenterX="0" CenterY="{Binding ElementName=btnKey, Path=ActualHeight}" />
    </Button.RenderTransform>
    <Button.Triggers>
      <EventTrigger RoutedEvent="Button.Click">
        <BeginStoryboard>
          <Storyboard>
            <DoubleAnimation Storyboard.TargetName="buttonscale" Storyboard.TargetProperty="(ScaleTransform.ScaleX)" To="1.5" Duration="0:0:0.25" AutoReverse="True"/>
            <DoubleAnimation Storyboard.TargetName="buttonscale" Storyboard.TargetProperty="(ScaleTransform.ScaleY)" To="1.5" Duration="0:0:0.25" AutoReverse="True"/>
          </Storyboard>
        </BeginStoryboard>
      </EventTrigger>
    </Button.Triggers>
  </Button>
</Page>

The key is that I bound the CenterX proeprty to the button’s ActualHeight property.  If you wanted to scale from some midpoint though, you’ll have to specify a Converter in your bind syntax.  This Converter technique is often cited in the ubiquitous “Reflection trick”.

• Previous Entry: PowerShell Profile on Roaming Profile
• Next Entry: Binding to an Image Byte[] in WPF