İngilizce dilinde oku

Aracılığıyla paylaş

Nasıl yapılır: Storyboard ile Animasyonu Bitirdikten Sonra Bir Özelliği Ayarlama

  • Makale

Bazı durumlarda, animasyon oluşturulduktan sonra bir özelliğin değerini değiştiremeyebilirsiniz.

SolidColorBrush’un rengini animasyonla değiştirin

Aşağıdaki örnekte, bir SolidColorBrushrengine animasyon eklemek için bir Storyboard kullanılır. Düğmeye tıklandığında görsel taslak tetikleniyor. Completed olayı işlenir, böylece ColorAnimation tamamlandığında programa bildirim gönderilir.

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

Fırça rengini değiştirme

ColorAnimation tamamlandıktan sonra, program fırçanın rengini mavi olarak değiştirmeye çalışır.

C# 
private void setButton1BackgroundBrushColor(object sender, EventArgs e)
{

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

Önceki kod hiçbir şey yapmıyor gibi görünüyor: fırça sarı kalır ve bu, fırçayı canlandıran ColorAnimation tarafından sağlanan değerdir. Temel alınan özellik değeri (temel değer) aslında maviye dönüştürülür. Ancak etkin veya geçerli değer sarı kalır çünkü ColorAnimation hala temel değerin yerine geçiyor. Temel değerin yeniden etkin değer olmasını istiyorsanız, animasyonunun özelliği etkilemesini durdurmanız gerekir. Bunu görsel taslak animasyonlarıyla yapmanın üç yolu vardır:

  • Animasyon FillBehavior özelliğini Stop olarak ayarlayın

  • Storyboard'un tamamını kaldırın.

  • Animasyonu tek tek özellikten kaldırın.

Animasyonunun FillBehavior özelliğini Durdur olarak ayarlayın

FillBehavior Stopolarak ayarlayarak, animasyona etkin döneminin sonuna ulaştıktan sonra hedef özelliğini etkilemeyi durdurmasını söylersiniz.

XAML 
<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>
C# 
private void setButton2BackgroundBrushColor(object sender, EventArgs e)
{

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

Hikaye tahtasının tamamını kaldır

bir RemoveStoryboard tetikleyicisi veya Storyboard.Remove yöntemi kullanarak görsel taslak animasyonlarına hedef özelliklerini etkilemeyi durdurmalarını söylersiniz. Bu yaklaşım ile FillBehavior özelliğini ayarlama arasındaki fark, görsel taslakları istediğiniz zaman kaldırabilmenizdir, ancak FillBehavior özelliğinin yalnızca animasyon etkin süresinin sonuna ulaştığında bir etkisi olur.

XAML 
<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>
C# 
private void setButton3BackgroundBrushColor(object sender, EventArgs e)
{

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

Tek bir özellikten animasyon kaldırma

Animasyonun bir özelliği etkilemesini durdurmak için kullanılan bir diğer teknik de animasyonlu nesnenin BeginAnimation(DependencyProperty, AnimationTimeline) yöntemini kullanmaktır. Animasyonlu özelliği ilk parametre olarak, null ikinci parametre olarak belirtin.

XAML 
<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>
C# 
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;
}

Bu teknik görsel taslak olmayan animasyonlar için de çalışır.

Ayrıca bkz.