Kezmondo
May 28th, 2009, 06:28 AM
Hi,
I have used Expression Blend to create a very simple animation where an image moves across the screen.
In code (c#), I have a DispatcherTimer which puts the image co-ordinates in a TextBlock with each tick using MyImage.GetValue(Canvas.LeftProperty).
My problem is that the co-ordinates being read never change, they are always the start position, even though I can see the image moving across the screen. If I don't use the storyboard, and instead move the image using MyImage.SetValue(Canvas.LeftProperty, newXpos) then the co-ordinates DO update correctly. It seems that the storyboard method does not update the Canvas.LeftProperty and Canvas.TopProperty values.
Am I missing something here? I want to be able to read the position of an object during an animation, for things like collision detection.
Thanks!
The XAML:
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="AnimateTest.Page"
Width="640" Height="480">
<UserControl.Resources>
<Storyboard x:Name="MoveDuck">
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Donald" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" BeginTime="00:00:00">
<SplineDoubleKeyFrame KeyTime="00:00:02" Value="608"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Donald" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" BeginTime="00:00:00">
<SplineDoubleKeyFrame KeyTime="00:00:02" Value="448"/>
</DoubleAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" BeginTime="00:00:00">
<SplineColorKeyFrame KeyTime="00:00:02" Value="#FFF24D4D"/>
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" BeginTime="00:00:00">
<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF5F5D5D"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
<Canvas x:Name="LayoutRoot">
<Canvas.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FF000000"/>
<GradientStop Color="#FFFFFFFF" Offset="1"/>
</LinearGradientBrush>
</Canvas.Background>
<Image Source="duck.JPG" Canvas.Top="50" Canvas.Left="50" RenderTransformOrigin="0.5,0.5" x:Name="Donald">
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Image.RenderTransform>
</Image>
<TextBlock Height="13" Width="65" Canvas.Left="20" Canvas.Top="378" Text="TextBlock" TextWrapping="Wrap" x:Name="txtPos"/>
</Canvas>
</UserControl>
I have used Expression Blend to create a very simple animation where an image moves across the screen.
In code (c#), I have a DispatcherTimer which puts the image co-ordinates in a TextBlock with each tick using MyImage.GetValue(Canvas.LeftProperty).
My problem is that the co-ordinates being read never change, they are always the start position, even though I can see the image moving across the screen. If I don't use the storyboard, and instead move the image using MyImage.SetValue(Canvas.LeftProperty, newXpos) then the co-ordinates DO update correctly. It seems that the storyboard method does not update the Canvas.LeftProperty and Canvas.TopProperty values.
Am I missing something here? I want to be able to read the position of an object during an animation, for things like collision detection.
Thanks!
The XAML:
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="AnimateTest.Page"
Width="640" Height="480">
<UserControl.Resources>
<Storyboard x:Name="MoveDuck">
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Donald" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" BeginTime="00:00:00">
<SplineDoubleKeyFrame KeyTime="00:00:02" Value="608"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Donald" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" BeginTime="00:00:00">
<SplineDoubleKeyFrame KeyTime="00:00:02" Value="448"/>
</DoubleAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" BeginTime="00:00:00">
<SplineColorKeyFrame KeyTime="00:00:02" Value="#FFF24D4D"/>
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" BeginTime="00:00:00">
<SplineColorKeyFrame KeyTime="00:00:02" Value="#FF5F5D5D"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
<Canvas x:Name="LayoutRoot">
<Canvas.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FF000000"/>
<GradientStop Color="#FFFFFFFF" Offset="1"/>
</LinearGradientBrush>
</Canvas.Background>
<Image Source="duck.JPG" Canvas.Top="50" Canvas.Left="50" RenderTransformOrigin="0.5,0.5" x:Name="Donald">
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Image.RenderTransform>
</Image>
<TextBlock Height="13" Width="65" Canvas.Left="20" Canvas.Top="378" Text="TextBlock" TextWrapping="Wrap" x:Name="txtPos"/>
</Canvas>
</UserControl>