#4 - Usare lo Storyboard come timer
di Marco Leoncini, in Silverlight 1.0, 21 febbraio 2008
Lo Storyboard è un tassello fondamentale dell'architettura di Silverlight, l'uso che comunemente siamo abituati a farne è inerente alla definizione di un'animazione, ma può essere agevolmente usato come timer al posto del classico setinterval.
Creiamo una nuova scena inserendo al centro un TextBlock, impostiamo la proprietà Text a 5.
<Canvas xmlns="http://schemas.microsoft.com/client/2007 "
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="560" Height="560"
Background="#FFFF0000"
x:Name="Page">
<TextBlock Canvas.Left="221"
Canvas.Top="135"
TextWrapping="Wrap"
Foreground="#FFFFFFFF"
FontSize="140"
FontWeight="Bold"
x:Name="MyCountdownTextBlock"
Text="5">
</TextBlock>
</Canvas>
Proseguiamo aggiungendo tra le risorse del Canvas uno Storyboard, creiamo un event handler per l'evento Completed di quest'ultimo e uno per l'evento Loaded del TextBlox.
L'evento Completed è sollevato quando lo Storyboard e tutte le animazioni figlie sono ormai concluse e inattive.
Da tenere a ben presente che impostando RepeatBehavior su Forever l'evento Completed non verrà mai sollevato.
<Canvas.Resources>
<Storyboard x:Name="CountdownStoryboard" Duration="00:00:01" Completed="StoryBoardStep" />
</Canvas.Resources>
<TextBlock Loaded="StartTimer"></TextBlock>
Nella funzione StartTimer eseguiamo lo Storyboard con questo codice:
function StartTimer(sender)
{
sender.findName("CountdownStoryboard").Begin();
}
Mentre nella funzione StoryBoardStep eseguiamo dei semplici calcoli per realizzare un conto alla rovescia.
function StoryBoardStep(sender, eventArgs)
{
var _textBlock = sender.findName("MyCountdownTextBlock");
var _number = Number(_textBlock.Text);
if(_number != NaN)
{
if(_number > 1)
{
sender.findName("CountdownStoryboard").Begin();
_number --;
_textBlock.Text = _number.toString();
}
else
{
_textBlock.Text = "GO!!!";
}
}
}
Perchè usare lo Storyboard al posto di setinterval? Perche può essere recuperato come qualsiasi altro oggetto, possiamo stopparlo, metterlo in pausa o ripeterlo tutte le volte che vogliamo come nel nostro esempio.
Approfondimenti
- #22 - Multithreading in Silverlight 2.0: operazioni asincrone in background
- #24 - Animare l'ingombro di un elemento con dimensioni dinamiche
- #19 - Maschere sfumate in Silverlight con OpacityMask e ImageBrush
- Rilasciata la versione Beta 2 di Silverlight 2.0
- Sbirciare nello XAML dei controlli inclusi in Silverlight 2
- Accesso ai dati in Silverlight 2.0
- RTM per Expression Studio 2
- #8 - Accedere a dati esposti con WebService con Silverlight 1.0
- Real Code Birthday: 10 anni!
- #2 - Estendere il plugin a tutta l'area della finestra del browser
- 3, 2, 1: azione! Le animazioni in Silverlight
- XAML per Silverlight - Seconda parte
Commenti
Esprimi il tuo giudizio su questo script:
Per procedere devi essere autenticato.
Aggiungi un nuovo commento »»»
Per inserire un commento, devi registrarti alla nostra community.
Segnala su: 
Stampa 
Download
