代码之家  ›  专栏  ›  技术社区  ›  Brent Schooley

如何使控件动画化,使其像羊皮纸一样在WPF中滚动?

  •  1
  • Brent Schooley  · 技术社区  · 16 年前

    有人知道如何使一个面板的动画看起来像在WPF中的老式羊皮卷一样向下滚动吗?任何帮助都将不胜感激。

    2 回复  |  直到 16 年前
        1
  •  4
  •   Jared Bienz - MSFT    16 年前

    问题是,这是一个相当复杂的动画,需要反转并压扁控件的一部分,而控件的其余部分则不是。所以这不能用简单的缩放或拉伸动画来回答。您可能可以在指向用户控制柄的VisualBrush上使用多个动画,但在运行时将这些东西交换进来和交换出去确实很复杂。

    我建议您查看codeplex上的Transitionals项目:

    Transitionals Project

    过渡包括许多不同类型的动画,其中一个可能足够接近你。如果没有,您可以查看如何构建过渡,并查看是否可以调整过渡以满足您的需要。

    最后,最有效的方法是使用着色器。不过,明暗器需要一些数学运算,并用hlsl(而不是c)编写。如果您有兴趣了解更多信息,我强烈建议您阅读以下文章:

    Writing custom GPU-based Effects for WPF

        2
  •  0
  •   Marcel B    16 年前

    你想要的效果真的很复杂。但是一个简单的替代方法是设置高度/宽度的动画。
    在本例中,我对stackpanel设置了动画,但您可以用任何控件替换它。

    <StackPanel Name="myStackPanel">
    ...
        <StackPanel.Triggers>
            <EventTrigger RoutedEvent="StackPanel.MouseEnter">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="myStackPanel"
                                         Storyboard.TargetProperty="Height"
                                         To="100" Duration="0:0:1.0" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </StackPanel.Triggers>
    </StackPanel>
    

    您可能需要添加第二个动画为5的触发器(例如在mouseleave上)。设置为0的动画可能会阻止MouseEnter事件。