WPF 實現波浪浮動效果

目標：實現介面表徵圖Load時，整體表徵圖出現上下波浪浮動效果，如下圖：

前台代碼：

<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero" mc:Ignorable="d"
x:Class="目錄波浪效果.MainWindow"
x:Name="Window"
Title="MainWindow"
Width="640" Height="480" Loaded="Window_Loaded" Background="#FF97B7DE">
<Window.Resources>
        <Storyboard x:Key="Storyboard2">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" >
                <EasingDoubleKeyFrame  Value="-300">
                    <EasingDoubleKeyFrame.EasingFunction>
<BackEase EasingMode="EaseOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </Window.Resources>


<Grid x:Name="LayoutRoot">
<Ellipse x:Name="ellipse1" Fill="#FF0707F3" HorizontalAlignment="Left" Margin="31.5,0,0,20" Stroke="Black" Width="100" Height="100" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5" >
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
        <Ellipse x:Name="ellipse2" Fill="#FF27E40C" Margin="152.5,0,0,20" Stroke="Black" HorizontalAlignment="Left" Height="100" Width="100" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5">
        <Ellipse.RenderTransform>
            <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform/>
                <TranslateTransform/>
            </TransformGroup>
            </Ellipse.RenderTransform>
        </Ellipse>
        <Ellipse x:Name="ellipse3" Fill="#FFF57406" Margin="268.5,0,265.5,20" Stroke="Black" Height="90" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5">
            <Ellipse.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Ellipse.RenderTransform>
        </Ellipse>
        <Ellipse x:Name="ellipse4" Fill="#FF02FFE2" HorizontalAlignment="Right" Margin="0,0,148.5,20" Stroke="Black" Width="90" Height="90" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5">
            <Ellipse.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Ellipse.RenderTransform>
        </Ellipse>
        <Ellipse x:Name="ellipse5" Fill="#FFDE0BE9" Height="100" Width="100" Margin="0,0,33,20" Stroke="Black" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Right" d:LayoutOverrides="Width">
            <Ellipse.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Ellipse.RenderTransform>
        </Ellipse>
    </Grid>
</Window>

後台代碼：

private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            int t = 0;
            foreach (FrameworkElement element in this.LayoutRoot.Children)
            {
                t++;
                Storyboard storyboard = this.FindResource("Storyboard2") as Storyboard;
                DoubleAnimationUsingKeyFrames frames = storyboard.Children[0] as DoubleAnimationUsingKeyFrames;
                EasingDoubleKeyFrame eas = frames.KeyFrames[0] as EasingDoubleKeyFrame;
                eas.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromMilliseconds(2000 + t * 200));
                Storyboard.SetTargetName(frames, element.Name);
                storyboard.Begin();
            }
        }