Nasıl yapılır: Görsel Taslakla Özelliğe Animasyon Ekledikten Sonra Ayarlama
Bazı durumlarda, animasyon oluşturulduktan sonra bir özelliğin değerini değiştiremeyebilirsiniz.
SolidColorBrush rengine animasyon ekleme
Aşağıdaki örnekte, bir Storyboard öğesinin rengine animasyon eklemek için kullanılır SolidColorBrush. Düğmeye tıklandığında görsel taslak tetikleniyor. Olay Completed , tamamlandığında programa bildirilmesi için ColorAnimation işlenir.
<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.
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
Önceki kod hiçbir şey yapmıyor gibi görünüyor: fırça sarı kalır; bu, fırçayı animasyonlu yapan tarafından ColorAnimation sağlanan değerdir. Temel alınan özellik değeri (temel değer) aslında mavi olarak değiştirilir. Ancak, geçerli veya geçerli değer hala temel değeri geçersiz kılması nedeniyle ColorAnimation sarı kalır. 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 şu şekilde ayarlayın: Stop
Görsel Taslak'ın tamamını kaldırın.
Animasyonu tek tek özellikten kaldırın.
Animasyonunun FillBehavior özelliğini Durdur olarak ayarlayın
olarak ayarlayarak FillBehaviorStop, animasyona etkin süresinin sonuna ulaştıktan sonra hedef özelliğinin etkilenmesini durdurmasını söylersiniz.
<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
Görsel şeridin tamamını kaldırma
Tetikleyici RemoveStoryboard veya Storyboard.Remove yöntemi kullanarak görsel taslak animasyonlarına hedef özelliklerini etkilemeyi durdurmalarını söylersiniz. Bu yaklaşım ile özelliği ayarlama FillBehavior arasındaki fark, görsel taslakları istediğiniz zaman kaldırabilmenizdir, ancak özelliğin FillBehavior yalnızca animasyon etkin süresinin sonuna ulaştığında bir etkisi olur.
<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
Tek bir özellikten animasyon kaldırma
Bir animasyonun özelliği etkilemesini durdurmak için kullanılan bir diğer teknik de animasyonlu nesnenin yöntemini kullanmaktır BeginAnimation(DependencyProperty, AnimationTimeline) . Animasyonlu özelliğini ilk parametre olarak, null
ikinci parametre olarak belirtin.
<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
Bu teknik görsel taslak olmayan animasyonlar için de çalışır.
Ayrıca bkz.
.NET Desktop feedback
Geri Bildirim
https://aka.ms/ContentUserFeedback.
Çok yakında: 2024 boyunca, içerik için geri bildirim mekanizması olarak GitHub Sorunları’nı kullanımdan kaldıracak ve yeni bir geri bildirim sistemiyle değiştireceğiz. Daha fazla bilgi için bkz.Gönderin ve geri bildirimi görüntüleyin