关于使用MVVM模式在WPF的DataGrid控件中实现ComboBox编辑列

最近在做一个组态软件的项目,有一个需求需要在建立IO设备变量的时候选择变量的类型等。

建立IO变量的界面是一个DataGrid实现的,可以一行一行的新建变量,如下如所示:

关于使用MVVM模式在WPF的DataGrid控件中实现ComboBox编辑列

这里需要使用带有ComboBox控件的列,如何实现呢?

我首先想到的是使用DataGridComboBoxColumn来实现,可是在绑定数据的时候出现了问题,数据怎么也绑定不上。后来经过多方查证,发现原来DataGridComboBoxColumn对数据源有限制,只能是一下3中情况之一:

1、静态资源。

2、x:静态代码实体。

3、ComboBoxItem类型的内联集合。

基于扩展性、代码规范等情况考虑,这三种方案都被否决了。

然后就想到使用DataGridTemplateColumn来实现。

xaml代码:

<DataGrid ItemsSource="{Binding Model.IoVariables}"
AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTemplateColumn Header="类型">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding VariableType}"></TextBlock>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
<DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<ComboBox SelectedItem="{Binding VariableType}" ItemsSource="{Binding DataContext.Model.VariableTypes,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=DataGrid}}"></ComboBox>
</DataTemplate>
</DataGridTemplateColumn.CellEditingTemplate>
</DataGridTemplateColumn>
<DataGridTextColumn Header="变量名" Binding="{Binding VariableName}"></DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>

这里需要注意的一点是ComboBox的ItemsSource的绑定方式,在《关于WPF中ItemsControl系列控件中Item不能继承父级的DataContext的解决办法》一文中解释了这种绑定方式。

ViewModel代码:

using GalaSoft.MvvmLight;
using GalaSoft.MvvmLight.Command;
using WpfApplication1.Models; namespace WpfApplication1.ViewModels
{
public class IOVariableViewModel : ViewModelBase
{
public IOVariableModel Model { get; set; } public IOVariableViewModel()
{
Model = new IOVariableModel(); Model.TestCommand = new RelayCommand(TestCommandHandler); Model.VariableTypes.Add("整型");
Model.VariableTypes.Add("实型");
Model.VariableTypes.Add("字符串");
}
}

Model代码

using System.Collections.ObjectModel;
using GalaSoft.MvvmLight;
using GalaSoft.MvvmLight.Command; namespace WpfApplication1.Models
{
public class IOVariableModel : ViewModelBase
{
private ObservableCollection<IOVariable> _ioVariables; public ObservableCollection<IOVariable> IoVariables
{
get
{
return _ioVariables;
}
set
{
_ioVariables = value;
RaisePropertyChanged(() => IoVariables);
}
} private ObservableCollection<string> _variableTypes; public ObservableCollection<string> VariableTypes
{
get
{
return _variableTypes;
}
set
{
_variableTypes = value;
RaisePropertyChanged(() => VariableTypes);
}
} public RelayCommand TestCommand { get; set; } public IOVariableModel()
{
VariableTypes = new ObservableCollection<string>();
IoVariables = new ObservableCollection<IOVariable>();
}
}
}

IOVariable.cs的代码

namespace WpfApplication1.Models
{
public class IOVariable
{
public string VariableType
{
get;
set;
} public string VariableName
{
get;
set;
}
}
}

关于本文的源码:点击下载

上一篇:Unity长连接


下一篇:Java中删除第一个集合中以某某开头的元素,删除第二个集合中以某某结尾的元素,并合并成一个集合