title: Make Border Scale Up on Load WPF
body: <p>For the life of me, I cannot figure out why the simple setup below is not working.  I just want a border to scale up ("zoom in") once its loaded, with the zoom-in functionality wrapped up in a resource style.  But when the following XAML runs, the border just loads at 100% scale, no animation happens.  Your help will be much appreciated!</p>
  
  <pre><code>    &lt;Style x:Key="SZoomIn" TargetType="FrameworkElement"&gt;
          &lt;Setter Property="RenderTransform"&gt;
              &lt;Setter.Value&gt;
                  &lt;ScaleTransform/&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
          &lt;Style.Triggers&gt;
              &lt;EventTrigger RoutedEvent="Loaded"&gt;
                  &lt;BeginStoryboard&gt;
                      &lt;Storyboard&gt;
                          &lt;DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleX)"&gt;
                              &lt;LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/&gt;
                              &lt;LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/&gt;
                          &lt;/DoubleAnimationUsingKeyFrames&gt;
                          &lt;DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleY)"&gt;
                              &lt;LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/&gt;
                              &lt;LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/&gt;
                          &lt;/DoubleAnimationUsingKeyFrames&gt;
                      &lt;/Storyboard&gt;
                  &lt;/BeginStoryboard&gt;
              &lt;/EventTrigger&gt;
          &lt;/Style.Triggers&gt;            
      &lt;/Style&gt;
      &lt;Style x:Key="SBorder" BasedOn="{StaticResource SZoomIn}" TargetType="Border"&gt;
          &lt;Setter Property="VerticalAlignment" Value="Center"/&gt;
          &lt;Setter Property="HorizontalAlignment" Value="Center"/&gt;
          &lt;Setter Property="RenderTransformOrigin" Value="0.5,0.5"/&gt;
      &lt;/Style&gt;
  
      &lt;!-- ....... --&gt;
  
      &lt;Border Style="{StaticResource SBorder}"/&gt;
  </code></pre>
  
  <p><strong>EDIT</strong>:  I did not show the complete markup above so that things could be kept simple, but my <em>complete</em> markup is below.  Note that, because there are buttons inside the Border, the Border <em>does</em> have Height/Width at run-time.</p>
  
  <pre><code>&lt;Window x:Name="StartWindow" x:Class="MEACruncher.MainWindow"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      xmlns:local="clr-namespace:MEACruncher"
      mc:Ignorable="d"
      Title="MEA Cruncher" Height="393" Width="659" Margin="0" WindowState="Maximized"&gt;
  &lt;Window.Background&gt;
      &lt;ImageBrush ImageSource="Resources/NeuronBackground.jpg" Stretch="UniformToFill"/&gt;
  &lt;/Window.Background&gt;
  &lt;Window.Resources&gt;
      &lt;SolidColorBrush x:Key="BabyBlue"&gt;#FF4D7EB8&lt;/SolidColorBrush&gt;
      &lt;SolidColorBrush x:Key="BlackBkgrd"&gt;#B2000000&lt;/SolidColorBrush&gt;
      &lt;Style x:Key="SBtn" TargetType="Button"&gt;
          &lt;Setter Property="Margin" Value="0,5"/&gt;
          &lt;Setter Property="Background" Value="{StaticResource BabyBlue}"/&gt;
          &lt;Setter Property="BorderBrush" Value="{x:Null}"/&gt;
          &lt;Setter Property="Padding" Value="10,3"/&gt;
          &lt;Setter Property="FontSize" Value="24"/&gt;
      &lt;/Style&gt;
      &lt;Style x:Key="STopBtn" BasedOn="{StaticResource SBtn}" TargetType="Button"&gt;
          &lt;Setter Property="Margin" Value="0,0,0,5"/&gt;
      &lt;/Style&gt;
      &lt;Style x:Key="SBottomBtn" BasedOn="{StaticResource SBtn}" TargetType="Button"&gt;
          &lt;Setter Property="Margin" Value="0,5,0,0"/&gt;
      &lt;/Style&gt;
      &lt;Style x:Key="SZoomIn" TargetType="FrameworkElement"&gt;
          &lt;Setter Property="RenderTransform"&gt;
              &lt;Setter.Value&gt;
                  &lt;ScaleTransform/&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
          &lt;Style.Triggers&gt;
              &lt;EventTrigger RoutedEvent="Loaded"&gt;
                  &lt;BeginStoryboard&gt;
                      &lt;Storyboard&gt;
                          &lt;DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleX)"&gt;
                              &lt;LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/&gt;
                              &lt;LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/&gt;
                          &lt;/DoubleAnimationUsingKeyFrames&gt;
                          &lt;DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleY)"&gt;
                              &lt;LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/&gt;
                              &lt;LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/&gt;
                          &lt;/DoubleAnimationUsingKeyFrames&gt;
                      &lt;/Storyboard&gt;
                  &lt;/BeginStoryboard&gt;
              &lt;/EventTrigger&gt;
          &lt;/Style.Triggers&gt;            
      &lt;/Style&gt;
      &lt;Style x:Key="SBorder" BasedOn="{StaticResource SZoomIn}" TargetType="Border"&gt;
          &lt;Setter Property="BorderBrush" Value="{StaticResource BabyBlue}"/&gt;
          &lt;Setter Property="BorderThickness" Value="2"/&gt;
          &lt;Setter Property="Background" Value="{StaticResource BlackBkgrd}"/&gt;
          &lt;Setter Property="CornerRadius" Value="5"/&gt;
          &lt;Setter Property="Padding" Value="10"/&gt;
          &lt;Setter Property="VerticalAlignment" Value="Center"/&gt;
          &lt;Setter Property="HorizontalAlignment" Value="Center"/&gt;
          &lt;Setter Property="RenderTransformOrigin" Value="0.5,0.5"/&gt;
      &lt;/Style&gt;
      &lt;Style x:Key="SStackPnl" TargetType="StackPanel"&gt;
          &lt;Setter Property="VerticalAlignment" Value="Center"/&gt;
          &lt;Setter Property="HorizontalAlignment" Value="Center"/&gt;            
      &lt;/Style&gt;
  &lt;/Window.Resources&gt;
  
  &lt;Border x:Name="MainBorder" Style="{StaticResource SBorder}"&gt;
      &lt;StackPanel x:Name="MainStackPnl" Style="{StaticResource SStackPnl}"&gt;
          &lt;Button x:Name="ViewProjectsBtn" Content="View Projects" Style="{StaticResource STopBtn}" Click="ViewProjectsBtn_Click"/&gt;
          &lt;Button x:Name="AboutBtn" Content="About" Style="{StaticResource SBtn}" Click="AboutBtn_Click"/&gt;
          &lt;Button x:Name="ExitBtn" Content="Exit" Style="{StaticResource SBottomBtn}" Click="ExitBtn_Click"/&gt;
      &lt;/StackPanel&gt;
  &lt;/Border&gt;
  
  &lt;/Window&gt;
  </code></pre>