Question

我正在尝试使用动画折叠/展开网格，同时动画会相应地移动所有其他组件。

到目前为止我用过

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="GridName">
     <DiscreteObjectKeyFrame KeyTime="0:0:0.59" Value="0,0,0,0" />
     (...more frames)
</ObjectAnimationUsingKeyFrames >

但效果远非可接受（动画不顺畅）。如果新控件有这样的选项，我在徘徊？我还遇到了一些扩展/折叠ListViews - 但是它们不能用于包含数据。

编辑：我尝试了动画高度属性 - 但没有任何反应（没有错误，没有可见的结果）。在我的代码下面：

<Storyboard x:Name="MainImageSlideOut">
        <DoubleAnimation Duration="0:0:1" To="0" 
                             Storyboard.TargetProperty="Height" 
                             Storyboard.TargetName="Grid" 
                             EnableDependentAnimation="True"/>

</Storyboard>
<Storyboard x:Name="MainImageSlideIn">
        <DoubleAnimation Duration="0:0:1" To="250" 
                             Storyboard.TargetProperty="Height" 
                             Storyboard.TargetName="Grid" 
                             EnableDependentAnimation="True"/>

</Storyboard>

....

<Grid Background="#171717">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>

    <Grid Grid.Row="1" 
          Height="250"
          x:Name="Grid" 
          Background="#202020" />            

    <ScrollViewer Grid.Row="2">
    ...
    </ScrollViewer>

</Grid>

Answer 1

我的应用程序中有类似的功能我使用它的方式是使用ScaleTransform这是一个例子：

<Storyboard x:Key="gridLoading">
    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="IAmGroot">
        <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:1" Value="1">
            <EasingDoubleKeyFrame.EasingFunction>
                <CubicEase EasingMode="EaseOut"/>
            </EasingDoubleKeyFrame.EasingFunction>
        </EasingDoubleKeyFrame>
    </DoubleAnimationUsingKeyFrames>
    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="IAmGroot">
        <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
     </DoubleAnimationUsingKeyFrames>
</Storyboard>

这将从屏幕中间加载网格并将其展开以适合屏幕如果你想对所有元素执行动画，那么这个动画就可以解决问题，但是如果你需要不同的行为，你可能需要分别处理Grid内部项目的动画。
HTH

展开/折叠网格

1 个答案: