需要在 Windows 8 应用程序中的 Blend 中创建动画

Question

我正在创建一个 XAML Windows 8 应用程序，我需要创建一个类似逐帧动画的动画，即每一帧都包含一个不同的图像，所有图像的集合构成一个动画。像一个人跑步等。

我有图像，目前我发现的方法是为所有图像创建图像控件，然后在不同的时间范围内隐藏一个并显示另一个。这是我现在能找到的唯一方法。

但是当我尝试在 Storyboard 中更改该图像控件的来源时，它不会发生。

谁能告诉我有没有比图像控制折叠和可见更好的方法？

代码：

<Image Tapped="tapped_OldMan" x:Name="OldMan1" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050001.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan2" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050002.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan3" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050003.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan4" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050004.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan5" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050005.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan6" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050006.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan7" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050007.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan8" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050008.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan9" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050009.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan10" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050010.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan11" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050011.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan12" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050012.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan13" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050013.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan14" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050014.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan15" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050015.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan16" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050016.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan17" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050017.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan18" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050018.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan19" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050019.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan20" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050020.png" Width="160" Height="216" Margin="10,0,0,40"/>
        <Image x:Name="OldMan21" Visibility="Collapsed" VerticalAlignment="Bottom" HorizontalAlignment="Left" Grid.Column="5" Source="ms-appx:///JungleTheme/Images/VocabAnimations/oldmc/05/050021.png" Width="160" Height="216" Margin="10,0,0,40"/>




  <Storyboard x:Name="OldManAnimate">
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan1">
                <DiscreteObjectKeyFrame KeyTime="0">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.1">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:2.01">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan2">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.1">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.2">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan3">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.2">
                   <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.3">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan4">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.3">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.4">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan5">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.4">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan6">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.6">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan7">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.6">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.7">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan8">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.7">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.8">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan9">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.8">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.9">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan10">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.9">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.0">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan11">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.0">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.1">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan12">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.1">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.2">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan13">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.2">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.3">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan14">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.3">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.4">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan15">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.4">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.5">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan16">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.5">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.6">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan17">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.6">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.7">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan18">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.7">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                   </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.8">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan19">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.8">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:1.9">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan20">
                <DiscreteObjectKeyFrame KeyTime="0:0:1.9">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:2.0">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OldMan21">
                <DiscreteObjectKeyFrame KeyTime="0:0:2.0">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Visible</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
                <DiscreteObjectKeyFrame KeyTime="0:0:2.01">
                    <DiscreteObjectKeyFrame.Value>
                        <Visibility>Collapsed</Visibility>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>

Answer 1

这是一个更好的方法......

 <Storyboard x:Name="storyboard" >
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="image" Storyboard.TargetProperty="Source">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.0" Value="/images/HandAnimationGirl/girl-hand0.png"/>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.03" Value="/images/HandAnimationGirl/girl-hand1.png"/>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.06" Value="/images/HandAnimationGirl/girl-hand2.png"/>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.10" Value="/images/HandAnimationGirl/girl-hand3.png"/>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.15" Value="/images/HandAnimationGirl/girl-hand4.png"/>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.25" Value="/images/HandAnimationGirl/girl-hand.png"/>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>

这是制作故事板 fpr 帧的正确方法