作为一个把事件处理从code-behind转移到ViewModel的工具,我们看一下Behavior的介绍。
行为最初是为了帮助设计师在Blend里更好的设计,但是对程序员也很有帮助。例如,它的一个设计目标是将程序(测试)逻辑的代码(测试这部分是比较复杂困难的)从code-behind转移出来,将其放在ViewModel中,这样设计人员和程序员的工作可以分离开来。总之就是跟分层啊、MVC啊那一套差不多。那怎样做一个事件呢,比如一个按钮单击事件?
我们将构建
为了说明这一点,我们返回第一部分的例子,添加一个按钮到首页,将其导航到第二页。如果你用code-behind的方式,应该是写在Button的Click事件里,在这里我们将分两个步骤:
首先,我们用行为来代替事件处理
其次,我们用消息(在下一部分讨论)来告诉页面导航到新一页
重新在Blend中打开上一个例子,如果你没有,可以在这里here.下载。
修改MainPage.xaml
删除TextBlock
给Grid的顶部添加一行
添加一个按钮,居中,Content设置为Page2,Name为btnPage2
点击Assets,点击Behaviors,把EventToCommand拖到Button上。释放按钮时, 你会发现EventToCommand 作为Button的一个Child了。在属性面板将其命名为Page2ButtonClicked
EventName还是保留为Click。我们将在code-behind里绑定这个命令,保存文件,切换到VS2010.
创建一个可绑定的行为属性
打开MainViewModel.cs,添加一个RelayCommand类型的属性:
1: public RelayCommand Page2Command
2: {
3: get;
4: private set;
5: }
使用RelayCommand需要添加一个引用:
1: using GalaSoft.MvvmLight.Command;
在MainViewModel的构造函数里,初始化这个属性的值:
1: public MainViewModel()
2: {
3: Page2Command = new RelayCommand( () => GoToPage2() );
这将调用名为GoToPage2的方法,现在创建它:
1: private object GoToPage2()
2: {
3: System.Windows.MessageBox.Show( "Navigate to Page 2!" );
4: return null;
5: }
保存并生成,然后返回Blend,在Page2ButtonClicked的属性窗口中找到杂项-Command,选择绑定,打开绑定窗口,选择Page2Command,点击确定。
运行项目,当点击Page2Button时,弹出来一个对话框。
你做了什么?
你做的是在code-behind里把一个behavior绑定到了属性上。这个属性并不是用值来初始化,而是用一个方法,这个方法在behavior被触发的时候调用。
现在看一下xaml文件里有什么变化,打开MainPage.xaml,查看Button:
1: <Button x:Name="btnPage2" Content="Page2" Margin="152,0,202,147" VerticalAlignment="Bottom" d:LayoutOverrides="Width">
2: <i:Interaction.Triggers>
3: <i:EventTrigger EventName="Click">
4: <GalaSoft_MvvmLight_Command:EventToCommand x:Name="btnPage2Click" Command="{Binding Page2Command, Mode=OneWay}"/>
5: </i:EventTrigger>
6: </i:Interaction.Triggers>
7: </Button>
这样我们实现了在ViewModel里,而不是在code-behind里处理按钮事件。
下一部分我们来看看ViewModel如何发送一个消息给View来进行导航。