title: WPF Image Transformation
body: <p>I have simple graphic images which I would like to transform on triggered events. Transform means change the width or move it to another position.</p>
  
  <p>For now I use the Image element of the toolbox and Animations via Storyboard, for instance DoubleAnimation or ThicknessAnimation.</p>
  
  <p>However the following issues arise:</p>
  
  <ol>
  <li>the images flickers when changing the width</li>
  <li>the image quality varies, does WPF support vector graphics?</li>
  </ol>
  
  <p>Regarding 1. my question is, if other animations should be used.</p>
  
  <hr>
  
  <p>So I tried the Transformation, see the code :</p>
  
  <pre><code>    &lt;Image Height="150" HorizontalAlignment="Left" Margin="12,0,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Source="images/side_view.jpg" Width="1244"&gt;
          &lt;Image.RenderTransform&gt;
              &lt;ScaleTransform x:Name="Minimize"  ScaleX="1.0" ScaleY="1.0"/&gt;
          &lt;/Image.RenderTransform&gt;
      &lt;/Image&gt;
  
      &lt;Button Content="Next Train" Height="23" HorizontalAlignment="Left" Margin="528,233,0,0" Name="btnNext" VerticalAlignment="Top" Width="75" /&gt;
      &lt;Grid.Triggers&gt;
          &lt;EventTrigger RoutedEvent="Button.Click" SourceName="btnNext"&gt;
              &lt;BeginStoryboard&gt;
                  &lt;Storyboard TargetName="Minimize" TargetProperty="ScaleX"&gt;
                      &lt;DoubleAnimation To="0.65" Duration="0:0:2"/&gt;
                  &lt;/Storyboard&gt;
              &lt;/BeginStoryboard&gt;
          &lt;/EventTrigger&gt;
  </code></pre>
  
  <p>Works the same as the Animation I applied to width and margin. However, it still flickers! Are there any reasonable explanations?</p>