欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

WPF ComboBox

程序员文章站 2022-06-07 18:36:00
...

本文主要探讨ComboBox的数据源设置、选中数据的绑定(SelectedItem和SelectedValue用法)的问题

绑定数据源 & 设置显示路径

<ComboBox ItemsSource="{Binding Fruits}" DisplayMemberPath="Name" ></ComboBox>

ComboBox单项的数据结构为FruitViewModel

public class FruitViewModel: INotifyPropertyChanged
{
    private long id;
    public long Id
    {
        get { return id; }
        set
        {
            if (id != value)
            {
                id = value;
                NotifyPropertyChanged(nameof(Id));
            }
        }
    }

    private string name;

    public string Name
    {
        get { return name; }
        set
        {
            if (name != value)
            {
                name = value;
                NotifyPropertyChanged(nameof(Name));
            }
        }
    }

    #region INotifyPropertyChanged Members

    /// <summary>
    /// Need to implement this interface in order to get data binding
    /// to work properly.
    /// </summary>
    /// <param name="propertyName"></param>
    private void NotifyPropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    #endregion
}

vm如下

public class UseComboBoxViewModel
{
    public ObservableCollection<FruitViewModel> Fruits { get; set; }
    public FruitViewModel SelectFruit { get; set; }
    public FruitViewModel SelectValueFruit { get; set; }
    public string SelectValueFruitName { get; set; }
}

后端设置数据源

UseComboBoxViewModel vm { get; set; }

vm = new UseComboBoxViewModel() { Fruits = new ObservableCollection<FruitViewModel>() };
vm.Fruits.Add(new FruitViewModel() { Id = 1, Name = "Apple" });
vm.Fruits.Add(new FruitViewModel() { Id = 2, Name = "Pear" });
vm.Fruits.Add(new FruitViewModel() { Id = 3, Name = "Banana" });
DataContext = vm;

绑定SelectedItem获得选中项

SelectedItem与数据源的SelectFruit双向绑定

<ComboBox Name="comboBox" SelectedItem="{Binding SelectFruit,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"></ComboBox>

查看绑定情况,comboBox的SelectedItem和SelectFruit一致

<Label Content="SelectedItem Bind Data:"></Label>
<Label Content="{Binding SelectFruit,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>
<Label Content="SelectedItem Bind Data(.Name):"></Label>
<Label Content="{Binding SelectFruit.Name,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>
<Label Content="Select Item:"></Label>
<Label Content="{Binding ElementName=comboBox,Path=SelectedItem,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>
<Label Content="Select Item(.Name):"></Label>
<Label Content="{Binding ElementName=comboBox,Path=SelectedItem.Name,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>

SelectedValue和SelectedValuePath

1.在不设置SelectedValuePath时,SelectedValue和SelectedItem等效

<ComboBox Name="comboBox" SelectedValue="{Binding SelectValueFruit,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"></ComboBox>

查看绑定情况,此时SelectedValue绑定对象是SelectValueFruit(FruitViewModel类)

<Label Content="SelectedValue Bind Data:"></Label>
<Label Content="{Binding SelectValueFruit,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>
<Label Content="SelectedValue Bind Data(.Name):"></Label>
<Label Content="{Binding SelectValueFruit.Name,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>
<Label Content="Select Value:"></Label>
<Label Content="{Binding ElementName=comboBox,Path=SelectedValue, Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>
<Label Content="Select Value(.Name):"></Label>
<Label Content="{Binding ElementName=comboBox,Path=SelectedValue.Name, Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>

2.设置SelectedValuePath,则SelectedValue根据路径绑定对象

<ComboBox Name="comboBox" SelectedValuePath="Name" SelectedValue="{Binding SelectValueFruitName,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"></ComboBox>

查看绑定情况,此时SelectedValue绑定对象是SelectValueFruitName(Name字符串)

<Label Content="SelectedValue Bind Data:"></Label>
<Label Content="{Binding SelectValueFruitName,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>
<Label Content="Select Value:"></Label>
<Label Content="{Binding ElementName=comboBox,Path=SelectedValue, Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"></Label>

示例代码

UseComboBox

参考资料

Step by Step WPF Data Binding with Comboboxes
WPF之SelectedValue与SelectedValuePath
ComboBox.SelectedItem 属性
ListControl.SelectedValue 属性

相关标签: .NET WPF