2010-11-14 26 views
16

Sto creando una dashboard in WPF con una serie di indicatori di prestazioni chiave, ognuno dei quali è costituito da tre valori.Come far lampeggiare un blocco di testo in wpf?

alt text

Ogni volta che i valori cambiano vorrei il controllo utente a lampeggiare per 5 secondi. Vorrei impostare il colore di sfondo del controllo per cambiare il colore di primo piano del blocco di testo e il colore di primo piano del blocco di testo per passare al colore di sfondo del controllo utente.

Tutta questa animazione WPF è nuova per me, quindi qualsiasi aiuto sarebbe molto apprezzato!

mio controllo utente si presenta come:

<Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="10" /> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="10" /> 
     <RowDefinition Height="Auto" /> 
    </Grid.RowDefinitions> 

    <TextBlock x:Name="TitleTextBlock" Text="Title" FontSize="32" HorizontalAlignment="Center" Grid.Row="0" FontFamily="OCR-A II" Foreground="White" VerticalAlignment="Bottom" /> 
    <TextBlock x:Name="Value1TextBlock" Text="0" FontSize="192" HorizontalAlignment="Center" Grid.Row="2" FontFamily="OCR-A II" VerticalAlignment="Center" Foreground="White" /> 
    <TextBlock x:Name="Value2TextBlock" Text="0" FontSize="32" HorizontalAlignment="Center" Grid.Row="4" FontFamily="OCR-A II" Foreground="White" VerticalAlignment="Top" /> 

</Grid> 

risposta

33

Per effettuare un batter TextBlock quando il suo testo modifiche che è possibile utilizzare ColorAnimationUsingKeyFrames. Il testo è vincolante per una proprietà denominata TextTitle.

<Window.Resources> 
    <Storyboard x:Key="blinkAnimation" Duration="0:0:5" > 
     <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Background).(SolidColorBrush.Color)" 
             Storyboard.TargetName="TitleTextBlock" 
             AutoReverse="True"> 
      <ColorAnimationUsingKeyFrames.KeyFrames> 
       <DiscreteColorKeyFrame KeyTime="0:0:0" Value="White"/> 
       <DiscreteColorKeyFrame KeyTime="0:0:1" Value="Black"/> 
       <DiscreteColorKeyFrame KeyTime="0:0:2" Value="White"/> 
       <DiscreteColorKeyFrame KeyTime="0:0:3" Value="Black"/> 
       <DiscreteColorKeyFrame KeyTime="0:0:4" Value="White"/> 
      </ColorAnimationUsingKeyFrames.KeyFrames> 
     </ColorAnimationUsingKeyFrames> 

     <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" 
             Storyboard.TargetName="TitleTextBlock" 
             AutoReverse="True"> 
      <ColorAnimationUsingKeyFrames.KeyFrames> 
       <DiscreteColorKeyFrame KeyTime="0:0:0" Value="Black"/> 
       <DiscreteColorKeyFrame KeyTime="0:0:1" Value="White"/> 
       <DiscreteColorKeyFrame KeyTime="0:0:2" Value="Black"/> 
       <DiscreteColorKeyFrame KeyTime="0:0:3" Value="White"/> 
       <DiscreteColorKeyFrame KeyTime="0:0:4" Value="Black"/> 
      </ColorAnimationUsingKeyFrames.KeyFrames> 
     </ColorAnimationUsingKeyFrames> 
    </Storyboard> 
</Window.Resources> 

<Grid Name="grid" Background="Black"> 
    <TextBlock x:Name="TitleTextBlock" Text="{Binding TextTitle, NotifyOnTargetUpdated=True}" FontSize="32" HorizontalAlignment="Center" Grid.Row="0" FontFamily="OCR-A II" Foreground="White" VerticalAlignment="Bottom" Background="Black"> 
     <TextBlock.Triggers> 
      <EventTrigger RoutedEvent="Binding.TargetUpdated"> 
       <EventTrigger.Actions> 
        <BeginStoryboard> 
         <StaticResource ResourceKey="blinkAnimation"/> 
        </BeginStoryboard> 
       </EventTrigger.Actions> 
      </EventTrigger> 
     </TextBlock.Triggers>  
    </TextBlock> 
</Grid> 

Questo renderà TextBlock lampeggiare ogni volta che i suoi cambiamenti di testo. Nota che devi impostare Sfondo e Primo piano esplicitamente su TextBlock prima di usare il blinkAnimation, altrimenti riceverai System.InvalidOperationException: la proprietà 'Background' non punta a un DependencyObject nel percorso '(0). (1)'.

Aggiornamento

di iniziare questa animazione dal codice dietro si può fare questo.

Storyboard blinkAnimation = TryFindResource("blinkAnimation") as Storyboard; 
if (blinkAnimation != null) 
{ 
    blinkAnimation.Begin(); 
} 
+0

Diciamo che voglio chiamare l'animazione per farlo lampeggiare ... come potrei farlo? – mattruma

+0

Dire che sto usando lo stesso storyboard per più TextBlock. Se chiamo 'blinkAnimation.Begin();' non lampeggeranno tutti? Cosa succede se voglio fare lampeggiare un particolare TextBlock? – epalm

Problemi correlati