如何使用数据模板将视图与视图模型相关联时,如何将视图从一个视图转换为另一个视图
我将发布我的源代码,然后解释我的问题。如何使用数据模板将视图与视图模型相关联时,如何将视图从一个视图转换为另一个视图
这就是我想要的过渡发生
<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>
窗口这是相关联的视图模型
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();});
}
}
在App.xaml中我使用的数据模板将ViewModel1与View1和ViewModel2与View2相关联。这一切都按预期工作。当点击按钮时,视图改变,数据绑定工作,一切正常。
我现在喜欢做的是在视图改变时使用动画。
我需要做什么来动画两个视图之间的过渡,让我们说新视图的动画淡入淡出。旧视图消失,新视图在一秒内消失。
希望你能帮助我。
问候
帕斯卡
附:如果我对数据模板的处理方法没有意义,并且采用这种方法不可能进行动画处理,那么我可以将其他最佳实践从onw视图更改为另一个。我使用的解决方案是由karl shifflet的wpf demo app取得的,但我不知道这是否是我尝试做的事情的正确解决方案。
我通过使用视图模型定位器将视图绑定到viewmodel和视觉状态管理器进行转换,改变了我的转换方法。
记住你的解决方案的胆量?我正在做类似的事情,努力维护MVVM,同时引发我想要的行为。 – 2011-09-15 10:41:16
<Window.Resources>
<Storyboard x:Key="OnClick1">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CC1">
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CC2">
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="OnClick2">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CC1">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="CC2">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="ButtonBase.Click" SourceName="button">
<BeginStoryboard x:Name="OnClick1_BeginStoryboard" Storyboard="{StaticResource OnClick1}"/>
<BeginStoryboard x:Name="OnClick2_BeginStoryboard" Storyboard="{StaticResource OnClick2}"/>
</EventTrigger>
</Window.Triggers>
<StackPanel>
<Button x:Name="button" Content="View1" Command="{Binding View1Command}"/>
<Button Content="View2" Command="{Binding View2Command}"/>
<Grid>
<ContentControl Name="CC1" Opacity="1" Content="{Binding MyContent}"/>
<ContentControl Name="CC2" Opacity="0" Content="{Binding MyContent}"/>
</Grid>
</StackPanel>
,这使MVVM的垃圾 – Snowbear 2011-06-06 08:51:29
没有足够的时间来写出完整的答案,所以这里是一个快速总结:关键点是使用[BoT](https://github.com/thinkpixellab/bot)库的过渡(样本文件可以是发现[这里](https://github.com/thinkpixellab/bot/blob/master/Demo/Wpf/TransitionPresenter/TransitionPresenterPage.xaml))。看一下'TransitionPresenter'控件,它具有'Content'属性,所以你只需要选择一个渐变过渡并将'Content'绑定到你的'MyContent' VM属性。当然,我还没有尝试过,但似乎并不困难。 – Snowbear 2011-06-06 08:58:31