Поделиться через


Общие сведения о поведении тайминга

В этом разделе описываются временные характеристики анимаций и других объектов Timeline.

Необходимые условия

Чтобы понять эту тему, необходимо ознакомиться с основными функциями анимации. Дополнительные сведения см. в обзоре анимации .

Типы временной шкалы

Timeline представляет сегмент времени. Он предоставляет свойства, позволяющие указать длину этого сегмента, когда он должен начинаться, сколько раз он будет повторяться, скорость изменения времени в этом сегменте и многое другое.

Классы, наследуемые от класса временной шкалы, предоставляют дополнительные функциональные возможности, такие как анимация и воспроизведение мультимедиа. WPF предоставляет следующие Timeline типы.

Тип временной шкалы Описание
AnimationTimeline Абстрактный базовый класс для объектов Timeline, которые создают выходные значения для анимируемых свойств.
MediaTimeline Создает выходные данные из файла мультимедиа.
ParallelTimeline Тип TimelineGroup, который группит и управляет дочерними объектами Timeline.
Storyboard Тип ParallelTimeline, предоставляющий сведения о целевых объектах временной шкалы, которые он содержит.
Timeline Абстрактный базовый класс, определяющий поведение времени.
TimelineGroup Абстрактный класс для объектов Timeline, которые могут содержать другие объекты Timeline.

Свойства, управляющие длиной временной шкалы

Timeline представляет сегмент времени, а длина временной шкалы может быть описана разными способами. В следующей таблице определены несколько терминов для описания длины временной шкалы.

Срок Описание Свойства
Простая длительность Длительность времени, требуемого временной шкале для выполнения одной прямой итерации. Duration
Одно повторение Время, необходимое для временной шкалы для того, чтобы проигрываться вперед один раз и, если свойство AutoReverse имеет значение true, проигрываться назад один раз. Duration, AutoReverse
Активный период Длительность времени, необходимого таймлайну для завершения всех повторений, указанных его свойством RepeatBehavior. Duration, AutoReverse, RepeatBehavior

Свойство длительности

Как упоминалось ранее, временная шкала представляет сегмент времени. Длина этого сегмента определяется временной шкалой Duration. Когда временная шкала достигает конца своей длительности, она перестает воспроизводиться. Если у временной шкалы есть дочерние временные шкалы, они также перестают играть. В случае анимации Duration указывает, сколько времени занимает анимация, чтобы перейти от начального значения к его конечному значению. Длительность временной шкалы иногда называется ее простой длительностью, чтобы различать длительность одной итерации и общую продолжительность воспроизведения анимации, включая повторения. Можно указать длительность с помощью конечного значения времени или специальных значений Automatic или Forever. Длительность анимации должна определяться как значение TimeSpan, чтобы она могла плавно переходить между значениями.

В следующем примере показана DoubleAnimation с Duration длительностью 5 секунд.

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

Временная шкала контейнеров, например Storyboard и ParallelTimeline, имеет длительность Automaticпо умолчанию, что означает, что они автоматически заканчиваются, когда последний ребенок перестает играть. В следующем примере показан Storyboard, Duration которого разрешается до пяти секунд, время, затраченное на выполнение всех дочерних 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>

Установив значение TimeSpan для временной шкалы контейнера Duration, можно заставить его воспроизводиться дольше или короче, чем это сделали бы его дочерние объекты Timeline. Если для Duration установлено значение, которое меньше длины объектов Timeline на временной шкале контейнера, то объекты Timeline перестают воспроизводиться, когда это делает временная шкала контейнера. Следующий пример устанавливает значение Duration параметра Storyboard из предыдущих примеров на три секунды. В результате первая DoubleAnimation останавливается через три секунды, когда она анимирует ширину целевого прямоугольника до 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

Свойство RepeatBehaviorTimeline определяет, сколько раз повторяется его простая длительность. Используя свойство RepeatBehavior, можно указать, сколько раз воспроизводится временная шкала (итерация Count) или общая продолжительность воспроизведения (повторение Duration). В любом случае анимация проходит столько полных циклов, сколько необходимо для достижения запрошенного количества или длительности. По умолчанию временные шкалы имеют количество итерации 1.0, что означает, что они играют один раз и не повторяются вообще.

В следующем примере свойство RepeatBehavior используется для того, чтобы DoubleAnimation воспроизводился в два раза дольше, указывая количество итераций.

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

В следующем примере используется свойство RepeatBehavior, чтобы DoubleAnimation воспроизводился только половину от своей простой длительности.

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

Если для свойства RepeatBehaviorTimeline задано значение Forever, Timeline повторяется, пока не будет остановлено в интерактивном режиме или системой времени. В следующем примере свойство RepeatBehavior используется для бесконечного воспроизведения DoubleAnimation.

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

Дополнительные примеры см. в разделе Повтор анимации.

Свойство AutoReverse

Свойство AutoReverse указывает, будет ли Timeline воспроизводиться в обратном порядке после каждого цикла вперёд. В следующем примере для свойства AutoReverse объекта DoubleAnimation устанавливается значение true; в результате он анимируется от нуля до 100, а затем от 100 до нуля. Он играет в общей сложности 10 секунд.

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

При использовании значения Count для указания RepeatBehaviorTimeline и свойства AutoReverse этого Timeline является true, одно повторение состоит из одной итерации вперед, за которой следует одна итерация назад. Следующий пример устанавливает RepeatBehaviorDoubleAnimation из предыдущего примера в Count равным двум. В результате DoubleAnimation играет в течение 20 секунд: вперед в течение пяти секунд, назад в течение пяти секунд, вперед в течение 5 секунд снова, а затем назад в течение пяти секунд.

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

Если временная шкала контейнера содержит дочерние объекты Timeline, они изменяют направление, когда временная шкала контейнера это делает. Для дополнительных примеров см. Укажите, инвертируется ли шкала времени автоматически.

Свойство BeginTime

Свойство BeginTime позволяет указать, когда начинается шкала времени. Время начала временной шкалы относительно родительской временной шкалы. Время начала с нулевой секунды означает, что временная шкала начинается одновременно с началом родительской; любое другое значение создает смещение между началом родительской временной шкалы и дочерней временной шкалы. Например, время начала, равное двум секундам, означает, что воспроизведение временной шкалы начинается, когда её родитель достиг отметки в две секунды. По умолчанию все временные шкалы имеют время начала нулевых секунд. Вы также можете установить время начала временной шкалы на null, что предотвращает запуск временной шкалы. В WPF укажите значение NULL с помощью расширения разметки x:Null.

Обратите внимание, что время начала не применяется каждый раз, когда таймлайн повторяется из-за параметра RepeatBehavior. Если бы вы создали анимацию длительностью BeginTime в 10 секунд и RepeatBehaviorForever, то перед первым воспроизведением анимации будет 10-секундная задержка, но не при каждом последующем повторении. Однако, если бы родительская временная шкала анимации была перезапущена или повторилась, произошла бы задержка на 10 секунд.

Свойство BeginTime полезно для чередования временных шкал. В следующем примере создается Storyboard с двумя дочерними объектами DoubleAnimation. Первая анимация имеет Duration 5 секунд, а второй имеет Duration 3 секунды. В примере задание BeginTime второго DoubleAnimation на 5 секунд, чтобы начать воспроизведение после окончания первого 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

Когда Timeline достигает конца его полной активной длительности, свойство FillBehavior указывает, останавливается ли оно или удерживает последнее значение. Анимация с FillBehaviorHoldEnd сохраняет своё выходное значение: анимируемое свойство сохраняет последнее значение анимации. Значение Stop приводит к тому, что анимация перестаёт влиять на своё целевое свойство после завершения.

В следующем примере создается Storyboard с двумя дочерними объектами DoubleAnimation. Оба объекта DoubleAnimation анимируют анимацию WidthRectangle от 0 до 100. Элементы Rectangle имеют неанимированные Width значения 500 [независимых от устройства пикселей].

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

Свойства, управляющие скоростью временной шкалы

Класс Timeline предоставляет три свойства для указания скорости:

См. также