Postupy: Nastavení vlastnosti po animaci pomocí scénáře

Článek
10/18/2023

V některýchpřípadechch

Animace barvy SolidColorBrush

V následujícím příkladu Storyboard se používá k animaci barvy SolidColorBrush. Scénář se aktivuje po kliknutí na tlačítko. Událost Completed je zpracována tak, aby program byl upozorněn po ColorAnimation dokončení.

<Button
  Content="Animate and Then Set Example 1">
  <Button.Background>
    <SolidColorBrush x:Name="Button1BackgroundBrush"
      Color="Red" />
  </Button.Background>
  <Button.Triggers>
    <EventTrigger RoutedEvent="Button.Click">
      <BeginStoryboard>
        <Storyboard>
          <ColorAnimation
            Storyboard.TargetName="Button1BackgroundBrush"
            Storyboard.TargetProperty="Color"
            From="Red" To="Yellow" Duration="0:0:5"
            FillBehavior="HoldEnd"
            Completed="setButton1BackgroundBrushColor" />
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Button.Triggers>
</Button>

Změna barvy štětce

Po dokončení ColorAnimation se program pokusí změnit barvu štětce na modrou.

private void setButton1BackgroundBrushColor(object sender, EventArgs e)
{

    // Does not appear to have any effect:
    // the brush remains yellow.
    Button1BackgroundBrush.Color = Colors.Blue;
}

Private Sub setButton1BackgroundBrushColor(ByVal sender As Object, ByVal e As EventArgs)

    ' Does not appear to have any effect:
    ' the brush remains yellow.
    Button1BackgroundBrush.Color = Colors.Blue
End Sub

Předchozí kód se zdá, že nic nedělá: štětec zůstane žlutý, což je hodnota zadaná ColorAnimation tímto animovaným štětcem. Hodnota základní vlastnosti (základní hodnota) se ve skutečnosti změní na modrou. Platná nebo aktuální hodnota však zůstává žlutá, protože ColorAnimation stále přepisuje základní hodnotu. Pokud chcete, aby se základní hodnota stala efektivní hodnotou znovu, je nutné zastavit animaci ovlivnit vlastnost. Existují tři způsoby, jak to udělat pomocí animací scénáře:

Nastavte vlastnost animace FillBehavior na Stop
Odeberte celou storyboard.
Odeberte animaci z jednotlivé vlastnosti.

Nastavení vlastnosti FillBehavior animace na Hodnotu Stop

Nastavením na Stophodnotu FillBehavior , řeknete animaci, aby přestala mít vliv na jeho cílovou vlastnost, jakmile dosáhne konce aktivního období.

<Button
  Content="Animate and Then Set Example 2">
  <Button.Background>
    <SolidColorBrush x:Name="Button2BackgroundBrush"
      Color="Red" />
  </Button.Background>
  <Button.Triggers>
    <EventTrigger RoutedEvent="Button.Click">
      <BeginStoryboard>
        <Storyboard>
          <ColorAnimation
            Storyboard.TargetName="Button2BackgroundBrush"
            Storyboard.TargetProperty="Color"
            From="Red" To="Yellow" Duration="0:0:5"
            FillBehavior="Stop"
            Completed="setButton2BackgroundBrushColor" />
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Button.Triggers>
</Button>

private void setButton2BackgroundBrushColor(object sender, EventArgs e)
{

    // This appears to work:
    // the brush changes to blue.
    Button2BackgroundBrush.Color = Colors.Blue;
}

Private Sub setButton2BackgroundBrushColor(ByVal sender As Object, ByVal e As EventArgs)

    ' This appears to work:
    ' the brush changes to blue.
    Button2BackgroundBrush.Color = Colors.Blue
End Sub

Odebrání celé scénáře

Pomocí triggeru RemoveStoryboard Storyboard.Remove nebo metody sdělíte animacím scénáře, aby přestaly ovlivňovat jejich cílové vlastnosti. Rozdíl mezi tímto přístupem a nastavením vlastnosti spočívá v FillBehavior tom, že scénář můžete kdykoli odebrat, zatímco FillBehavior vlastnost má efekt pouze v případě, že animace dosáhne konce aktivního období.

<Button
  Name="Button3"
  Content="Animate and Then Set Example 3">
  <Button.Background>
    <SolidColorBrush x:Name="Button3BackgroundBrush"
      Color="Red" />
  </Button.Background>
  <Button.Triggers>
    <EventTrigger RoutedEvent="Button.Click">
      <BeginStoryboard Name="MyBeginStoryboard">
        <Storyboard x:Name="MyStoryboard">
          <ColorAnimation
            Storyboard.TargetName="Button3BackgroundBrush"
            Storyboard.TargetProperty="Color"
            From="Red" To="Yellow" Duration="0:0:5"
            FillBehavior="HoldEnd"
            Completed="setButton3BackgroundBrushColor" />
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Button.Triggers>
</Button>

private void setButton3BackgroundBrushColor(object sender, EventArgs e)
{

     // This appears to work:
    // the brush changes to blue.
    MyStoryboard.Remove(Button3);
    Button3BackgroundBrush.Color = Colors.Blue;
}

Private Sub setButton3BackgroundBrushColor(ByVal sender As Object, ByVal e As EventArgs)

     ' This appears to work:
    ' the brush changes to blue.
    MyStoryboard.Remove(Button3)
    Button3BackgroundBrush.Color = Colors.Blue
End Sub

Odebrání animace z jednotlivé vlastnosti

Další technikou, jak zastavit animaci, aby ovlivnila vlastnost, je použít BeginAnimation(DependencyProperty, AnimationTimeline) metodu animovaného objektu. Zadejte vlastnost, která se bude animovat jako první parametr a null jako druhá.

<Button
  Name="Button4"
  Content="Animate and Then Set Example 4">
  <Button.Background>
    <SolidColorBrush x:Name="Button4BackgroundBrush"
      Color="Red" />
  </Button.Background>
  <Button.Triggers>
    <EventTrigger RoutedEvent="Button.Click">
      <BeginStoryboard>
        <Storyboard>
          <ColorAnimation
            Storyboard.TargetName="Button4BackgroundBrush"
            Storyboard.TargetProperty="Color"
            From="Red" To="Yellow" Duration="0:0:5"
            FillBehavior="HoldEnd"
            Completed="setButton4BackgroundBrushColor" />
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Button.Triggers>
</Button>

private void setButton4BackgroundBrushColor(object sender, EventArgs e)
{

     // This appears to work:
    // the brush changes to blue.
    Button4BackgroundBrush.BeginAnimation(SolidColorBrush.ColorProperty, null);
    Button4BackgroundBrush.Color = Colors.Blue;
}

Private Sub setButton4BackgroundBrushColor(ByVal sender As Object, ByVal e As EventArgs)

     ' This appears to work:
    ' the brush changes to blue.
    Button4BackgroundBrush.BeginAnimation(SolidColorBrush.ColorProperty, Nothing)
    Button4BackgroundBrush.Color = Colors.Blue
End Sub

Tato technika funguje také pro animace, které nejsou scénářem.

Sdílet prostřednictvím