title: How to animate the movement of a button between 2 positions in xaml, UWP
body: <p>I have two buttons.  One is an edit button that when clicked allows the editing of other objects on the page.  My hope is to have the second button appear only once this "edit state" has been initiated.  That part isn't very difficult.  However, I don't want to just alter the 1st button's alignment from right to left to make space for the 2nd button (a cancel button) to the 1st button's right - I want to animate this movement, as if to make it appear that the moving of the 1st button to the left, is uncovering the 2nd button.</p>
  
  <p>I've been searching for hours trying to find out how to do this, and there's a multitude of options for WPF, but not many solutions for UWP applications.</p>
  
  <p>So far, I've found this:</p>
  
  <pre><code>&lt;Button x:Name="EoIdButton" Grid.Row="0" Grid.Column="2" view:EventHandlers.Attach="Click" BorderBrush="DarkGray" FontFamily="Segoe MDL2 Assets" Content="{Binding EoIdButtonContent, Mode=TwoWay, Converter={StaticResource SegoeConverter}}" Style="{StaticResource CircleButtonStyle}" Visibility="{Binding EoVis, Mode=TwoWay, Converter={StaticResource BooleanToVisibilityConverter}}"&gt;
                  &lt;interactivity:Interaction.Behaviors&gt;
                      &lt;core:DataTriggerBehavior Binding="{Binding SomeProperty, Mode=TwoWay}"&gt;
                          &lt;core:ChangePropertyAction&gt;&lt;/core:ChangePropertyAction&gt;
                      &lt;/core:DataTriggerBehavior&gt;
                  &lt;/interactivity:Interaction.Behaviors&gt;
              &lt;/Button&gt;
  </code></pre>
  
  <p>So, while I can change a property using this, I don't see how to create an animation.  My guess, based on my searching would be to use a Storyboard, but again, most of the solutions I've found pertain to WPF and/or don't work because the scenario is too different.  If someone has a solution for this, it'd be great.</p>
  
  <p>For additionaly clarity
  I have button 1:</p>
  
  <pre><code>      (EditButton)
  </code></pre>
  
  <p>When (EditButton) is clicked, I want edit button to rendertransform/animate left and the result to look like so:</p>
  
  <pre><code>(EditButton)(CancelButton)
  </code></pre>
  
  <p>When either edit button or cancel button are clicked, I want it to return to the original state</p>