用户控件Storyboard无法在Metro风格应用中使用

时间:2013-07-01 12:51:02

标签: c#-4.0 microsoft-metro windows-store-apps

我是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>

在我的完成按钮录音事件中,我添加了此代码

 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}

如何解决这个问题。

1 个答案:

答案 0 :(得分:1)

我已经制作了一个使用usercontrol和storyboard的示例项目,希望它对您有所帮助 它是带有storybord的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>