Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>NOTE: the point values I'm referring to here are relative to the object's original location and not specific point values.</p> <p>I think the issue is that the Storyboard, while it has played all the way through, has not actually stopped. When you establish the end point of (-20,-20), that is relative to it's beginning point. Playing the animation again (assuming no keyframe at time zero) will move the object from it's existing location (-20,-20) to the target location which is also (-20,-20). This gives the appearance of no animation which is technically not accurate. If you had a separate animation with no keyframe at zero that moved the same object it would begin from wherever the object happens to be to the first keyframe in the animation.</p> <p>If you actually Stop the animation the object will return to it's original value at (0,0). Test this by adding a different Button that issues a Stop [I use the ControlStoryboardAction behavior for this]. Here is a sample you can use to test this:</p> <pre><code>&lt;UserControl 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:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" mc:Ignorable="d" x:Class="Animation1.MainPage" Width="640" Height="480"&gt; &lt;UserControl.Resources&gt; &lt;Storyboard x:Name="Storyboard1"&gt; &lt;DoubleAnimation Duration="0:0:0.8" To="-20" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="rectangle" d:IsOptimized="True" /&gt; &lt;DoubleAnimation Duration="0:0:0.8" To="-20" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="rectangle" d:IsOptimized="True" /&gt; &lt;/Storyboard&gt; &lt;/UserControl.Resources&gt; &lt;Grid x:Name="LayoutRoot" Background="White"&gt; &lt;Button Content="Play" HorizontalAlignment="Left" Height="37" Margin="35,53,0,0" VerticalAlignment="Top" Width="65"&gt; &lt;i:Interaction.Triggers&gt; &lt;i:EventTrigger EventName="Click"&gt; &lt;ei:ControlStoryboardAction Storyboard="{StaticResource Storyboard1}" /&gt; &lt;/i:EventTrigger&gt; &lt;/i:Interaction.Triggers&gt; &lt;/Button&gt; &lt;Rectangle x:Name="rectangle" Fill="#FF0303FF" Height="99" Margin="275,0,207,57" Stroke="Black" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5"&gt; &lt;Rectangle.RenderTransform&gt; &lt;CompositeTransform /&gt; &lt;/Rectangle.RenderTransform&gt; &lt;/Rectangle&gt; &lt;Button Content="Stop" HorizontalAlignment="Left" Height="40" Margin="35,115,0,0" VerticalAlignment="Top" Width="65"&gt; &lt;i:Interaction.Triggers&gt; &lt;i:EventTrigger EventName="Click"&gt; &lt;ei:ControlStoryboardAction ControlStoryboardOption="Stop" Storyboard="{StaticResource Storyboard1}" /&gt; &lt;/i:EventTrigger&gt; &lt;/i:Interaction.Triggers&gt; &lt;/Button&gt; &lt;/Grid&gt; </code></pre> <p></p> <p>I think you are going to have to approach this particular problem differently. The easiest would be to place this in a Canvas and manage the Top and Left values (preferably through a binding). The idea would be to capture the storyboard completion and update the values in the binding and then Stop the animation. This should give the correct starting point for the next time the animation is Played. Sorry I don't have time to put this together, but hopefully this will get you farther along.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload