In WPF, after DoubleAnimation UIElement property cannot be changed?

Question

OK, I'm making a GUI for my MP3 player using WPF and I have a border that enlarges its width property for every second of the played track, thus making a "Progress Bar" for the currently played song. I named the border ProgressBarBorder. After the whole playlist is complete, I wanted to use a DoubleAnimation to fade out the border. Now, if I start the player again, the border reacts as it's supposed to (meaning the width starts from 0 and progresses to the end of the song), but the opacity property for some strange reason stays 0.0 (that is the value that DoubleAnimation sets). I have explicitly coded

ProgressBarBorder.Opacity = 1.0;

in the method that starts the playback. Nevertheless, it stays invisible. Now, if I don't use DoubleAnimation and just write

ProgressBarBorder.Opacity = 0.0;

when the playlist is complete, it does go back to 1.0 when I start the player again. This is the reason why I am positive that the animation is the one causing the problem. Also, isn't the property supposed to go back to it's original state after the animation is finished? If yes, my border should become visible automatically after the animation is complete.

Here's my partially pseudo-code:

if (TrackIsComplete)
{
    DoubleAnimation Fading = new DoubleAnimation();
    Fading.From = 1.0;
    Fading.To = 0.0;
    Fading.Duration = TimeSpan.FromSeconds(3);
    ProgressBarBorder.BeginAnimation(Border.OpacityProperty, Fading);
}

and

private void PlayTrack()
{
    ProgressBarBorder.Opacity = 1.0;
    Play();
    ....
}

Could anyone help please? Thanks.

Answer 1

When an Animation ends, it continues holding the value. This is what is causing the behavior you noticed, where setting the property does not appear to update it. Here's some info on how to set a property after an animation has been applied to it.

Answer 2

Play around with the FillBevior of your animation timeline. This might help: http://msdn.microsoft.com/en-us/library/system.windows.media.animation.fillbehavior.aspx