c# - 使用 MVVM 模式时如何实现工具栏？

Question

我正在使用串口创建一个项目。我正在练习使用 MVVM 模型。我需要设置串口，所以我使用了工具栏。

这是我的模型:

public class Port : INotifyPropertyChanged, IDataErrorInfo
{
    private SerialPort _serialPort;

    public Port()
    {
        _serialPort = new SerialPort();
    }

    public string PortName
    {
        get { return _serialPort.PortName; }
        set
        {
            _serialPort.PortName = value;
            OnPropertyChanged("PortName");
        }
    }

    public int BaudRate
    {
        get { return _serialPort.BaudRate; }
        set
        {
            _serialPort.BaudRate = value;
            OnPropertyChanged("BaudRate");
        }
    }

    public Parity Parity
    {
        get { return _serialPort.Parity; }
        set
        {
            _serialPort.Parity = value;
            OnPropertyChanged("Parity");
        }
    }

    public int DataBits
    {
        get { return _serialPort.DataBits; }
        set
        {
            _serialPort.DataBits = value;
            OnPropertyChanged("PortDataBits");
        }
    }

    public StopBits StopBits
    {
        get { return _serialPort.StopBits; }
        set
        {
            _serialPort.StopBits = value;
            OnPropertyChanged("PortStopBits");
        }
    }

    public Handshake Handshake
    {
        get { return _serialPort.Handshake; }
        set
        {
            _serialPort.Handshake = value;
            OnPropertyChanged("PortHandshake");
        }
    }

    public string[] AvailablePortNames
    {
        get { return SerialPort.GetPortNames(); }
    }

    #region IDataErrorInfo Members

    string IDataErrorInfo.Error { get { return null; } }

    string IDataErrorInfo.this[string propertyName]
    {
        get { return this.GetValidationError(propertyName); }
    }

    #endregion // IDataErrorInfo Members

    #region Validation

    /// <summary>
    /// Returns true if this object has no validation errors.
    /// </summary>
    public bool IsValid
    {
        get
        {
            foreach (string property in ValidatedProperties)
                if (GetValidationError(property) != null)
                    return false;

            return true;
        }
    }

    static readonly string[] ValidatedProperties = 
    { 
        "PortName",
    };

    string GetValidationError(string propertyName)
    {
        if (Array.IndexOf(ValidatedProperties, propertyName) < 0)
            return null;

        string error = null;

        switch (propertyName)
        {
            case "PortName":
                ValidatePortName();
                break;

            default:
                Debug.Fail("Unexpected property being validated on Port: " + propertyName);
                break;
        }

        return error;
    }

    string ValidatePortName()
    {
        if (IsStringMissing(this.PortName))
        {
            return Strings.Port_Error_MissingName;
        }
        return null;
    }

    #endregion // Validation

    #region INotifyPropertyChanged Members

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged(string propertyName)
    {
        this.VerifyPropertyName(propertyName);

        PropertyChangedEventHandler handler = this.PropertyChanged;
        if (handler != null)
        {
            var e = new PropertyChangedEventArgs(propertyName);
            handler(this, e);
        }
    }

    #endregion // INotifyPropertyChanged Members
}

然后，我有一个 SetupPortView:

<UserControl 
    x:Class="PortChat.View.SetupPortView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:vw="clr-namespace:PortChat.View"
>
<ToolBar>
    <Label Content="COM Port:"
      Target="{Binding ElementName=AvailablePortsComboBox}" 
    />
    <ComboBox 
      x:Name="AvailablePortsComboBox"
      Width="80"
      ItemsSource="{Binding Path=AvailablePortNames, Mode=OneTime}"
      SelectedItem="{Binding Path=PortName, ValidatesOnDataErrors=True}"
      Validation.ErrorTemplate="{x:Null}"
      />
      ...

我的问题是，当用户按下 CONNECT 按钮时，使用该设置创建端口。我不确定我是否正在创建正确的模型。在我的 MainWindowViewModel 类中，我创建了一个 Port 变量，但我猜这是不正确的。

我如何改进此代码并使用 MVVM 创建端口对象(我不知道在使用文本框的工具栏中使用 MVVM)？

Answer 1

我会更改 ComboBox 的绑定(bind)。我会将 ComboBox 绑定(bind)到端口集合(不是名称)，并将 ComboBox 的 SelectedItem 绑定(bind)到 ViewModel 上的 SelectedPort 属性。

这样您就知道用户选择了哪个端口，而无需查询集合以获取正确的端口。

当您希望允许用户创建/配置新端口时，只需将一个空的/新的端口对象添加到集合中并将 SelectedPort 设置为这个新添加的项目即可。