Přehled chování časování
Toto téma popisuje chování časování animací a dalších Timeline objektů.
Předpoklady
Abyste pochopili toto téma, měli byste být obeznámeni se základními funkcemi animace. Další informace najdete v přehledu animací.
Typy časové osy
A Timeline představuje segment času. Poskytuje vlastnosti, které umožňují určit délku tohoto segmentu, kdy se má zahájit, kolikrát se bude opakovat, jak rychle se v daném segmentu postupuje, a další.
Třídy, které dědí z třídy časové osy, poskytují další funkce, jako je animace a přehrávání médií. WPF poskytuje následující Timeline typy.
Typ časové osy | Popis |
---|---|
AnimationTimeline | Abstraktní základní třída pro Timeline objekty, které generují výstupní hodnoty pro animaci vlastností. |
MediaTimeline | Generuje výstup z multimediálního souboru. |
ParallelTimeline | Typ TimelineGroup této skupiny a řídí podřízené Timeline objekty. |
Storyboard | Typ ParallelTimeline , který poskytuje informace o cílení pro objekty časové osy, které obsahuje. |
Timeline | Abstraktní základní třída, která definuje chování časování. |
TimelineGroup | Abstraktní třída pro Timeline objekty, které mohou obsahovat jiné Timeline objekty. |
Vlastnosti, které řídí délku časové osy
A Timeline představuje segment času a délku časové osy je možné popsat různými způsoby. Následující tabulka definuje několik termínů pro popis délky časové osy.
Období | Popis | Vlastnosti |
---|---|---|
Jednoduchá doba trvání | Doba, po kterou časová osa trvá, aby byla jedna iterace dopředu. | Duration |
Jedno opakování | Doba, kterou časová osa trvá, aby se přehrála jednou dopředu, a pokud AutoReverse je vlastnost pravdivá, přehraje se jednou zpět. | Duration, AutoReverse |
Aktivní období | Doba trvání časové osy dokončení všech opakování určených jeho RepeatBehavior vlastností. | Duration, AutoReverse, RepeatBehavior |
Vlastnost Duration
Jak jsme už zmínili, časová osa představuje segment času. Délka tohoto segmentu je určena časovou osou Duration. Když časová osa dosáhne konce doby trvání, přestane se přehrávat. Pokud časová osa obsahuje podřízené časové osy, přestanou také přehrávat. V případě animace určuje, Duration jak dlouho trvá přechod animace od počáteční hodnoty na koncovou hodnotu. Doba trvání časové osy se někdy označuje jako její jednoduchá doba trvání, aby bylo možné rozlišit dobu trvání jedné iterace a celkovou dobu přehrávání animace včetně opakování. Dobu trvání můžete zadat pomocí konečné časové hodnoty nebo speciálních hodnot Automatic nebo Forever. Doba trvání animace by se měla přeložit na TimeSpan hodnotu, takže může přecházet mezi hodnotami.
Následující příklad ukazuje s pětisekundovým Duration intervalemDoubleAnimation.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5" />
Časové osy kontejnerů, například Storyboard a ParallelTimeline, mají výchozí dobu trvání Automatic, což znamená, že se automaticky ukončí, když se jejich poslední dítě přestane přehrávat. Následující příklad ukazuje Storyboard , jehož Duration řešení se přeloží na pět sekund, doba trvání dokončení všech podřízených DoubleAnimation objektů.
<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>
Nastavením Duration časové osy kontejneru na TimeSpan hodnotu můžete vynutit přehrávání delší nebo kratší než jeho podřízené Timeline objekty. Pokud nastavíte Duration hodnotu, která je menší než délka podřízených Timeline objektů časové osy kontejneru, podřízené Timeline objekty se při dokončení časové osy kontejneru přestanou přehrávat. Následující příklad nastaví Duration z Storyboard předchozích příkladů na tři sekundy. V důsledku toho první DoubleAnimation přestane po třech sekundách pokračovat, když má animovanou šířku cílového obdélníku na 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>
RepeatBehavior – vlastnost
Vlastnost RepeatBehaviorTimeline časového prvku určuje, kolikrát se opakuje jeho jednoduchá doba trvání. RepeatBehavior Pomocí vlastnosti můžete určit, kolikrát se časová osa přehraje (iteraceCount) nebo celková doba, po kterou se má přehrát (opakováníDuration). V obou případech animace prochází tolik spuštění od začátku do konce, kolik je potřeba k vyplnění požadovaného počtu nebo doby trvání. Ve výchozím nastavení mají časové osy počet 1.0
iterací , což znamená, že se přehrávají jednou a neopakují se vůbec.
Následující příklad používá RepeatBehavior vlastnost k vytvoření přehrávání dvakrát jeho jednoduchá DoubleAnimation doba trvání zadáním počtu iterací.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
RepeatBehavior="2x" />
V dalším příkladu se RepeatBehavior vlastnost použije k vytvoření hry na polovinu DoubleAnimation jeho jednoduché doby trvání.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
RepeatBehavior="0.5x" />
Pokud nastavíte RepeatBehavior vlastnost na Foreverhodnotu Timeline , Timeline opakuje se, dokud se interaktivně nezastaví nebo podle systému časování. Následující příklad používá RepeatBehavior vlastnost k tomu, aby DoubleAnimation přehrávání neomezeně dlouho.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
RepeatBehavior="Forever" />
Další příklad najdete v tématu Opakování animace.
Vlastnost AutoReverse
Vlastnost AutoReverse určuje, zda Timeline se bude přehrávat zpětně na konci každé iterace dopředu. Následující příklad nastaví AutoReverse vlastnost DoubleAnimation na true
; v důsledku toho animuje od nuly do 100 a pak z 100 na nulu. Hraje celkem 10 sekund.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
AutoReverse="True" />
Pokud použijete Count hodnotu k určení RepeatBehaviorTimeline a AutoReverse vlastnosti, která Timeline je true
, jedno opakování se skládá z jedné dopředu iterace následované jednou zpět iterací. Následující příklad nastaví RepeatBehavior z DoubleAnimation předchozího příkladu na dva Count . Výsledkem je, že DoubleAnimation přehrávání po dobu 20 sekund: dopředu po dobu pěti sekund, dozadu po dobu pěti sekund, dopředné po dobu 5 sekund a pak dozadu po dobu pěti sekund.
<DoubleAnimation
Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
From="0" To="100" Duration="0:0:5"
RepeatBehavior="2"
AutoReverse="True" />
Pokud časová osa kontejneru obsahuje podřízené Timeline objekty, obrátí se při vypršení časové osy kontejneru. Další příklady najdete v tématu Určení, jestli se časová osa automaticky obrátí.
Vlastnost BeginTime
Tato BeginTime vlastnost umožňuje určit, kdy se časová osa spustí. Počáteční čas časové osy je relativní vzhledem k nadřazené časové ose. Počáteční čas nuly sekund znamená, že časová osa začíná, jakmile začne nadřazená; jakákoli jiná hodnota vytvoří posun mezi tím, kdy se nadřazená časová osa začne přehrávat a kdy se přehraje podřízená časová osa. Například počáteční čas dvou sekund znamená, že časová osa se začne přehrávat, když jeho nadřazený objekt dosáhl času dvou sekund. Ve výchozím nastavení mají všechny časové osy počáteční čas nula sekund. Můžete také nastavit čas zahájení časové osy na null
, což brání zahájení časové osy. Ve WPF zadáte hodnotu null pomocí rozšíření značek x:Null.
Všimněte si, že počáteční čas se nepoužije pokaždé, když se časová osa opakuje kvůli jeho RepeatBehavior nastavení. Kdybyste chtěli vytvořit animaci s BeginTime 10 sekundami RepeatBehaviorForevera 10 sekundami, došlo by k 10sekundovém zpoždění před prvním přehráváním animace, ale ne pro každé následné opakování. Pokud by se však nadřazená časová osa animace restartovala nebo opakovala, dojde k 10sekundovém zpoždění.
Vlastnost BeginTime je užitečná pro zasáhnutí časových os. Následující příklad vytvoří Storyboard objekt, který má dva podřízené DoubleAnimation objekty. První animace má Duration pět sekund a druhá má Duration 3 sekundy. Příklad nastaví BeginTime sekundu DoubleAnimation na 5 sekund, aby se začalo přehrávat po prvním DoubleAnimation konci.
<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>
FillBehavior – vlastnost
Timeline Když dosáhne konce jeho celkové aktivní doby trvání, vlastnost určuje, FillBehavior zda se zastaví nebo uchovává její poslední hodnotu. Animace s FillBehaviorHoldEnd hodnotou "blokování" její výstupní hodnoty: vlastnost, která se animuje, zachová poslední hodnotu animace. Hodnota Stop příčin, že animace přestane mít vliv na jeho cílovou vlastnost po jejím ukončení.
Následující příklad vytvoří Storyboard objekt, který má dva podřízené DoubleAnimation objekty. Oba DoubleAnimation objekty animují WidthRectangle od 0 do 100. Prvky Rectangle mají ne animované Width hodnoty 500 [nezávislé pixely zařízení].
Vlastnost FillBehavior prvního DoubleAnimation je nastavena na HoldEnd, výchozí hodnota. V důsledku toho zůstane šířka obdélníku po konci 100 DoubleAnimation .
Vlastnost FillBehavior druhé DoubleAnimation je nastavena na Stophodnotu . V důsledku toho Width se druhý Rectangle po skončení vrátí na 500 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>
Vlastnosti, které řídí rychlost časové osy
Třída Timeline poskytuje tři vlastnosti pro určení jeho rychlosti:
SpeedRatio – Určuje danou sazbu vzhledem k nadřazené hodnotě, v níž postupuje pro určitý objekt Timeline. Hodnoty větší než jedna zvyšují rychlost Timeline a jeho podřízených Timeline objektů; hodnoty mezi nulou a jednou ji zpomalují. Hodnota jednoho značí, že Timeline postupuje stejnou rychlostí jako nadřazená hodnota. Nastavení SpeedRatio časové osy kontejneru má vliv také na všechny jeho podřízené Timeline objekty.
AccelerationRatio – Určuje procento časové Duration osy strávené urychlením. Příklad najdete v tématu Postupy: Zrychlení nebo zpomalení animace.
DecelerationRatio – Určuje procento časové Duration osy strávené zpomalením. Příklad najdete v tématu Postupy: Zrychlení nebo zpomalení animace.
Viz také
.NET Desktop feedback