Przegląd Zachowania chronometrażu
W tym temacie opisano zachowania chronometrażu animacji i innych Timeline obiektów.
Wymagania wstępne
Aby zrozumieć ten temat, należy zapoznać się z podstawowymi funkcjami animacji. Aby uzyskać więcej informacji, zobacz Omówienie animacji.
Typy osi czasu
Element Timeline reprezentuje segment czasu. Udostępnia właściwości, które umożliwiają określenie długości tego segmentu, kiedy ma się rozpocząć, ile razy będzie powtarzać, jak szybko postępuje w tym segmencie i nie tylko.
Klasy dziedziczone z klasy osi czasu zapewniają dodatkowe funkcje, takie jak animacja i odtwarzanie multimediów. WPF udostępnia następujące Timeline typy.
Typ osi czasu | opis |
---|---|
AnimationTimeline | Abstrakcyjna klasa bazowa dla Timeline obiektów, które generują wartości wyjściowe dla właściwości animowania. |
MediaTimeline | Generuje dane wyjściowe z pliku multimedialnego. |
ParallelTimeline | Typ tej TimelineGroup grupy i kontroluje obiekty podrzędne Timeline . |
Storyboard | Typ, który zawiera informacje o określaniu ParallelTimeline wartości docelowej dla obiektów osi czasu, które zawiera. |
Timeline | Abstrakcyjna klasa bazowa, która definiuje zachowania chronometrażu. |
TimelineGroup | Klasa abstrakcyjna dla Timeline obiektów, które mogą zawierać inne Timeline obiekty. |
Właściwości kontrolujące długość osi czasu
Element Timeline reprezentuje segment czasu, a długość osi czasu można opisać na różne sposoby. W poniższej tabeli zdefiniowano kilka terminów opisujących długość osi czasu.
Okres | opis | Właściwości |
---|---|---|
Prosty czas trwania | Czas potrzebny na wykonanie pojedynczej iteracji do przodu. | Duration |
Jedno powtórzenie | Czas potrzebny do gry na osi czasu raz i, jeśli AutoReverse właściwość jest prawdziwa, grać do tyłu raz. | Duration, AutoReverse |
Aktywny okres | Czas potrzebny na ukończenie wszystkich powtórzeń określonych przez jego RepeatBehavior właściwość na osi czasu. | Duration, AutoReverse, RepeatBehavior |
Właściwość Duration
Jak wspomniano wcześniej, oś czasu reprezentuje segment czasu. Długość tego segmentu zależy od osi czasu Duration. Gdy oś czasu osiągnie koniec jego trwania, przestanie być odtwarzana. Jeśli oś czasu zawiera osie czasu podrzędne, również przestają grać. W przypadku animacji parametr określa czas Duration przejścia animacji z wartości początkowej na wartość końcową. Czas trwania osi czasu jest czasami nazywany jego prostym czasem trwania, aby odróżnić czas trwania pojedynczej iteracji i łączny czas odtwarzania animacji, w tym powtórzeń. Możesz określić czas trwania przy użyciu wartości czasu skończonego lub wartości Automatic specjalnych lub Forever. Czas trwania animacji powinien być rozpoznawany TimeSpan jako wartość, aby można było przechodzić między wartościami.
W poniższym przykładzie pokazano wartość z DoubleAnimation wartością z Duration 5 sekundami.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5" />
Osie czasu kontenera, takie jak Storyboard i ParallelTimeline, mają domyślny czas trwania Automatic, co oznacza, że automatycznie kończą się, gdy ostatnie dziecko przestanie grać. W poniższym przykładzie pokazano Storyboard , którego Duration rozpoznawanie wynosi pięć sekund, czas potrzebny na ukończenie wszystkich obiektów podrzędnych DoubleAnimation .
<Storyboard >
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5" />
<DoubleAnimation
Storyboard.TargetName="MyOtherRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:3" />
</Storyboard>
Duration Ustawiając oś czasu kontenera na TimeSpan wartość, można wymusić odtwarzanie dłużej lub krótsze niż jego obiekty podrzędneTimeline. Jeśli ustawisz Duration wartość na mniejszą niż długość obiektów podrzędnych Timeline osi czasu kontenera, obiekty podrzędne Timeline przestaną być odtwarzane, gdy oś czasu kontenera będzie działać. Poniższy przykład ustawia element DurationStoryboard z poprzednich przykładów na trzy sekundy. W rezultacie pierwszy DoubleAnimation zatrzymuje postęp po trzech sekundach, gdy animuje szerokość prostokąta docelowego do 60.
<Storyboard Duration="0:0:3">
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5" />
<DoubleAnimation
Storyboard.TargetName="MyOtherRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:3" />
</Storyboard>
Właściwość RepeatBehavior
Właściwość RepeatBehavior kontrolki Timeline określa, ile razy powtarza swój prosty czas trwania. RepeatBehavior Za pomocą właściwości można określić liczbę powtórzeń osi czasu (iteracji Count) lub łączny czas odtwarzania (powtórzenieDuration). W obu przypadkach animacja przechodzi przez tyle przebiegów początkowych, ile jest niezbędnych do wypełnienia żądanej liczby lub czasu trwania. Domyślnie osie czasu mają liczbę 1.0
iteracji , co oznacza, że grają raz i w ogóle nie powtarzają.
W poniższym przykładzie użyto RepeatBehavior właściwości , aby wykonać DoubleAnimation odtwarzanie przez dwa razy prosty czas trwania, określając liczbę iteracji.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
RepeatBehavior="2x" />
W następnym przykładzie użyto RepeatBehavior właściwości , aby grać DoubleAnimation przez połowę jego prostego czasu trwania.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
RepeatBehavior="0.5x" />
Jeśli ustawisz RepeatBehavior właściwość elementu Timeline na Foreverwartość , Timeline powtarza się do momentu zatrzymania interakcyjnego lub przez system chronometrażu. W poniższym przykładzie użyto RepeatBehavior właściwości , aby grać DoubleAnimation na czas nieokreślony.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
RepeatBehavior="Forever" />
Aby uzyskać dodatkowy przykład, zobacz Repeat an Animation (Powtarzanie animacji).
Właściwość AutoReverse
Właściwość AutoReverse określa, czy Timeline element będzie odtwarzany wstecz na końcu każdej iteracji do przodu. Poniższy przykład ustawia właściwość DoubleAnimationtrue
na AutoReverse , w wyniku czego animuje od zera do 100, a następnie od 100 do zera. Gra w sumie 10 sekund.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
AutoReverse="True" />
Gdy używasz Count wartości do określenia RepeatBehavior wartości i TimelineAutoReverse właściwości , Timelinetrue
to jedno powtórzenie składa się z jednej iteracji do przodu, a następnie jednej iteracji wstecznej. Poniższy przykład ustawia element RepeatBehaviorDoubleAnimation z poprzedniego przykładu na wartość z Count dwóch. W rezultacie gra przez 20 sekund: do przodu przez pięć sekund, do tyłu DoubleAnimation przez pięć sekund, do przodu przez 5 sekund ponownie, a następnie do tyłu przez pięć sekund.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
RepeatBehavior="2"
AutoReverse="True" />
Jeśli oś czasu kontenera zawiera obiekty podrzędne Timeline , zostaną one odwrócone, gdy oś czasu kontenera będzie. Aby uzyskać dodatkowe przykłady, zobacz Określanie, czy oś czasu automatycznie odwraca się.
Właściwość BeginTime
Właściwość BeginTime umożliwia określenie, kiedy rozpoczyna się oś czasu. Godzina rozpoczęcia osi czasu jest względna względem osi czasu nadrzędnej. Godzina rozpoczęcia 00 sekund oznacza, że oś czasu jest uruchamiana natychmiast po uruchomieniu elementu nadrzędnego; każda inna wartość tworzy przesunięcie między rozpoczęciem odtwarzania osi czasu nadrzędnego a momentem odtwarzania osi czasu podrzędnego. Na przykład godzina rozpoczęcia dwóch sekund oznacza, że oś czasu rozpoczyna odtwarzanie, gdy jego element nadrzędny osiągnął czas dwóch sekund. Domyślnie wszystkie osie czasu mają czas rozpoczęcia równy zero sekund. Możesz również ustawić czas rozpoczęcia osi czasu na null
wartość , co uniemożliwia rozpoczęcie osi czasu. W WPF należy określić wartość null przy użyciu rozszerzenia znaczników x:Null.
Należy pamiętać, że czas rozpoczęcia nie jest stosowany za każdym razem, gdy oś czasu powtarza się ze względu na jego RepeatBehavior ustawienie. Gdyby utworzyć animację z wartością BeginTime 10 sekund i RepeatBehaviorForever10 sekund, zanim animacja zostanie odtworzona po raz pierwszy, ale nie dla każdego kolejnego powtórzenia. Jeśli jednak oś czasu nadrzędnego animacji miała być uruchamiana lub powtarzana, wystąpi 10-sekundowe opóźnienie.
Właściwość jest przydatna BeginTime w przypadku oszałamiających osi czasu. Poniższy przykład tworzy obiekt Storyboard , który zawiera dwa obiekty podrzędne DoubleAnimation . Pierwsza animacja ma Duration pięć sekund, a druga ma Duration 3 sekundy. W przykładzie ustawia BeginTime wartość sekundy DoubleAnimation na 5 sekund, aby rozpoczynała odtwarzanie po pierwszym DoubleAnimation zakończeniu.
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
BeginTime="0:0:0" />
<DoubleAnimation
Storyboard.TargetName="MyOtherRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:3"
BeginTime="0:0:5" />
</Storyboard>
Właściwość FillBehavior
Gdy wartość Timeline osiągnie koniec całkowitego aktywnego czasu trwania, właściwość określa, FillBehavior czy zatrzymuje się, czy przechowuje ostatnią wartość. Animacja z wartością FillBehaviorHoldEnd "przechowuje" jej wartość wyjściową: animowana właściwość zachowuje ostatnią wartość animacji. Wartość Stop powoduje, że animacja przestaje wpływać na jej właściwość docelową po zakończeniu.
Poniższy przykład tworzy obiekt Storyboard , który zawiera dwa obiekty podrzędne DoubleAnimation . Oba DoubleAnimation obiekty animują Width od Rectangle 0 do 100. Rectangle Elementy mają nie animowane Width wartości 500 [niezależnych pikseli urządzenia].
Właściwość FillBehavior pierwszego DoubleAnimation jest ustawiona na HoldEndwartość , wartość domyślna. W rezultacie szerokość prostokąta pozostaje na 100 po zakończeniu DoubleAnimation .
Właściwość FillBehavior drugiej DoubleAnimation jest ustawiona na Stopwartość . W rezultacie Width drugi Rectangle zostanie przywrócony do 500 po zakończeniu DoubleAnimation .
<Rectangle Name="MyRectangle"
Width="500" Height="100"
Opacity="1" Fill="Red">
</Rectangle>
<Rectangle Name="MyOtherRectangle"
Width="500" Height="100"
Opacity="1" Fill="Orange">
</Rectangle>
<Button Content="Start FillBehavior Example">
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
FillBehavior="HoldEnd" />
<DoubleAnimation
Storyboard.TargetName="MyOtherRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
FillBehavior="Stop" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
Właściwości kontrolujące szybkość osi czasu
Klasa Timeline udostępnia trzy właściwości określające jego szybkość:
SpeedRatio — Określa, że współczynnik względem jego elementu nadrzędnego, w którym czasie postępuje dla elementu Timeline. Wartości większe niż jeden zwiększają szybkość obiektów podrzędnych Timeline i i ich obiektów podrzędnych Timeline ; wartości między zerem a jednym spowalniają. Wartość jednej wskazuje, że Timeline postępuje w tej samej szybkości co jej element nadrzędny. Ustawienie SpeedRatio osi czasu kontenera wpływa również na wszystkie jego obiekty podrzędne Timeline .
AccelerationRatio — Określa wartość procentową Duration osi czasu spędzonej na przyspieszaniu. Przykład można znaleźć w temacie How to: Accelerate or Decelerate an Animation (Jak przyspieszyć lub zwolnić animację).
DecelerationRatio - Określa wartość procentową Duration osi czasu wydanej na decelerację. Przykład można znaleźć w temacie How to: Accelerate or Decelerate an Animation (Jak przyspieszyć lub zwolnić animację).
Zobacz też
.NET Desktop feedback