SplineDoubleKeyFrame 類別

定義

public ref class SplineDoubleKeyFrame sealed : DoubleKeyFrame

/// [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 SplineDoubleKeyFrame final : DoubleKeyFrame

[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 SplineDoubleKeyFrame : DoubleKeyFrame

Public NotInheritable Class SplineDoubleKeyFrame
Inherits DoubleKeyFrame

<SplineDoubleKeyFrame .../>

繼承

Object Platform::Object IInspectable DependencyObject DoubleKeyFrame SplineDoubleKeyFrame

屬性

ActivatableAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

範例

這個 XAML 範例是在螢幕上移動一個矩形。 範例使用 DoubleAnimationUsingKeyFrames 類別來動畫化 TranslateTransform 對矩形的 X 屬性。 此動畫使用三個關鍵影格，方式如下：

1. 在前三秒內，它會利用 LinearDoubleKeyFrame 類別的實例，以穩定的速度將矩形從起始位置移動到 500 的位置。 像 LinearDoubleKeyFrame 這類線性關鍵影格能在數值間創造平滑的線性過渡。
2. 在第四秒結束時，它會使用 DiscreteDoubleKeyFrame 類別的實例，突然將矩形移動到下一個位置。 像 DiscreteDoubleKeyFrame 這類離散關鍵影格會造成值間的突然跳躍。 在這個例子中，矩形先在起始位置，然後突然出現在 500 的位置。
3. 在最後兩秒，它會使用 SplineDoubleKeyFrame 類別的實例，將矩形移回起始位置。 樣條鍵框如 SplineDoubleKeyFrame，會根據 KeySpline 屬性的值在值間產生可變的轉換。 在這個例子中，矩形一開始是緩慢移動，然後在時間段結束時呈指數速度加速。

<StackPanel>
    <StackPanel.Resources>
        <Storyboard x:Name="myStoryboard">

            <!-- Animate the TranslateTransform's X property
             from 0 to 350, then 50,
             then 200 over 10 seconds. -->
            <DoubleAnimationUsingKeyFrames
          Storyboard.TargetName="MyAnimatedTranslateTransform"
          Storyboard.TargetProperty="X"
          Duration="0:0:10" EnableDependentAnimation="True">

                <!-- Using a LinearDoubleKeyFrame, the rectangle moves 
                 steadily from its starting position to 500 over 
                 the first 3 seconds.  -->
                <LinearDoubleKeyFrame Value="500" KeyTime="0:0:3" />

                <!-- Using a DiscreteDoubleKeyFrame, the rectangle suddenly 
                 appears at 400 after the fourth second of the animation. -->
                <DiscreteDoubleKeyFrame Value="400" KeyTime="0:0:4" />

                <!-- Using a SplineDoubleKeyFrame, the rectangle moves 
                 back to its starting point. The
                 animation starts out slowly at first and then speeds up. 
                 This KeyFrame ends after the 6th
                 second. -->
                <SplineDoubleKeyFrame KeySpline="0.6,0.0 0.9,0.00" Value="0" KeyTime="0:0:6" />

            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </StackPanel.Resources>
    <Rectangle Fill="Blue" Width="50" Height="50" Loaded="Start_Animation">
        <Rectangle.RenderTransform>
            <TranslateTransform x:Name="MyAnimatedTranslateTransform" 
             X="0" Y="0" />
        </Rectangle.RenderTransform>
    </Rectangle>
</StackPanel>

// Start the animation when the object loads
private void Start_Animation(object sender, RoutedEventArgs e)
{
    myStoryboard.Begin();
}

備註

關鍵影格動畫可以在動畫時間軸中的某個時刻使多個目標值被達成。 換句話說，每個關鍵影格可以指定不同的中間值，最後一個關鍵影格就是最終動畫值。 透過指定多個要製作動畫的值，您可以製作更複雜的動畫。 你可以在同一個關鍵影格集合中混合離散、線性和樣條關鍵幀。

想了解更多如何使用關鍵影格動畫，請參見 關鍵影格動畫與輕鬆功能動畫。

另請參閱

• DoubleKeyFrame
• DoubleAnimationUsingKeyFrames
• DoubleKeyFrameCollection
• KeyTime
• Value
• 分鏡腳本動畫
• 關鍵影格動畫與緩和功能動畫