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

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

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

这里需要使用带有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;

        }

    }

}

 

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