c# - View 中的属性必须与 ViewModel 中的相同属性匹配

Question

我正在创建一个用户控件(一个只接受整数的文本框)。该控件必须具有属性来指定最大/最小值以及是否允许负值等)。我正在使用 MVVM，在我看来我有公共(public)属性，例如

const string EXAMPLE = "Example";

string example;

public string Example
{
    get { return example; }
    set
    {
        if (value == example) return;
        example = value;
        OnPropertyChanged(EXAMPLE);
    }
}

这些属性在我的 View 中，以便使用该控件的人能够轻松地设置它们。在我的 ViewModel 中，我有一个相同的属性，我需要将这些属性绑定(bind)在一起，以便它们和它们的支持字段始终具有相同的值。我也讨厌代码重复。

老实说，整个方法感觉不对，通常这是一个很好的迹象，表明我是从错误的方向来处理整个事情，或者误解了一些基本的东西。

我以前使用过 WPF，但这是自定义控件的第一次尝试。

Answer 1

我要确定的第一件事是您确实在尝试制作 CustomControl 而不是 UserControl。我相信这个question基本上和你的一样，只是措辞不同。

UserControl 比 CustomControl 更适合 MVVM 模式，因为您将有一个 .xaml(和 .xaml.cs)文件以及一个 .cs 文件作为 ViewModel。另一方面，CustomControl 永远不会用 MVVM 完成，因为视觉外观( View )是通过 ControlTemplate 定义和覆盖的。

既然您说过您有一个 View 和 View 模型，那么让我们考虑一下您将如何使用您的文本框实现您想要的行为。您的文本框将必须验证并拒绝您想要的值范围之外的用户输入。这意味着您的 View 代码隐藏必须具有属性和逻辑来控制 View 中定义的文本框的输入值的限制。你已经在这里违反了 MVVM。

当您说您有一个 View 时，我认为您正在编写一个 UserControl。但是您的要求(文本框的自定义行为)表明您确实需要一个 CustomControl，对此您不使用 MVVM。

如果您同意您需要一个 CustomControl，这里有一个快速而肮脏的例子:

 public class RestrictedTextBox : TextBox
 {
    public static readonly DependencyProperty MaxValueProperty = DependencyProperty.Register("MaxValue", typeof(int), typeof(RestrictedTextBox), new PropertyMetadata(int.MaxValue));

    public RestrictedTextBox()
    {
        PreviewTextInput += RestrictedTextBox_PreviewTextInput;
    }

    public int MaxValue
    {
        get
        {
            return (int)GetValue(MaxValueProperty);
        }
        set
        {
            SetValue(MaxValueProperty, value);
        }
    }


    private void RestrictedTextBox_PreviewTextInput(object sender, TextCompositionEventArgs e)
    {
        int inputDigits;
        RestrictedTextBox box = sender as RestrictedTextBox;
        if (box != null)
        {

            if (!e.Text.All(Char.IsDigit))
            {
                // Stops the text from being handled
                e.Handled = true;
            }
            else if (int.TryParse(box.Text + e.Text, out inputDigits))
            {
                if (inputDigits > MaxValue)
                    e.Handled = true;
            }
        }
    }
}

XAML 用法:

    <local:RestrictedTextBox MaxValue="100"></local:RestrictedTextBox>