Jesse Liberty - Silverlight Geek

Did You Know... That You Can Create A Timer Using XAML Animation?

To do so, create a Storyboard and mark that you will handle the Completed event.

<Storyboard Completed="OnTimerCompleted">

Put in the simplest Animation you can manage (name it, so that you can set the duration programmatically).

<DoubleAnimation x:Name="TimerDuration"

make sure you give it a duration, and point it at the simplest object you can create.

Duration="00:00:01.00" 
Storyboard.TargetName="MyRect"
Storyboard.TargetProperty="Height"

When the duration expires you can take action and, if you wish, reset the timer.

function OnTimerCompleted...

Here's a complete sample...

<Canvas xmlns="http://schemas.microsoft.com/client/2007" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    
    <Canvas.Resources>
        <Storyboard 
            x:Name="myTimer" 
            Completed="OnTimerCompleted">
            <DoubleAnimation x:Name="TimerDuration"
                Duration="00:00:01.00" 
                Storyboard.TargetName="MyRect"
                Storyboard.TargetProperty="Height" />
        </Storyboard>
    </Canvas.Resources>

    <Canvas>
        <Rectangle x:Name="MyRect"/>
    </Canvas>

</Canvas>

Here's the javascript...

MyDemo.Scene.prototype =
{
    handleLoad: function(plugIn, userContext, rootElement) 
    {
        // set the timer duration
        timer = plugIn.content.findName("TimerDuration"); 
        timer.Duration="00:00:05.00";
        
        // start the timer
        myStoryboard = plugIn.content.findName("myTimer"); 
        myStoryboard.begin();
    }
}

function OnTimerCompleted(sender, args)
{
       alert ("Timer completed!");
       myStoryboard = sender.findName("myTimer");
       myStoryboard.begin();  //restart timer
}