用户控制 Storyboard 在 Metro 风格应用程序中不起作用

Question

我是 Metro 风格应用程序开发的新手，我为上下动画创建了故事板。

 <UserControl.Resources>
    <Storyboard x:Name="up_animation" >            
        <DoubleAnimationUsingKeyFrames   EnableDependentAnimation="True" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="grid1">
            <EasingDoubleKeyFrame KeyTime="0" Value="-1"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="-509"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
    <Storyboard x:Name="down_animation"  >
        <DoubleAnimationUsingKeyFrames EnableDependentAnimation="True"  Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="grid1">
            <EasingDoubleKeyFrame KeyTime="0" Value="-508"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="30"/>                
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
</UserControl.Resources>

在我的完成按钮 Taped 事件中，我添加了此代码

 private void Image_Tapped_1(object sender, TappedRoutedEventArgs e)
    {
        down_animation.Begin();
    }

但它会抛出异常

 {System.Exception: Unspecified error
   at Windows.UI.Xaml.Media.Animation.Storyboard.Begin()
   at Keypaddesign.samp.mykey_done_Taped_1(Object sender, EventArgs e) in e:\WorkArea\Keypaddesign\Keypaddesign\samp.xaml.cs:line 95}

如何解决这个问题。

Answer 1

我已经制作了一个使用用户控件和情节提要的示例项目，希望对您有所帮助。
它是带有情节提要的 usercontrol xaml 类。

    <Storyboard x:Name="Storyboard1">
        <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="stackPanel" d:IsOptimized="True"/>
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationZ)" Storyboard.TargetName="stackPanel">
            <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="stackPanel">
            <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
            <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="-30"/>
        </DoubleAnimationUsingKeyFrames>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="stackPanel">
            <DiscreteObjectKeyFrame KeyTime="0">
                <DiscreteObjectKeyFrame.Value>
                    <HorizontalAlignment>Stretch</HorizontalAlignment>
                </DiscreteObjectKeyFrame.Value>
            </DiscreteObjectKeyFrame>
            <DiscreteObjectKeyFrame KeyTime="0:0:0.2">
                <DiscreteObjectKeyFrame.Value>
                    <HorizontalAlignment>Left</HorizontalAlignment>
                </DiscreteObjectKeyFrame.Value>
            </DiscreteObjectKeyFrame>
        </ObjectAnimationUsingKeyFrames>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.VerticalAlignment)" Storyboard.TargetName="stackPanel">
            <DiscreteObjectKeyFrame KeyTime="0">
                <DiscreteObjectKeyFrame.Value>
                    <VerticalAlignment>Stretch</VerticalAlignment>
                </DiscreteObjectKeyFrame.Value>
            </DiscreteObjectKeyFrame>
            <DiscreteObjectKeyFrame KeyTime="0:0:0.2">
                <DiscreteObjectKeyFrame.Value>
                    <VerticalAlignment>Top</VerticalAlignment>
                </DiscreteObjectKeyFrame.Value>
            </DiscreteObjectKeyFrame>
        </ObjectAnimationUsingKeyFrames>
    </Storyboard>
</UserControl.Resources>
<Grid Name="grid1" RenderTransformOrigin="0.5,0.5" >
    <Grid.RenderTransform>
        <CompositeTransform/>
    </Grid.RenderTransform>

    <StackPanel x:Name="stackPanel" Orientation="Vertical" Tapped="StackPanel_Tapped_1" RenderTransformOrigin="0.5,0.5" >
        <StackPanel.Projection>
            <PlaneProjection/>
        </StackPanel.Projection>
        <StackPanel.RenderTransform>
            <CompositeTransform/>
        </StackPanel.RenderTransform>
        <Button Content="alkdfjklajhklgh" Width="100" Height="50" Margin="2" />
        <Button Content="alkdfjklajhklgh" Width="100" Height="50" Margin="2" />
        <Button Content="alkdfjklajhklgh" Width="100" Height="50" Margin="2" />
    </StackPanel>

</Grid>

在 stackpanel 点击我已经像这样在 MyUsercontrol1.cs 中启动了故事板

public sealed partial class MyUserControl1 : UserControl
{
    public MyUserControl1()
    {
        this.InitializeComponent();
    }

    private void StackPanel_Tapped_1(object sender, TappedRoutedEventArgs e)
    {
        Storyboard1.Begin();
    }
}

你可以像这样在你的主页中使用这个用户控件。

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <local:MyUserControl1 HorizontalAlignment="Left" Margin="585,366,0,0" VerticalAlignment="Top" Tapped="MyUserControl1_Tapped_1"/>


</Grid>