Geek Answers Handbook

Why does this rotation animation become unstable?

I have a WPF application where the image continues to rotate and sometimes has some kind of animation. The rotation continues to run smoothly when the application is playing, except that two keyframes have the same value. For demonstration purposes, I reduced it to the right things:

<Window x:Class="WpfApplication3.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525"
    x:Name="RootElement">
<Window.Resources>

    <Storyboard x:Key="Storyboard1">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image">
            <SplineDoubleKeyFrame KeyTime="0" Value="0"/>
            <SplineDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
            <SplineDoubleKeyFrame KeyTime="0:0:3" Value="1"/>
            <SplineDoubleKeyFrame KeyTime="0:0:4" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>

</Window.Resources>
<Window.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
        <BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
    </EventTrigger>
</Window.Triggers>
<Grid>
    <Image x:Name="image" Source="image.jpg" RenderTransformOrigin="0.5,0.5" >
        <Image.RenderTransform>
            <RotateTransform Angle="{Binding Angle, ElementName=RootElement}" />
        </Image.RenderTransform>
    </Image>
</Grid>

A window contains an image element that has a RotateTransform as its rendertransform, with the rotation angle associated with the property in the window code.

There is also an animation that reduces the opacity of the image from 0 to 1 in the first second, then holds it at 1 for the next two seconds, and then fades from 1 to 0 in the last second.

The code is as follows:

public partial class MainWindow : Window, INotifyPropertyChanged
{
    public MainWindow()
    {
        InitializeComponent();

        timer = new DispatcherTimer();
        timer.Interval = TimeSpan.FromSeconds(1.0 / 30.0);
        timer.Tick += timer_Tick;
        timer.Start();
    }

    void timer_Tick(object sender, EventArgs e)
    {
        Angle += 360.0 * timer.Interval.TotalSeconds;
    }

    private DispatcherTimer timer;
    private double angle;

    public double Angle
    {
        get { return angle; }
        set 
        { 
            angle = value; 

            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs("Angle"));
            }
        }
    }


    public event PropertyChangedEventHandler PropertyChanged;
}

Angle double, RotateTransform. INotifyPropertyChanged . DispatcherTimer, 30 , Angle, .

, , 1 30 . , , 1, . , 0, .

, , , 1: :

<SplineDoubleKeyFrame KeyTime="0:0:3" Value="1.001"/>

... .

?

+4
1

DispatcherTimer - Background. : - .

DoubleAnimationUsingKeyFrames , , - , , .

new DispatcherTimer(DispatcherPriority.Normal) DoubleAnimation, , .

+2

More articles:


All Articles