Gewusst wie: Auslösen einer Animation bei Änderung eines Eigenschaftswerts

  • Artikel

In diesem Beispiel wird gezeigt, wie sie einen Trigger verwenden, um ein Storyboard zu starten, wenn sich ein Eigenschaftswert ändert. Sie können ein Trigger innerhalb eines Style, einer ControlTemplate oder einer DataTemplate verwenden.

Beispiel

Im folgenden Beispiel wird ein Trigger zum Animieren der Opacity eines Button verwendet, wenn seine IsMouseOver-Eigenschaft sich auf true ändert.

<!-- PropertyTriggerExample.xaml
     Shows how to use property triggers to start animations. -->
<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  WindowTitle="Animate Properties with Storyboards">
  <Page.Resources>
  
    <Style x:Key="PropertyTriggerExampleButtonStyle" TargetType="{x:Type Button}">
      
      <Setter Property="Opacity" Value="0.25" />
      
      <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">

          <Trigger.EnterActions>
            <BeginStoryboard>
              <Storyboard>
                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                  To="1" Duration="0:0:1" />
              </Storyboard>
            </BeginStoryboard>
          </Trigger.EnterActions>
          <Trigger.ExitActions>
            <BeginStoryboard>
              <Storyboard>
                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                  To="0.25" Duration="0:0:1" />
              </Storyboard>
            </BeginStoryboard>
          </Trigger.ExitActions>          
        </Trigger>               
      </Style.Triggers>    
    </Style>
  </Page.Resources>

  <StackPanel Margin="20">

    <Button Style="{StaticResource PropertyTriggerExampleButtonStyle}">
      Move the mouse over me.
    </Button>

  </StackPanel>
</Page>

Animationen, die durch Objekte mit der Eigenschaft Trigger angewendet werden, verhalten sich komplexer als EventTrigger-Animationen oder Animationen, die mit Storyboard-Methoden gestartet werden. Sie „übergeben“ mit Animationen, die von anderen Trigger-Objekten definiert werden, aber mit EventTrigger und von Methoden ausgelösten Animationen zusammengesetzt sind.

Weitere Informationen