Jak animować w stylu

W tym przykładzie pokazano, jak animować właściwości w stylu. Podczas animowania w stylu tylko element struktury, dla którego zdefiniowany jest styl, może być skierowany bezpośrednio. Aby odwołać się do obiektu zamrażalnego, musisz przejść od właściwości elementu stylizowanego.

W poniższym przykładzie kilka animacji jest zdefiniowanych w stylu i zastosowanych do elementu Button. Gdy użytkownik przenosi wskaźnik myszy nad przycisk, wielokrotnie zmienia się z nieprzezroczystego na częściowo prześwitujący i z powrotem. Gdy użytkownik przesuwa wskaźnik myszy z przycisku, staje się całkowicie nieprzezroczysty. Po kliknięciu przycisku jego kolor tła zmienia się z pomarańczowego na biały i z powrotem. Ponieważ SolidColorBrush używane do malowania przycisku nie można bezpośrednio zastosować, jest on uzyskiwany przez kropkowanie w dół od właściwości Background przycisku.

Przykład

<!-- 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>

Należy pamiętać, że w przypadku animowania w stylu można celować w obiekty, które nie istnieją. Załóżmy na przykład, że styl używa SolidColorBrush do ustawiania właściwości tła przycisku, ale w pewnym momencie styl jest zastępowany, a tło przycisku jest ustawiane na LinearGradientBrush. Próba animowania SolidColorBrush nie wygeneruje wyjątku; animacja po prostu nie powiedzie się bez powiadomienia.

Aby uzyskać więcej informacji na temat składni docelowej scenorysów, zobacz Storyboards Overview. Aby uzyskać więcej informacji na temat animacji, zobacz Omówienie animacji. Aby uzyskać więcej informacji na temat stylów, zobacz Style and Templating.