silverlight-4.0 - Silverlight、Expression Blend 4、VisualStageGroup を使用

Question

次のように、非常に単純な Silverlight アプリケーションを作成しました。

<Grid x:Name="LayoutRoot" Background="White">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="VisualStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition GeneratedDuration="0:0:2"/>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Home"/>
            <VisualState x:Name="About">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="HomeLabel">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Collapsed</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="AboutLabel">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="HomeHide">
                <Storyboard>
                    <DoubleAnimation Duration="0" To="9" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="113" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="AboutHide">
                <Storyboard>
                    <DoubleAnimation Duration="0" To="112" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="-1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="HomeLabel">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Collapsed</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="AboutLabel">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Grid x:Name="grid" Height="110" Margin="104,0,163,0" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5">
        <Grid.RenderTransform>
            <CompositeTransform/>
        </Grid.RenderTransform>
        <Rectangle Stroke="Black" Fill="Gray"/>
        <sdk:Label x:Name="HomeLabel" Content="Home" HorizontalAlignment="Left" VerticalAlignment="Top"/>
        <sdk:Label x:Name="AboutLabel" Margin="0" VerticalAlignment="Top" FontFamily="Times New Roman" Height="15" Content="About" Visibility="Collapsed"/>
    </Grid>
</Grid>

画面からメニューを表示および非表示にするために、Home、HomeHide、About、および AboutHide の 4 つの状態を含む VisualStateGroup を作成しました。しかし、About と AboutHide の状態をプレビューすると、アニメーションは Base 状態を使用して状態間を移動し、アニメーションの最後に要求した状態に切り替わります。自分自身をよりよく説明しようとするために、私は期待していました：

概要 -> 概要非表示

しかし、代わりに次のように表示されます。

About -> Base -> AboutHide

何か足りない？または、それらを間違った方法で使用していて、誰かが私にアドバイスをくれることを望んでいました.

御時間ありがとうございます。