首页 文章

DataGrid中的WPF组合框

提问于
浏览
-1

这是一个展示我遇到麻烦的行为的例子 . 我有一个datagrid绑定到viewmodel中的可观察记录集合 . 在datagrid中,我有一个DataGridTemplateColumn,它包含一个组合框,该组合框是从viewmodel中的列表中填充的 . 数据网格还包含文本列 . 窗口底部有一些文本框可显示记录内容 .

<Window x:Class="Customer.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Customer"
    Title="MainWindow" Height="350" Width="525">

    <Window.Resources>
        <local:SelectedRowConverter x:Key="selectedRowConverter"/>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="8*"/>
            <RowDefinition Height="3*"/>
        </Grid.RowDefinitions>
        <DataGrid x:Name="dgCustomers" AutoGenerateColumns="False"
                  ItemsSource="{Binding customers}" SelectedItem="{Binding SelectedRow,
                    Converter={StaticResource selectedRowConverter}, Mode=TwoWay}"
                  CanUserAddRows="True" Grid.Row="0" >
            <DataGrid.Columns>
                <DataGridTemplateColumn Width="Auto" Header="Country">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <ComboBox x:Name="cmbCountry" ItemsSource="{Binding DataContext.countries,
                                RelativeSource={RelativeSource AncestorType={x:Type Window}}}"
                                      DisplayMemberPath="name" SelectedValuePath="name" Margin="5"
                                      SelectedItem="{Binding DataContext.SelectedCountry,
                                RelativeSource={RelativeSource AncestorType={x:Type Window}}, Mode=TwoWay,
                                UpdateSourceTrigger=PropertyChanged}" SelectionChanged="cmbCountry_SelectionChanged" />
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
                <DataGridTextColumn Header="Name" Binding="{Binding name}" Width="1*"/>
                <DataGridTextColumn Header="Phone" Binding="{Binding phone}" Width="1*"/>
            </DataGrid.Columns>
        </DataGrid>

        <Grid x:Name="grdDisplay" DataContext="{Binding ElementName=dgCustomers}" Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
            </Grid.ColumnDefinitions>
            <Label Grid.Column="2" Content="Country:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
            <Label Grid.Column="4" Content="Code:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
            <BulletDecorator  Grid.Column="0">
                <BulletDecorator.Bullet>
                    <Label Content="Name:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
                </BulletDecorator.Bullet>
                <TextBox x:Name="txtId" Text="{Binding ElementName=dgCustomers, Path=SelectedItem.name}" Margin="5,5,5,5"/>
            </BulletDecorator>
            <BulletDecorator Grid.Column="1">
                <BulletDecorator.Bullet>
                    <Label Content="Code:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
                </BulletDecorator.Bullet>
                <TextBox x:Name="txtCode" Text="{Binding ElementName=dgCustomers, Path=SelectedItem.countryCode}" Margin="5,5,5,5"/>
            </BulletDecorator>
            <BulletDecorator Grid.Column="2">
                <BulletDecorator.Bullet>
                    <Label  Content="Phone:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
                </BulletDecorator.Bullet>
                <TextBox x:Name="txtPhone" Text="{Binding ElementName=dgCustomers, Path=SelectedItem.phone}" Margin="5,5,5,5"/>
            </BulletDecorator>
        </Grid>
    </Grid>
</Window>

最初没有记录,因此datagrid为空,只显示包含组合框的一行 . 如果用户首先将数据输入到文本列中,则将记录添加到集合中,并且可以将组合框值添加到记录中 . 但是,如果用户首先选择组合框值,则在选择另一列时该值将消失 . 如果首先选择组合框数据,如何将其添加到记录中?

代码隐藏:

public partial class MainWindow : Window
{
    public GridModel gridModel { get; set; }

    public MainWindow()
    {
        InitializeComponent();
        gridModel = new GridModel();
        //dgCustomers.DataContext = gridModel;
        this.DataContext = gridModel;
    }

    private void cmbCountry_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        ComboBox c = sender as ComboBox;
        Debug.Print("ComboBox selection changed, index is " + c.SelectedIndex + ", selected item is " + c.SelectedItem);
    }
}

记录类:

public class Record : ViewModelBase
{
    private string _name;
    public string name
    {
        get { return _name; }
        set
        {
            _name = value;
            OnPropertyChanged("name");
        }
    }

    private string _phone;
    public string phone
    {
        get { return _phone; }
        set
        {
            _phone = value;
            OnPropertyChanged("phone");
        }
    }

    private int _countryCode;
    public int countryCode
    {
        get { return _countryCode; }
        set
        {
            _countryCode = value;
            OnPropertyChanged("countryCode");
        }
    }
}

国家级:

public class Country : ViewModelBase
{
    private string _name;
    public string name
    {
        get { return _name; }
        set
        {
            _name = value;
            OnPropertyChanged("name");
        }
    }

    private int _id;
    public int id
    {
        get { return _id; }
        set
        {
            _id = value;
            OnPropertyChanged("id");
        }
    }

    private int _code;
    public int code
    {
        get { return _code; }
        set
        {
            _code = value;
            OnPropertyChanged("code");
        }
    }

    public override string ToString()
    {
        return _name;
    }
}

GridModel:

public class GridModel : ViewModelBase
{
    public ObservableCollection<Record> customers { get; set; }
    public List<Country> countries { get; set; }
    public GridModel()
    {
        customers = new ObservableCollection<Record>();
        countries = new List<Country> { new Country { id = 1, name = "England", code = 44 }, new Country { id = 2, name = "Germany", code = 49 },
        new Country { id = 3, name = "US", code = 1}, new Country { id = 4, name = "Canada", code = 11 }};
    }

    private Country _selectedCountry;
    public Country SelectedCountry
    {
        get
        {
            return _selectedCountry;
        }
        set
        {
            _selectedCountry = value;
            _selectedRow.countryCode = _selectedCountry.code;
            OnPropertyChanged("SelectedRow");
        }
    }

    private Record _selectedRow;
    public Record SelectedRow
    {
        get
        {
            return _selectedRow;
        }
        set
        {
            _selectedRow = value;
            Debug.Print("Datagrid selection changed"); 
            OnPropertyChanged("SelectedRow");
        }
    }
}

转换器:

class Converters
{
}

public class SelectedRowConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return value;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value is Record)
            return value;
        return new Customer.Record();
    }
}

ViewModelBase:

public class ViewModelBase : INotifyPropertyChanged
{
    public ViewModelBase()
    {

    }

    public event PropertyChangedEventHandler PropertyChanged;

    public void OnPropertyChanged(string name)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(name));
        }
    }
}

谢谢你的帮助!

EDIT 感谢帮助Mark,我'm running the code you provided in your answer below, but I'仍然没有在窗口底部的文本框中获取国家/地区代码 . 我收到这些错误:

System.Windows.Data错误:23:无法将''从'NamedObject'类型转换为'en-US'文化的'CustomersFreezable.RecordViewModel',默认转换为;考虑使用Binding的Converter属性 . NotSupportedException:'System.NotSupportedException:TypeConverter无法从MS.Internal.NamedObject转换 . 在System.ComponentModel.TypeConverter.GetConvertFromException(Object value)处于System.ComponentModel.TypeConverter.ConvertFrom(ITypeDescriptorContext context,CultureInfo culture,Object value)at MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o,Type destinationType,DependencyObject targetElement, CultureInfo culture,Boolean isForward)'System.Windows.Data错误:7:ConvertBack无法转换值''(类型'NamedObject') . BindingExpression:路径= SelectedRow; DataItem ='GridModel'(HashCode = 62992796); target元素是'DataGrid'(Name ='dgCustomers'); target属性为'SelectedItem'(类型'Object')NotSupportedException:'System.NotSupportedException:TypeConverter无法从MS.Internal.NamedObject转换 . 在MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o,Type destinationType,DependencyObject targetElement,CultureInfo culture,Boolean isForward)at MS.Internal.Data.ObjectTargetConverter.ConvertBack(Object o,Type type,Object parameter,CultureInfo culture)at at 'System.Windows.Data.BindingExpression.ConvertBackHelper(IValueConverter converter,Object value,Type sourceType,Object parameter,CultureInfo culture)'Datagrid选择已更改Datagrid选择已更改System.Windows.Data错误:40:BindingExpression路径错误:'countryCode'属性不找到'object'''RecordViewModel'(HashCode = 47081572)' . BindingExpression:路径= SelectedItem.countryCode; DataItem ='DataGrid'(Name ='dgCustomers'); target元素是'TextBox'(Name ='txtCode');目标属性是'Text'(类型'String')System.Windows.Data错误:23:无法将''从类型'NamedObject'转换为'CustomersFreezable.RecordViewModel',为'en-US'文化输入默认转换;考虑使用Binding的Converter属性 . NotSupportedException:'System.NotSupportedException:TypeConverter无法从MS.Internal.NamedObject转换 . 在System.ComponentModel.TypeConverter.GetConvertFromException(Object value)处于System.ComponentModel.TypeConverter.ConvertFrom(ITypeDescriptorContext context,CultureInfo culture,Object value)at MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o,Type destinationType,DependencyObject targetElement, CultureInfo culture,Boolean isForward)'System.Windows.Data错误:7:ConvertBack无法转换值''(类型'NamedObject') . BindingExpression:路径= SelectedRow; DataItem ='GridModel'(HashCode = 62992796); target元素是'DataGrid'(Name ='dgCustomers'); target属性为'SelectedItem'(类型'Object')NotSupportedException:'System.NotSupportedException:TypeConverter无法从MS.Internal.NamedObject转换 . at MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o,Type destinationType,DependencyObject targetElement,CultureInfo culture,Boolean isForward)at MS.Internal.Data.ObjectTargetConverter.ConvertBack(Object o,Type type,Object parameter,CultureInfo)System.Windows.Data.BindingExpression.ConvertBackHelper(IValueConverter转换器,Object值,Type sourceType,Object参数,CultureInfo文化)'Datagrid选择已更改System.Windows.Data错误:40:BindingExpression路径错误:'countryCode'属性不在找到'object'''RecordViewModel'(HashCode = 47081572)' . BindingExpression:路径= SelectedItem.countryCode; DataItem ='DataGrid'(Name ='dgCustomers'); target元素是'TextBox'(Name ='txtCode'); target属性是'Text'(类型'String')

我试图通过更改静态资源来解决BindingExpression路径错误:

<local:BindingProxy x:Key="CountryProxy" Data="{Binding}" />

因此DataGrid的ItemsSource:

ItemsSource="{Binding Source={StaticResource ResourceKey=CountryProxy}, Path=Data.countries}" DisplayMemberPath="name"

和文本框的绑定:

<TextBox x:Name="txtCode" Text="{Binding Path=record.countryCode}" Margin="5,5,5,5"/>

这摆脱了错误40,但我仍然没有看到文本框中的任何内容 . 你能告诉我什么是错的吗?

1 回答

  • 4

    请原谅我诚实,但这段代码有很多问题 .

    首先,与MVVM有一些严重的偏差 . MVVM是一个分层架构......首先是模型,然后是顶部的视图模型,然后是视图模型 . 转换器在技术上是视图的一部分,但如果有的话,它们位于视图的另一侧而不是视图模型 . 您正在做的是使用转换器生成有效应该是您的模型的新记录:

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value is Record)
            return value;
        return new Customer.Record(); <<<<<<<< this here
    }
    

    任何时候你有转换器直接使用非视图类,这是一个很好的迹象表明你的视图模型没有正常工作,它几乎总是导致破坏绑定和错误行为 .

    另一个问题是你的Record类看起来像是模型,因为它有一个国家的整数代码而不是对Country类实例的引用 . 然而,这个类是从ViewModelBase派生出来的,并且会进行属性更改通知 . 此外,Country类型的一个字段(即GridModel中的SelectedCountry)将被所有记录绑定,因此更改国家/地区代码会更改所有记录!

    但是,要回答您的具体问题,问题是DataGrid在检测到其中一个字段已被编辑之前不会创建新记录 . 在这种情况下,您对SelectedRow的绑定不在记录本身中,因此未创建记录并且未传播该值 .

    这是一个固定版本,可以更好地遵守MVVM并修复绑定问题:

    // record model
    public class Record
    {
        public string name {get; set;}
        public string phone { get; set; }
        public int countryCode {get; set;}
    }
    
    // record view model
    public class RecordViewModel : ViewModelBase
    {
        private Record record = new Record();
    
        public string name
        {
            get { return record.name; }
            set
            {
                record.name = value;
                RaisePropertyChanged("name");
            }
        }
    
        public string phone
        {
            get { return record.phone; }
            set
            {
                record.phone = value;
                RaisePropertyChanged("phone");
            }
        }
    
        private Country _country;
        public Country country
        {
            get { return _country; }
            set
            {
                _country = value;
                record.countryCode = value.code;
                RaisePropertyChanged("country");
            }
        }
    
    }
    
    public class Country : ViewModelBase
    {
        private string _name;
        public string name
        {
            get { return _name; }
            set
            {
                _name = value;
                RaisePropertyChanged("name");
            }
        }
    
        private int _id;
        public int id
        {
            get { return _id; }
            set
            {
                _id = value;
                RaisePropertyChanged("id");
            }
        }
    
        private int _code;
        public int code
        {
            get { return _code; }
            set
            {
                _code = value;
                RaisePropertyChanged("code");
            }
        }
    
        public override string ToString()
        {
            return _name;
        }
    }
    
    public class GridModel : ViewModelBase
    {
        public ObservableCollection<RecordViewModel> customers { get; set; }
        public List<Country> countries { get; set; }
    
        public GridModel()
        {
            customers = new ObservableCollection<RecordViewModel>();
            countries = new List<Country> { new Country { id = 1, name = "England", code = 44 }, new Country { id = 2, name = "Germany", code = 49 },
        new Country { id = 3, name = "US", code = 1}, new Country { id = 4, name = "Canada", code = 11 }};
        }
    
        private RecordViewModel _selectedRow;
        public RecordViewModel SelectedRow
        {
            get
            {
                return _selectedRow;
            }
            set
            {
                _selectedRow = value;
                Debug.Print("Datagrid selection changed");
                RaisePropertyChanged("SelectedRow");
            }
        }
    }
    
    // this is needed for when you need to bind something that isn't part of the visual tree (i.e. your combobox dropdowns)
    // see http://www.thomaslevesque.com/2011/03/21/wpf-how-to-bind-to-data-when-the-datacontext-is-not-inherited/ for details
    public class BindingProxy : Freezable
    {
        #region Overrides of Freezable
    
        protected override Freezable CreateInstanceCore()
        {
            return new BindingProxy();
        }
    
        #endregion
    
        public object Data
        {
            get { return (object)GetValue(DataProperty); }
            set { SetValue(DataProperty, value); }
        }
    
        // Using a DependencyProperty as the backing store for Data.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty DataProperty =
            DependencyProperty.Register("Data", typeof(object), typeof(BindingProxy), new UIPropertyMetadata(null));
    }
    

    和XAML:

    <Window.Resources>
        <local:BindingProxy x:Key="CountryProxy" Data="{Binding Path=countries}" />
    </Window.Resources>
    
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="8*"/>
            <RowDefinition Height="3*"/>
        </Grid.RowDefinitions>
        <DataGrid x:Name="dgCustomers" AutoGenerateColumns="False"
              ItemsSource="{Binding customers}" SelectedItem="{Binding SelectedRow, Mode=TwoWay}"
              CanUserAddRows="True" Grid.Row="0" >
            <DataGrid.Columns>
                <DataGridComboBoxColumn Header="Country"
                    ItemsSource="{Binding Source={StaticResource ResourceKey=CountryProxy}, Path=Data}" DisplayMemberPath="name"
                    SelectedItemBinding="{Binding country, UpdateSourceTrigger=PropertyChanged}" /> 
                <DataGridTextColumn Header="Name" Binding="{Binding name, UpdateSourceTrigger=PropertyChanged}" Width="1*" />
                <DataGridTextColumn Header="Phone" Binding="{Binding phone, UpdateSourceTrigger=PropertyChanged}" Width="1*"/>
            </DataGrid.Columns>
        </DataGrid>
    
        <Grid x:Name="grdDisplay" Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="1*"/>
            </Grid.ColumnDefinitions>
            <Label Grid.Column="2" Content="Country:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
            <Label Grid.Column="4" Content="Code:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
            <BulletDecorator  Grid.Column="0">
                <BulletDecorator.Bullet>
                    <Label Content="Name:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
                </BulletDecorator.Bullet>
                <TextBox x:Name="txtId" Text="{Binding Path=SelectedRow.name}" Margin="5,5,5,5"/>
            </BulletDecorator>
            <BulletDecorator Grid.Column="1">
                <BulletDecorator.Bullet>
                    <Label Content="Code:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
                </BulletDecorator.Bullet>
                <TextBox x:Name="txtCode" Text="{Binding Path=SelectedRow.country.code}" Margin="5,5,5,5"/>
            </BulletDecorator>
            <BulletDecorator Grid.Column="2">
                <BulletDecorator.Bullet>
                    <Label  Content="Phone:" VerticalAlignment="Center" HorizontalAlignment="Right"/>
                </BulletDecorator.Bullet>
                <TextBox x:Name="txtPhone" Text="{Binding Path=SelectedRow.phone}" Margin="5,5,5,5"/>
            </BulletDecorator>
        </Grid>
    </Grid>
    

    忘记转换器,你不需要它 . 此代码确实引入的一个问题是您现在需要单击组合框两次:首先选择行然后再次编辑它 . 但网络周围有很多地方显示如何解决这个问题,所以我会留给你 .

相关问题