WPF MVVM属性更改动画

标签 wpf animation mvvm

我正在寻找一种干净的方法来启动具有动态值的动画。基本上,我想制作一个动画,其中一个元素根据另一个元素的数据更改宽度。假设我有一个TextBlock,其Text属性为Binding。当此属性更改时,我希望一个可视元素说一个Rectangle以便我们做一个DoubleAnimation,将宽度从以前的值更改为新值。

如果可能的话,我试图避免在我的 View 中放置代码。我研究了DataTriggers,但它们似乎要求您知道该值是什么,例如Enum。在我的情况下,仅是值更改才需要触发 Storyboard ,动画将需要从当前(上一个)值开始并很好地移动到新值。

有任何想法吗。也许我只是错过了一个属性(property)。

最佳答案

这是我最终得到的解决方案。为了基于ViewModel中的数据进行动画处理,我使用了DataTrigger。下面是我的控件样式。

<Style TargetType="Grid" x:Key="DetailRotation" >
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=AnimationState}" Value="New">
            <DataTrigger.EnterActions>
                <StopStoryboard BeginStoryboardName="EndAnimation" />
                <BeginStoryboard Name="NewAnimation">
                    <Storyboard>
                        <ThicknessAnimation Storyboard.TargetProperty="Margin" From="0,30,0,0" To="0,0,0,0" Duration="0:0:1" />
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:1" />
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
            <DataTrigger.ExitActions>

            </DataTrigger.ExitActions>

        </DataTrigger>
        <DataTrigger Binding="{Binding Path=AnimationState}" Value="End">
            <DataTrigger.EnterActions>
                <StopStoryboard BeginStoryboardName="NewAnimation" />
                <BeginStoryboard Name="EndAnimation">
                    <Storyboard>
                        <ThicknessAnimation Storyboard.TargetProperty="Margin" From="0,0,0,0" To="0,-20,0,0" Duration="0:0:1"/>
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:1" />
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
        </DataTrigger>

    </Style.Triggers>
</Style>

关于WPF MVVM属性更改动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1649828/

相关文章:

c# - MVVM:将 ContentControl 绑定(bind)到 CheckBox

wpf - 如何在WPF中连续播放.gif文件

WPF 3D 模型绘图工具

c# - 如何从用户控件而不是本地访问主窗口中声明的数据上下文

c# - MVVM访问整个 View 的实践

CSS关键帧动画超链接

c# - 在 WPF 中的动画重复之间暂停

javascript - 伪元素的 CSS 动画在 FF 中不起作用

silverlight - 哪种Silverlight MVVM测试项目类型?

wpf - 使用 MVVM,每个 UI 窗口是否都有自己的 ViewModel?