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# - 将解析的字符串列表添加到字典 wpf c#

wpf - TaskFactory 新 UI 创建

android - Android listview打开手势的实现方法

flash - 旋转 Sprite 将 Sprite 从其原始位置移动

wpf - WPF DataGrid 中的动态列生成

c# - WPF-MVVM多项目结构

wpf - 如何用 ListBox 上的 ContentPresenter 替换 ScrollViewer?

c# - 如何使用 MVVM 为用户偏好创建程序架构

html - 使三 Angular 形动画拉伸(stretch)而不是移动

c# - 如何使 CM View 显示两个 subview 之一,所有(包括父)都绑定(bind)到同一个 View 模型?