用户界面与MVVM的交互

I did some googling and didn't find an answer to this puzzle.

我做了一些谷歌搜索,并没有找到这个难题的答案。

Provided you have the following:

如果您有以下内容:

MySuperView
MySuperViewModel

MySuperView has two textboxes both bound to string properties on the ViewModel and your using a DelegateCommand to bind your 'Save' button to the ViewModel using syntax such as:

MySuperView有两个文本框,它们都绑定到ViewModel上的字符串属性,并使用DelegateCommand将“保存”按钮绑定到ViewModel,使用如下语法:

ViewModel:

this.SaveOrderCommand = new DelegateCommand<object>(this.Save, this.CanSave);

View:

Command="{Binding SaveOrderCommand}"

How do you deal with UI Elements to make the User Interaction more pleasing. For example, lets say some lower level failure occurring during the save action of the DelegateCommand and you would like to trigger the tooltip of one of the TextBoxs. How would this typically occur?

如何处理UI元素以使用户交互更令人满意。例如,假设在DelegateCommand的保存操作期间发生了一些较低级别的故障,并且您希望触发其中一个TextBox的工具提示。这通常会如何发生?

I'd like to stick with as clean code-behind as possible but I am not adverse to putting UI specific code in there.

我想尽可能坚持干净的代码隐藏,但我并不反对将特定于UI的代码放在那里。

3 个解决方案

#1

I would recommend that your ViewModel implement IDataErrorInfo so you can take advantage of validation stuff in WPF. You don't need to wait until someone clicks the save button, once the textbox gets updated it will be validated.

我建议您的ViewModel实现IDataErrorInfo,以便您可以利用WPF中的验证内容。您无需等到有人点击保存按钮,一旦文本框得到更新,它将被验证。

public string this[ColumnName]
{
  if (Column == "TextProperty")
  {
    if(!ValidateTextProperty())
      return "TextProperty is invalid";
  }
}

void Save(object param)
{
  if (CanSave)
  {
     if (string.IsNullOrEmpty(this["TextProperty"])
     {
        //Add Save code here
     }
  }
}

In your View:

在您的视图中:

    <TextBox Text={Binding TextProperty, ValidateOnDataErrors="true",
 UpdateSourceTrigger=PropertyChanged}/>

This will put a red box around the textbox and you can add a validation error template to the textbox style to add a tooltip see here

这将在文本框周围放置一个红色框,您可以在文本框样式中添加验证错误模板以添加工具提示,请参见此处

#2

To show exceptions in a tooltip, I would add a property to the ViewModel that exposes the error message as a string, and bind that to your TextBox's ToolTip. Then in your Save method, you would start by setting that property to the empty string, and then doing all the real work inside a try..catch that, if an exception occurs, pushes the exception message into that property, so it automatically shows up in the ToolTip.

要在工具提示中显示异常,我会向ViewModel添加一个属性,该属性将错误消息公开为字符串,并将其绑定到TextBox的工具提示。然后在Save方法中,首先将该属性设置为空字符串,然后在try..catch中执行所有实际工作,如果发生异常,则将异常消息推送到该属性中,以便自动显示在工具提示中。

You would need to provide change notification for your property, either by making it a DependencyProperty or by using INotifyPropertyChanged.

您需要为您的属性提供更改通知,方法是将其设置为DependencyProperty或使用INotifyPropertyChanged。

#3

Basically, you would want a create properties for your view to observe (usually through triggers) that would update your UI depending on what is happening in your code execution.

基本上,您希望视图的创建属性能够观察(通常通过触发器),这将根据代码执行中发生的情况更新UI。

#1