Come animare in uno stile

In questo esempio viene illustrato come animare le proprietà all'interno di uno stile. Quando si anima all'interno di uno stile, è possibile specificare direttamente solo l'elemento framework per il quale viene definito lo stile. Per impostare come destinazione un oggetto liberabile, è necessario "punto verso il basso" da una proprietà dell'elemento con stile.

Nell'esempio seguente diverse animazioni vengono definite all'interno di uno stile e applicate a un oggetto Button. Quando l'utente sposta il mouse sul pulsante, si dissolve da opaco a parzialmente traslucente e indietro, ripetutamente. Quando l'utente sposta il mouse fuori dal pulsante, diventa completamente opaco. Quando si fa clic sul pulsante, il colore di sfondo cambia da arancione a bianco e indietro. Poiché l'oggetto SolidColorBrush usato per disegnare il pulsante non può essere indirizzato direttamente, è accessibile puntando verso il basso dalla proprietà del Background pulsante.

Esempio

<!-- StyleStoryboardsExample.xaml
     This example shows how to create storyboards in a style. -->
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  WindowTitle="Storyboards in Styles Example" Background="White">
  <Page.Resources>
  
    <!-- Defines a Button style. -->
    <Style TargetType="{x:Type Button}" x:Key="MyButtonStyle">
      <Setter Property="Button.Background">
        <Setter.Value>
          <SolidColorBrush Color="Orange" />
        </Setter.Value>
      </Setter>
      <Style.Triggers>
      
        <!-- Animates the button's opacity on mouse over. -->
        <EventTrigger RoutedEvent="Button.MouseEnter">
          <EventTrigger.Actions>
            <BeginStoryboard>
              <Storyboard>
                <DoubleAnimation
                  Storyboard.TargetProperty="(Button.Opacity)"
                  From="1.0" To="0.5" Duration="0:0:0.5" AutoReverse="True"
                  RepeatBehavior="Forever" />
              </Storyboard>
            </BeginStoryboard>
          </EventTrigger.Actions>
        </EventTrigger>  
        
        <!-- Returns the button's opacity to 1 when the mouse leaves. -->
        <EventTrigger RoutedEvent="Button.MouseLeave">
          <EventTrigger.Actions>
            <BeginStoryboard>
              <Storyboard>
                <DoubleAnimation
                  Storyboard.TargetProperty="(Button.Opacity)"
                  To="1" Duration="0:0:0.1" />
              </Storyboard>
            </BeginStoryboard>
          </EventTrigger.Actions>
        </EventTrigger>   
        
        <!-- Changes the button's color when clicked. 
             Notice that the animation can't target the
             SolidColorBrush used to paint the button's background
             directly. The brush must be accessed through the button's
             Background property. -->
        <EventTrigger RoutedEvent="Button.Click">
          <EventTrigger.Actions>
            <BeginStoryboard>
              <Storyboard>
                <ColorAnimation 
                  Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"
                  From="Orange" To="White" Duration="0:0:0.1" AutoReverse="True" />
              </Storyboard>
            </BeginStoryboard>
          </EventTrigger.Actions>
        </EventTrigger>  
      </Style.Triggers>
    </Style>
  </Page.Resources>
  
  <StackPanel Margin="20">
    <Button Style="{StaticResource MyButtonStyle}">Click Me</Button>
  </StackPanel>
</Page>

Si noti che quando si anima all'interno di uno stile, è possibile impostare come destinazione gli oggetti che non esistono. Si supponga, ad esempio, che lo stile usi un SolidColorBrush oggetto per impostare la proprietà di sfondo di un pulsante, ma a un certo punto lo stile viene sottoposto a override e che lo sfondo del pulsante sia impostato con un oggetto LinearGradientBrush. Il tentativo di animare l'oggetto SolidColorBrush non genererà un'eccezione. L'animazione avrà semplicemente esito negativo in modo invisibile all'utente.

Per altre informazioni sulla sintassi di destinazione dello storyboard, vedere Cenni preliminari sugli storyboard. Per altre informazioni, vedere Cenni preliminari sull'animazione. Per altre informazioni sugli stili, vedere Applicazione di stili e modelli.