How to animate a ProgressBar Value Property using Storyboard DoubleAnimation in Windows 8.1

Question

I have a Windows 8.1 application with a Progress defined as follows

<ProgressBar x:Name="myProgressBar" Opacity="1" Minimum="0" Maximum="100" Value="0"/>

I have the following StoryBoard animation defined as follows.

<Storyboard x:Name="myStoryBoard">
    <DoubleAnimation Storyboard.TargetName="myProgressBar"
                     Storyboard.TargetProperty="Value"
                     From="0"
                     To="100"
                     Duration="00:00:04" />
</Storyboard>

This C# code behind calls the begin function of the Storyboard.

myStoryBoard.Begin();

But I don't see any change in the Value Property of the ProgressBar.

However if I apply a similar StoryBoard animation for Opacity property of the same ProgressBar, it works seamlessly, I can see the ProgressBar fading away as expected.

<Storyboard x:Name="myOpacityStoryBoard">
        <DoubleAnimation Storyboard.TargetName="myProgressBar"
                         Storyboard.TargetProperty="Opacity"
                         From="1"
                         To="0"
                         Duration="0:0:4">
</Storyboard>

I am not sure what's happening. I checked that the Value Property is a double just like how Opacity is. Am I doing something wrong?

I would be glad if someone can guide me in the right direction.

Answer 1

You just need to add EnableDependentAnimation="True" to your animation.

<Storyboard x:Name="myStoryBoard">
    <DoubleAnimation Storyboard.TargetName="myProgressBar"
             Storyboard.TargetProperty="Value"
             EnableDependentAnimation="True"
             From="0"
             To="100"
             Duration="00:00:04" />
</Storyboard>