Question

将作为扩展器工作。我想扩展动画。所以，我这样做了：

<VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="SuspendExpand">
            <VisualStateGroup.Transitions>
                <VisualTransition GeneratedDuration="0:0:0.5"/>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Suspend"/>
            <VisualState x:Name="Expand">
                <Storyboard>
                    <DoubleAnimation Duration="0" To="439" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="MyRectangle" EnableDependentAnimation="true"/>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Rectangle x:Name="MyRectangle" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="177" Margin="313,281,0,0" Stroke="Black" VerticalAlignment="Top" Width="342" Tapped="rectangle_Tapped"/>

方法：

    private void rectangle_Tapped(object sender, Windows.UI.Xaml.Input.TappedRoutedEventArgs e)
    {
        VisualStateManager.GoToState(this, "Expand", true);
    }

但扩张并不是动画。

但是当我使用它时：

<Page.Resources>
    <Storyboard x:Name="NewStory">
        <DoubleAnimation Storyboard.TargetName="MyRectangle"  Storyboard.TargetProperty="Height" From="177"  EnableDependentAnimation="true" To="500" Duration="0:0:1" />
    </Storyboard>
</Page.Resources>

方法：

    private void rectangle_Tapped(object sender, Windows.UI.Xaml.Input.TappedRoutedEventArgs e)
    {
        NewStory.Begin();
    }

它是动画的。有什么不同？这是否意味着我无法使用视觉状态？

Answer 1

我认为这是因为你正在为Height属性制作动画。如果使用缩放变换进行动画处理，它将起作用。

像这样：

        <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="SuspendExpand">
            <VisualStateGroup.Transitions>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Suspend" />
            <VisualState x:Name="Expand">
                <Storyboard>
                    <DoubleAnimation Duration="0:0:0.5" To="2.1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="MyRectangle" d:IsOptimized="True"/>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

Windows Metro中的动画高度更改

1 个答案: