Storyboard Класс

Определение

public ref class Storyboard sealed : Timeline

/// [Microsoft.UI.Xaml.Markup.ContentProperty(Name="Children")]
/// [Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.UI.Xaml.WinUIContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class Storyboard final : Timeline

[Microsoft.UI.Xaml.Markup.ContentProperty(Name="Children")]
[Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.UI.Xaml.WinUIContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public sealed class Storyboard : Timeline

Public NotInheritable Class Storyboard
Inherits Timeline

<Storyboard ...>
  oneOrMoreChildTimelines
</Storyboard>

Наследование

Object Platform::Object IInspectable DependencyObject Timeline Storyboard

Атрибуты

ContentPropertyAttribute ActivatableAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

Примеры

В следующем примере показано, как использовать методы Begin, Stop, Pause и Resume для управления воспроизведением раскадровки (анимации). Набор кнопок позволяет пользователю вызывать эти методы.

<StackPanel x:Name="LayoutRoot" >
    <StackPanel.Resources>
        <Storyboard x:Name="myStoryboard">
            <DoubleAnimation From="1" To="6" Duration="00:00:6" 
            Storyboard.TargetName="rectScaleTransform" 
            Storyboard.TargetProperty="ScaleY">
                <DoubleAnimation.EasingFunction>
                    <BounceEase Bounces="2" EasingMode="EaseOut" 
                            Bounciness="2" />
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
    </StackPanel.Resources>

    <!-- Button that begins animation. -->
    <Button Click="Animation_Begin"
         Margin="2" Content="Begin" />

    <!-- Button that pauses Animation. -->
    <Button Click="Animation_Pause"
         Margin="2" Content="Pause" />

    <!-- Button that resumes Animation. -->
    <Button Click="Animation_Resume"
         Margin="2" Content="Resume" />

    <!-- Button that stops Animation. Stopping the animation 
         returns the ellipse to its original location. -->
    <Button Click="Animation_Stop"
         Margin="2" Content="Stop" />

    <Rectangle Fill="Blue" Width="200" Height="30">
        <Rectangle.RenderTransform>
            <ScaleTransform x:Name="rectScaleTransform" />
        </Rectangle.RenderTransform>
    </Rectangle>

</StackPanel>

private void Animation_Begin(object sender, RoutedEventArgs e)
{
    myStoryboard.Begin();
}
private void Animation_Pause(object sender, RoutedEventArgs e)
{
    myStoryboard.Pause();
}
private void Animation_Resume(object sender, RoutedEventArgs e)
{
    myStoryboard.Resume();
}
private void Animation_Stop(object sender, RoutedEventArgs e)
{
    myStoryboard.Stop();
}

//using Windows.UI.Xaml.Media.Animation;
//using Windows.UI.Xaml.Shapes;
//using Windows.UI

private void Create_And_Run_Animation(object sender, RoutedEventArgs e)
{
    // Create a red rectangle that will be the target
    // of the animation.
    Rectangle myRectangle = new Rectangle();
    myRectangle.Width = 200;
    myRectangle.Height = 200;
    SolidColorBrush myBrush = new SolidColorBrush(Colors.Red);
    myRectangle.Fill = myBrush;

    // Create the transform
    TranslateTransform moveTransform = new TranslateTransform();
    moveTransform.X = 0;
    moveTransform.Y = 0;
    myRectangle.RenderTransform = moveTransform;

    // Add the rectangle to the tree.
    LayoutRoot.Children.Add(myRectangle);

    // Create a duration of 2 seconds.
    Duration duration = new Duration(TimeSpan.FromSeconds(2));
    // Create two DoubleAnimations and set their properties.
    DoubleAnimation myDoubleAnimationX = new DoubleAnimation();
    DoubleAnimation myDoubleAnimationY = new DoubleAnimation();
    myDoubleAnimationX.Duration = duration;
    myDoubleAnimationY.Duration = duration;
    Storyboard justintimeStoryboard = new Storyboard();
    justintimeStoryboard.Duration = duration;
    justintimeStoryboard.Children.Add(myDoubleAnimationX);
    justintimeStoryboard.Children.Add(myDoubleAnimationY);
    Storyboard.SetTarget(myDoubleAnimationX, moveTransform);
    Storyboard.SetTarget(myDoubleAnimationY, moveTransform);

    // Set the X and Y properties of the Transform to be the target properties
    // of the two respective DoubleAnimations.
    Storyboard.SetTargetProperty(myDoubleAnimationX, "X");
    Storyboard.SetTargetProperty(myDoubleAnimationY, "Y");
    myDoubleAnimationX.To = 200;
    myDoubleAnimationY.To = 200;

    // Make the Storyboard a resource.
    LayoutRoot.Resources.Add("justintimeStoryboard", justintimeStoryboard);
    // Begin the animation.
    justintimeStoryboard.Begin();
}

Комментарии

Раскадровка является важным классом в концепции раскадровки анимации. Дополнительные сведения о концепции см. в разделе Раскадровка анимации.

Раскадровка используется для следующих свойств:

• VisualState.Storyboard
• VisualTransition.Storyboard
• BeginStoryboard.Storyboard

Эти свойства не являются единственным местом, где определяется раскадровка. Типичный способ использования Раскадровки для раскадровки анимации заключается в том, что раскадровка определяется в коллекции Resources ( Application.Resources или FrameworkElement.Resources, или, возможно, как ресурс в файле, например Generic.xaml для пользовательского элемента управления). Всякий раз, когда он определен как ресурс XAML, всегда следует назначать значение атрибута x:Name раскадровке. Затем вы сможете ссылаться на имя как программную переменную в коде программной части. Эта ссылка потребуется для фактического запуска анимаций, содержащихся в Storyboard, путем вызова метода Begin в этом экземпляре Storyboard. Storyboard также имеет другие методы управления, такие как Stop , которые могут управлять анимацией после этого.

Раскадровка наследует несколько свойств от временной шкалы. Эти свойства можно применить к раскадровке или к одной из анимаций в ней (в коллекции Children ). Настройка свойств временной шкалы на main Storyboard вместо каждой анимации имеет все плюсы и недостатки. Подробнее: Раскадрованные анимации.

Кроме того, для управления предопределенной анимацией, добавляемой в элементы управления или пользовательский интерфейс, также требуется раскадровка, если вы используете одну из анимаций темы. Анимации тем не имеют врожденной точки триггера, поэтому вам нужно содержать анимации тем в раскадровке в качестве дочерних элементов. Если раскадровка используется в качестве значения VisualState.Storyboard , то анимация запускается при загрузке этого визуального состояния. Или, если она находится в VisualTransition.Storyboard, анимация запускается при обнаружении этого перехода с помощью визуального диспетчера состояний. Это наиболее распространенный способ использования анимации темы, но вы также можете поместить его в свободный ресурс Storyboard и явно запустить анимацию, вызвав Begin.

Присоединенные свойства XAML

Storyboard — это класс службы узла для нескольких присоединенных свойств XAML. Они позволяют выполнять дочерние анимации под управлением раскадровки для каждого целевого объекта, отдельного целевого элемента и целевых свойств, при этом следовать тому же управляющей временная шкала и механизму активации, что и родительский.

Для поддержки доступа обработчика XAML к присоединенным свойствам, а также для предоставления коду эквивалентных операций получения и задания , каждое присоединенное свойство XAML имеет пару методов доступа Get и Set. Другой способ получить или задать значение в коде — использовать систему свойств зависимостей, вызывая GetValue или SetValue и передавая поле идентификатора в качестве идентификатора свойства зависимостей.

Конструкторы

Свойства

Присоединенные свойства

Методы

События

Применяется к

См. также раздел

• Timeline
• TimelineCollection
• Storyboard
• Storyboard
• Раскадрованные анимации
• Анимации по ключевым кадрам и на основе функций для реалистичной анимации
• Синтаксис Property-path
• Общие сведения о присоединенных свойствах