使用数据模板将视图与视图模型关联时如何以动画方式从一个视图到另一个视图的转换

obi*_*mme 5 wpf animation transition mvvm mvvm-light

我将发布我目前拥有的源代码,然后解释我的问题。

这是我希望发生转换的窗口

<Window x:Class="MyApp.MainView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MyApp" Height="600" Width="800">
<StackPanel>
    <Button Content="View1" Command="{Binding View1Command}"/>
    <Button COntent="View2" Command="{Binding View2Command}"/>
    <ContentControl Content="{Binding MyContent}"/>
</StackPanel>
Run Code Online (Sandbox Code Playgroud)

这是关联的视图模型

public class MainViewModel
{
    public RelayCommand View1Command{ get; private set;}
    public RelayCommand View2Command{ get; private set;}

    //INotifyPropertyChanged is implemented of course
    public ViewModelBase MyContent { get; set;}

    public MainViewModel()
    {
        View1Command = new RelayCommand(() => { MyContent = new ViewModel1();});
        View2Command = new RelayCommand(() => { MyContent = new ViewModel2();});
    }
}
Run Code Online (Sandbox Code Playgroud)

在 app.xaml 中,我使用数据模板将 ViewModel1 与 View1 关联,将 ViewModel2 与 View2 关联。这一切都按预期进行。单击按钮时,视图会发生变化,数据绑定有效,一切正常。

我现在喜欢做的是在视图改变时使用动画。

我必须做什么才能为两个视图之间的过渡设置动画,比如说新视图的动画淡入淡出。旧视图消失,新视图在一秒钟内淡入。

希望你能帮我。

此致

帕斯卡

PS,如果我使用数据模板的方法没有意义,并且使用该方法不可能实现动画,我愿意接受其他最佳实践,从一个视图更改为另一个视图。我使用的解决方案取自 karl shifflet 的 wpf 演示应用程序,但我不知道这是否是我尝试做的事情的正确解决方案。

obi*_*mme -1

我通过使用视图模型定位器将视图绑定到视图模型以及使用视觉状态管理器进行转换来更改转换方法。

  • 介意发布您的解决方案的内容吗?我正在做类似的事情,并努力维护 MVVM,同时引发我想要的行为。 (7认同)