Nasıl yapılır: Etkin Döneminin Sonuna Gelen Zaman Çizelgesi için FillBehavior Belirtme
Bu örnek, FillBehavior animasyonlu bir özelliğin etkin değil için nasıl kullanılacağını gösterir Timeline .
Örnek
FillBehaviorÖğesinin özelliği, hareketli Timeline olmayan bir özelliğin değerine ne olduğunu belirler, diğer bir deyişle, Timeline etkin değil ancak üst öğesi Timeline etkin veya tutma dönemi içindedir. Örneğin, animasyon bittikten sonra animasyonlu bir özellik kendi bitiş değerinde kalır veya animasyon başlamadan önce sahip olan değere geri dönsün mü?
Aşağıdaki örnek, DoubleAnimation iki dikdörtgenin animasyonunu hareketlendirmek için bir kullanır Width . Her dikdörtgen farklı bir Timeline nesne kullanır.
Biri, TimelineFillBehavior olarak ayarlanmış bir öğesine sahiptir Stop ve bu, dikdörtgenin genişliğinin sona erdiğinde animasyon dışı değerine geri döndürülmesine neden olur Timeline . Diğeri, TimelineFillBehaviorHoldEnd sona erdiğinde, genişliğinin bitiş değerinde kalmasına neden olur Timeline .
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" >
<StackPanel Margin="20">
<Border Background="#99FFFFFF">
<TextBlock Margin="20">
This example shows how the FillBehavior property determines how an animation behaves
after it reaches the end of its duration.
</TextBlock>
</Border>
<TextBlock>FillBehavior="Deactivate"</TextBlock>
<Rectangle Name="deactiveAnimationRectangle" Width="20" Height="20" Fill="#AA3333FF" HorizontalAlignment="Left" >
<Rectangle.Triggers>
<EventTrigger RoutedEvent="Rectangle.Loaded">
<BeginStoryboard>
<Storyboard>
<!-- The animated rectangle's width reverts back to its non-animated value
after the animation ends. -->
<DoubleAnimation
Storyboard.TargetName="deactiveAnimationRectangle"
Storyboard.TargetProperty="Width"
From="100" To="400" Duration="0:0:2" FillBehavior="Stop" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>
<TextBlock Margin="0,20,0,0">FillBehavior="HoldEnd" </TextBlock>
<Rectangle Name="holdEndAnimationRectangle" Width="20" Height="20" Fill="#AA3333FF" HorizontalAlignment="Left" >
<Rectangle.Triggers>
<EventTrigger RoutedEvent="Rectangle.Loaded">
<BeginStoryboard>
<Storyboard>
<!-- The animated rectangle's width remains at its end value after the
animation ends. -->
<DoubleAnimation Storyboard.TargetName="holdEndAnimationRectangle"
Storyboard.TargetProperty="Width"
From="100" To="400" Duration="0:0:2" FillBehavior="HoldEnd" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>
</StackPanel>
</Page>
Tüm örnek için bkz. animasyon örnek Galerisi.