Zamanlama Davranışlarına Genel Bakış

Bu konu, animasyonların ve diğer nesnelerin zamanlama davranışlarını açıklamaktadır Timeline .

Önkoşullar

Bu konuyu anlamak için temel animasyon özellikleriyle ilgili bilgi sahibi olmanız gerekir. Daha fazla bilgi için animasyona genel bakışkonusuna bakın.

Zaman çizelgesi türleri

Bir Timeline zaman kesimini temsil eder. Bu, segmentin uzunluğunu, ne zaman yineleneceğini, kaç kez yineleneceğini, bu kesimdeki zaman ne kadar hızlı bir şekilde ilerleme olduğunu ve daha fazlasını belirtmenizi sağlayan özellikler sunar.

Zaman Çizelgesi sınıfından kalıtımla alan sınıflar, animasyon ve medya yürütme gibi ek işlevler sağlar. WPF aşağıdaki türleri sağlar Timeline .

Zaman çizelgesi türü Description
AnimationTimeline TimelineHareketlendirilen özellikler için çıkış değerleri üreten nesneler için soyut temel sınıf.
MediaTimeline Bir medya dosyasından çıktı üretir.
ParallelTimeline Grupların bir türü TimelineGroup ve alt Timeline nesneleri denetler.
Storyboard ParallelTimelineIçerdiği zaman çizelgesi nesneleri için hedefleme bilgilerini sağlayan bir türü.
Timeline Zamanlama davranışlarını tanımlayan soyut temel sınıf.
TimelineGroup TimelineDiğer nesneleri içerebilen nesneler için soyut sınıf Timeline .

Bir zaman çizelgesinin uzunluğunu denetleyen özellikler

Bir Timeline zaman kesimini temsil eder ve zaman çizelgesinin uzunluğu farklı şekillerde açıklanabilir. Aşağıdaki tabloda, bir zaman çizelgesinin uzunluğunu açıklamak için çeşitli terimler tanımlanmaktadır.

Süre Açıklama Özellikler
Basit süre Bir zaman çizelgesinin tek bir iletme yinelemesi yapmak için geçen sürenin uzunluğu. Duration
Bir yineleme Bir zaman çizelgesinin bir kez oynatılacağı sürenin uzunluğu ve AutoReverse özellik true ise, bir kez geri yürütün. Duration, AutoReverse
Etkin dönem Bir zaman çizelgesinin, özelliği tarafından belirtilen tüm tekrarları tamamlaması için geçen sürenin uzunluğu RepeatBehavior . Duration, AutoReverse, RepeatBehavior

Duration özelliği

Daha önce belirtildiği gibi, bir zaman çizelgesi bir zaman kesimini temsil eder. Bu segmentin uzunluğu, zaman çizelgesi tarafından belirlenir Duration . Bir zaman çizelgesi süresinin sonuna ulaştığında yürütmeyi sonlandırır. Zaman çizelgesinde alt zaman çizelgeleri varsa, oynamaları da durdurur. Animasyon söz konusu olduğunda, Duration animasyonun başlangıç değerinden bitiş değerine geçişin ne kadar sürdüğünü belirtir. Bir zaman çizelgesinin süresi bazen basit süresi olarak adlandırılır, tek bir yinelemenin süresi ile animasyonun sürekliliği dahil olduğu sürenin toplam uzunluğu arasında ayrım yapar. Bir süreyi sınırlı bir zaman değeri veya özel değerler veya ya da ile belirtebilirsiniz Automatic Forever . Animasyonun süresi bir değere çözümlenmelidir TimeSpan , bu nedenle değerler arasında geçiş yapabilir.

Aşağıdaki örnek, DoubleAnimation beş saniyelik bir ile gösterir Duration .

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5"  />

Ve gibi kapsayıcı zaman çizelgeleri Storyboard ParallelTimeline varsayılan süresine sahiptir ve Automatic Bu, son alt öğe yürütmeyi durdurduklarında otomatik olarak sona erer. Aşağıdaki örnek Storyboard Duration , beş saniye içinde çözümlendiğini, tüm alt nesnelerinin tamamlanmasını geçen sürenin uzunluğunu gösterir 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>

DurationBir kapsayıcı zaman çizelgesinin TimeSpan değerini bir değere ayarlayarak, daha uzun veya daha kısa bir süre yürütmeye zorlayabilirsiniz Timeline . DurationÖğesini kapsayıcı zaman çizelgesinin alt nesnelerinin uzunluğundan daha küçük bir değere ayarlarsanız Timeline , Timeline kapsayıcı zaman çizelgesi yapıldığında alt nesneler yürütmeyi durdurur. Aşağıdaki örnek, Duration Storyboard önceki örneklerden üç saniyeye kadar olan öğesini ayarlar. Sonuç olarak, ilk olarak DoubleAnimation üç saniyeden sonra ilerledikten sonra, hedef dikdörtgenin genişliğini 60 olarak hareketlendirilir.

<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 özelliği

RepeatBehaviorBir öğesinin özelliği, Timeline basit süresini kaç kez yineleyeceğini denetler. Özelliğini kullanarak RepeatBehavior , zaman çizelgesinin kaç kez oynatılacağını (bir yineleme Count ) veya oynaması gereken toplam süreyi (bir yineleme Duration ) belirtebilirsiniz. Her iki durumda da, animasyon istenen sayıyı veya süreyi dolduracak kadar birçok baştan sona çalışır. Varsayılan olarak, zaman çizelgeleri yineleme sayısına sahiptir 1.0 . Bu, bir kez oynadıkları ve hiç yinelenmediği anlamına gelir.

Aşağıdaki örnek, bir RepeatBehavior DoubleAnimation yineleme sayısı belirterek, basit süresini iki kez yürütmek için özelliğini kullanır.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  RepeatBehavior="2x" />

Sonraki örnek, RepeatBehavior oynatma özelliğini, DoubleAnimation basit süresi yarıya getirmek için kullanır.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  RepeatBehavior="0.5x" />

RepeatBehaviorÖğesinin özelliğini ' a ayarlarsanız Timeline Forever , Timeline etkileşimli olarak veya zamanlama sistemi tarafından durduruluncaya kadar yinelenir. Aşağıdaki örnek, RepeatBehavior oynatma özelliğini sonsuza kadar yapmak için kullanır DoubleAnimation .

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  RepeatBehavior="Forever" />

Ek bir örnek için bkz. bir animasyonu tekrarlama.

Oto ters özelliği

AutoReverseÖzelliği, bir Timeline , her bir ileri yinelemesinin sonunda geriye doğru çalıp çalınmayacağını belirtir. Aşağıdaki örnek, ' AutoReverse a ' öğesinin özelliğine ayarlanır DoubleAnimation true ; Sonuç olarak, sıfırdan 100 'e ve ardından 100 ' den sıfıra hareketlenir. Toplam 10 saniyelik oynar.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  AutoReverse="True" />

CountBir değerini ve öğesinin özelliğini belirtmek için bir değer kullandığınızda, tek bir yineleme bir RepeatBehavior Timeline İleri yinelemeden AutoReverse Timeline true sonra bir geriye doğru yineleme izler. Aşağıdaki örnek, RepeatBehavior DoubleAnimation bir önceki örnekten ' ın ' ın ' a kadar olan öğesini ayarlar Count . Sonuç olarak, DoubleAnimation 20 saniye boyunca oynatılır: beş saniye boyunca İleri, beş saniye boyunca geri doğru, 5 saniye boyunca İleri ve beş saniye boyunca geriye doğru.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  RepeatBehavior="2" 
  AutoReverse="True" />

Bir kapsayıcı zaman çizelgesinde alt Timeline nesneler varsa, kapsayıcı zaman çizelgesi yapıldığında bunlar ters yapılır. Ek örnekler için bkz. bir zaman çizelgesinin otomatik olarak ters çevrilip çevrilmeyeceğini belirtme.

BeginTime özelliği

BeginTimeÖzelliği, bir zaman çizelgesinin ne zaman başlayacağını belirtmenizi sağlar. Bir zaman çizelgesinin başlangıç zamanı, üst zaman çizelgesine göre belirlenir. Sıfır saniyelik başlangıç zamanı, ana zaman çizelgesinin başladığı anda başladığı anlamına gelir; diğer herhangi bir değer, üst zaman çizelgesinin oynatılmaya başladığı ve alt zaman çizelgesinin yürütüldüğü zaman arasında bir fark oluşturur. Örneğin, iki saniyelik bir başlangıç zamanı, üst öğesi iki saniyelik bir zamana ulaştığında zaman çizelgesinin oynatılmaya başladığı anlamına gelir. Varsayılan olarak, tüm zaman çizelgeleri sıfır saniyelik başlangıç zamanına sahiptir. Ayrıca, zaman çizelgesinin başlamasını önleyen bir zaman çizelgesinin başlangıç saatini de ayarlayabilirsiniz null . İçinde WPF , X:null işaretleme uzantısınıkullanarak null değerini belirtirsiniz.

Başlangıç saatinin, ayarı nedeniyle bir zaman çizelgesi tekrarlandığı her seferinde uygulanmadığını unutmayın RepeatBehavior . 10 saniyelik ve ' a bir animasyon oluşturmak istiyorsanız BeginTime RepeatBehavior Forever animasyon ilk kez çalınmadan önce 10 saniyelik bir gecikme olur, ancak her bir sonraki tekrarda kullanılamaz. Ancak, animasyonun üst zaman çizelgesi yeniden başlatılmaya veya tekrarlanması olduysa, 10 saniyelik gecikme meydana gelir.

BeginTimeÖzelliği, kademelendirme zaman çizelgeleri için yararlıdır. Aşağıdaki örnek Storyboard iki alt nesnesine sahip bir oluşturur DoubleAnimation . İlk animasyon Duration beş saniyeye sahiptir ve ikincisi Duration 3 saniyeye sahiptir. Örnek, BeginTime DoubleAnimation ilk sona erdikten sonra yürütülmeye başlaması için ikincinin 5 saniyeye ayarlanır DoubleAnimation .

<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 özelliği

Bir bir, Timeline toplam etkin süresinin sonuna ulaştığında, FillBehavior özelliği, en son değerini durdurduğunu veya bulundurmadığını belirtir. "Barındırır" olan bir animasyon, FillBehavior HoldEnd çıkış değerini saklar: hareketlendirilen Özellik animasyonun son değerini korur. Bir değeri, Stop animasyonun bittikten sonra hedef özelliğini etkilemesini durdurmasına neden olur.

Aşağıdaki örnek Storyboard iki alt nesnesine sahip bir oluşturur DoubleAnimation . Her iki DoubleAnimation nesne de Width Rectangle 0 ile 100 arasında bir animasyon uygular. RectangleÖğelerin, Width 500 [cihazdan bağımsız piksel] animasyon olmayan değerleri vardır.

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

Bir zaman çizelgesinin hızını denetleyen özellikler

TimelineSınıfı, hızını belirtmek için üç özellik sağlar:

Ayrıca bkz.