WPF 堆栈面板可见性动画

发布于 2024-12-08 21:41:53 字数 836 浏览 1 评论 0原文

我有一个带有按钮的堆栈面板,单击该按钮会使堆栈面板消失。我想对可见到隐藏的过渡形式进行动画处理,但一直无法做到。

我环顾四周,发现了一些看起来像这样的东西:

<StackPanel Margin="80,60,60,80" Background="Gray">
    <StackPanel.Triggers >

        <EventTrigger  > 
            <EventTrigger.Actions>
                <BeginStoryboard>
                    <Storyboard TargetProperty="Visibility">

                        <DoubleAnimation Duration="0:0:5:0" From="Visible" To="Hidden"/>

                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger.Actions>
        </EventTrigger>

    </StackPanel.Triggers>
    <Button Name="buttonTop" Content="TOP" Margin="40,40,40,40" Click="buttonTop_Click" Width="131" />
</StackPanel>

当然,它还没有 100% 实现。有什么想法吗?

I have a stackpanel with a button which, when clicked, makes the stackpanel disappear. I want to animate the transition form visible to hidden, but haven't been able to.

I looked around for a while and bumped into something that looks like this:

<StackPanel Margin="80,60,60,80" Background="Gray">
    <StackPanel.Triggers >

        <EventTrigger  > 
            <EventTrigger.Actions>
                <BeginStoryboard>
                    <Storyboard TargetProperty="Visibility">

                        <DoubleAnimation Duration="0:0:5:0" From="Visible" To="Hidden"/>

                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger.Actions>
        </EventTrigger>

    </StackPanel.Triggers>
    <Button Name="buttonTop" Content="TOP" Margin="40,40,40,40" Click="buttonTop_Click" Width="131" />
</StackPanel>

which of course, is not 100% there yet. Any ideas?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

眼角的笑意。 2024-12-15 21:41:53

您可以使用

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ItemsHost"
                               Storyboard.TargetProperty="Visibility">
    <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{x:Static Visibility.Visible}"/>
</ObjectAnimationUsingKeyFrames>

这几乎是情节提要中的设置器,其中 KeyTime 描述了应该设置值的时间。
因此,完整的故事板将如下所示:

<BeginStoryboard>
    <Storyboard>
        <DoubleAnimation Storyboard.TargetProperty="Opacity"
                         To="0" Duration="0:0:5.0"/>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
            <DiscreteObjectKeyFrame KeyTime="0:0:5.0" Value="{x:Static Visibility.Hidden}"/>
        </ObjectAnimationUsingKeyFrames>
    </Storyboard>
</BeginStoryboard>

编辑:如何在单击按钮时触发故事板:

<Button Content="Button" HorizontalAlignment="Left" Margin="337,221,0,0" VerticalAlignment="Top" Width="75">
    <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="Opacity"
                 To="0" Duration="0:0:5.0"/>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0:0:5.0" Value="{x:Static Visibility.Hidden}"/>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Button.Triggers>
</Button>

You can use

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ItemsHost"
                               Storyboard.TargetProperty="Visibility">
    <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{x:Static Visibility.Visible}"/>
</ObjectAnimationUsingKeyFrames>

This is pretty much a setter in a storyboard, where KeyTime describes the time when the value should be set.
So the full storyboard would be like this:

<BeginStoryboard>
    <Storyboard>
        <DoubleAnimation Storyboard.TargetProperty="Opacity"
                         To="0" Duration="0:0:5.0"/>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
            <DiscreteObjectKeyFrame KeyTime="0:0:5.0" Value="{x:Static Visibility.Hidden}"/>
        </ObjectAnimationUsingKeyFrames>
    </Storyboard>
</BeginStoryboard>

edit: How to make the storyboard trigger when button is clicked:

<Button Content="Button" HorizontalAlignment="Left" Margin="337,221,0,0" VerticalAlignment="Top" Width="75">
    <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="Opacity"
                 To="0" Duration="0:0:5.0"/>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0:0:5.0" Value="{x:Static Visibility.Hidden}"/>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Button.Triggers>
</Button>
于我来说 2024-12-15 21:41:53

Visibiltiy 是一个离散值 - 它要么打开,要么关闭,因此动画仍然会导致突然消失而不是逐渐淡出。您可以将 StackPanelOpacity 从 1 设置为 0,然后将 Visibilty 设置为 Hidden (或折叠)之后。

Visibiltiy is a discrete value - it's either on or off, so animating will still result in a sudden disappearance rather than a gradual fading out. You could instead animate the Opacity of the StackPanel from 1 to 0, and then animate the Visibilty to Hidden (or Collapsed) after that.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文