Animace ve stylu

Tento příklad ukazuje, jak animovat vlastnosti v rámci stylu. Při animaci v rámci stylu, pouze prvek architektury, pro který je styl definován, lze cílit přímo. Chcete-li cílit na zmrazený objekt, musíte "dot down" z vlastnosti styled elementu.

V následujícím příkladu je definováno několik animací ve stylu a použity na .Button Když uživatel přesune myš nad tlačítko, zmizí z neprůsvitné na částečně průsvitné a zpět, a to opakovaně. Když uživatel přesune myš mimo tlačítko, stane se zcela neprůhláhlý. Po kliknutí na tlačítko se barva pozadí změní z oranžové na bílou a zpět. SolidColorBrush Vzhledem k tomu, že použité k nabarvení tlačítka nelze cílit přímo, je k němu přistupováno tak, že se k němu dostanete tak, že přejdete z vlastnosti tlačítka Background dolů.

Příklad

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

Všimněte si, že při animaci ve stylu je možné cílit na objekty, které neexistují. Předpokládejme například, že váš styl používá SolidColorBrush k nastavení vlastnosti pozadí tlačítka, ale v určitém okamžiku se styl přepíše a pozadí tlačítka je nastaveno LinearGradientBrushna . Při pokusu SolidColorBrush o animaci nedojde k výjimce. Animace jednoduše selže bezobslužně.

Další informace o syntaxi cílení na scénáře najdete v přehledu scénářů. Další informace o animaci najdete v přehledu animací. Další informace o stylech najdete v tématu Styly a šablonování.