Question

我对WPF中的状态和动画有点困惑。

我想做一个用户控件。此用户控件将包含（在主网格内）2另一个网格。其中一个是HEADER，第二个是CONTENT。如果用户单击标题，内容将展开，否则将折叠。我想要扩展的动画（向下滑动标题中的内容）。

Basicaly我希望各州（为了将来的目的）这样做。问题是，如果我添加状态并且我使用带有变换的幻灯片效果，则此网格（CONTENT GRID）的内容也会被转换。所以我想使用状态只修改元素的高度。如果你只修改元素，就不会出现动画，只是一次改变它的高度。

层次结构如下：
---包装网格
------标题网格
---------标题内容
------内容网格
---------内容网格的内容（如按钮，标签等）

视觉状态如下：

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="VisualStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition GeneratedDuration="0:0:1"/>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Expanded"/>
            <VisualState x:Name="Collapsed">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="grid">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>0</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

任何建议看到通过状态修改高度来扩展和折叠网格？只有动画才能完美，但对于我来说，对状态这样做更好，我说的是为了将来的目的。

Answer 1

也许我找到了答案。现在它可行，但我正在努力了解这些变化。

这里的视觉状态代码：

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="VisualStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition GeneratedDuration="0"/>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Expanded">
                <Storyboard>
                    <DoubleAnimation EnableDependentAnimation="True" Storyboard.TargetName="grid" Storyboard.TargetProperty="(FrameworkElement.Height)" From="0" To="366" Duration="0:0:0.600" />
                </Storyboard>
            </VisualState>
            <VisualState x:Name="Collapsed">
                <Storyboard>
                    <DoubleAnimation EnableDependentAnimation="True" Storyboard.TargetName="grid" Storyboard.TargetProperty="(FrameworkElement.Height)" From="366" To="0" Duration="0:0:0.600" />
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

重要的一点是：

<DoubleAnimation EnableDependentAnimation="True" Storyboard.TargetName="grid" Storyboard.TargetProperty="(FrameworkElement.Height)" From="366" To="0" Duration="0:0:0.600" />

我发现它需要EnableDependantAnimation为真。

现在它作为魅力，但我不喜欢FROM TO设置。但它可能是我能在这里做的最好的。

wpf usercontrol状态，修改高度

1 个答案: