ObservableCollection 绑定条件

Question

我有带有 MarketPrices 的 Observable 集合，这个 observable 集合我已绑定到 ItemsControl，如下所示。

1) 现在我不想显示 Observable Collection 中的所有 Items ，只想显示用户单击 Add 并选择 Pair (GBPJPY, USDGBP..) 需要在 Items Control 中显示的项目。

2) 如果用户将 Comobobox 中的项目从 GBPJPY 更改为 USDGBP ，则 GBPJPY 的价格（DataTemplate）需要更新 USDGBP。

我怎样才能同时满足这两个条件。请注意，下面的代码没有实时更新，但在项目中我也有实时价格更新，因此可以观察到价格变化的集合更新。

到目前为止的代码

 public class PriceModel : INotifyPropertyChanged
    {
        private double _askPrice;
        private double _offerPrice;
        private string _selectedPair;

        public PriceModel()
        {
            Pairs = new ObservableCollection<string> {"GBPUSD", "GBPEUR", "USDGBP", "GBPJPY"};
        }

        public double AskPrice
        {
            get { return _askPrice; }
            set
            {
                _askPrice = value;
                OnPropertyChanged("AskPrice");
            }
        }

        public double OfferPrice
        {
            get { return _offerPrice; }
            set
            {
                _offerPrice = value;
                OnPropertyChanged("OfferPrice");
            }
        }

        public string SelectedPair
        {
            get { return _selectedPair; }
            set
            {
                _selectedPair = value;
                OnPropertyChanged(SelectedPair);
            }
        }

        public ObservableCollection<string> Pairs { get; set; }
        public event PropertyChangedEventHandler PropertyChanged;

        [NotifyPropertyChangedInvocator]
        protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }



   public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            DataContext = this;

            MarketPrices = new ObservableCollection<PriceModel>
            {
                new PriceModel {AskPrice = 1.60345, OfferPrice = 1.60335, SelectedPair = "GBPUSD"},
                new PriceModel {AskPrice = 1.71345, OfferPrice = 1.71335, SelectedPair = "GBPEUR"},
                new PriceModel {AskPrice = 1.23345, OfferPrice = 1.23335, SelectedPair = "USDGBP"},
                new PriceModel {AskPrice = 1.34345, OfferPrice = 1.34335, SelectedPair = "GBPJPY"}
            };
        }

        public ObservableCollection<PriceModel> MarketPrices { get; set; } 
    }

XAML

 <ScrollViewer VerticalScrollBarVisibility="Auto">
        <ItemsControl ItemsSource="{Binding MarketPrices}">
            <ItemsControl.ItemContainerStyle>
                <Style>
                    <Setter Property="FrameworkElement.Margin" Value="5" />
                </Style>
            </ItemsControl.ItemContainerStyle>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <WrapPanel AllowDrop="True" ClipToBounds="True">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition />
                                <RowDefinition />
                            </Grid.RowDefinitions>
                            <ComboBox ItemsSource="{Binding Pairs}" SelectedItem="{Binding SelectedPair}" />
                            <Grid Grid.Row="1">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition />
                                    <ColumnDefinition />
                                </Grid.ColumnDefinitions>
                                <StackPanel Grid.Column="0" Orientation="Horizontal">
                                    <TextBlock Margin="2" Text="Ask Price" />
                                    <TextBlock Margin="2" Text="{Binding AskPrice}" />
                                </StackPanel>
                                <StackPanel Grid.Column="1" Orientation="Horizontal">
                                    <TextBlock Margin="2" Text="Offer Price" />
                                    <TextBlock Margin="2" Text="{Binding OfferPrice}" />
                                </StackPanel>
                            </Grid>
                        </Grid>
                    </WrapPanel>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </ScrollViewer>

Answer 1

如果我正确理解您的问题，您想在 ComboBox 中显示配对列表以及仅显示选定配对而不是所有配对的详细信息？

如果是这样的话，代码有几个问题。

价格模型

您不需要 PriceModel 类中所有可用对的集合。此外，您不需要此类中的 SelectedPair 属性，可能您的意图是指示配对的名称，您可以将 PriceModel 更新为：

public class PriceModel : INotifyPropertyChanged
{
    private double _askPrice;
    private double _offerPrice;
    private string _pair;

    public PriceModel(string pair)
    {
        _pair = pair;
    }

    public string Pair
    {
        get { return _pair; }
    }

    public double AskPrice
    {
        get { return _askPrice; }
        set
        {
            _askPrice = value;
            OnPropertyChanged("AskPrice");
        }
    }

    public double OfferPrice
    {
        get { return _offerPrice; }
        set
        {
            _offerPrice = value;
            OnPropertyChanged("OfferPrice");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
    }
}

MainWindow.xaml.cs

您有一个名为 MarketPrices 的属性来保存 Pair 的集合，但没有属性来保存 Selected 对。添加一个名为SelectedPair 类型为PriceModel 的属性。更新后的代码如下：

public partial class MainWindow : Window, INotifyPropertyChanged
{
    private PriceModel _selectedPair;

    public MainWindow()
    {
        InitializeComponent();
        DataContext = this;

        MarketPrices = new ObservableCollection<PriceModel>
        {
            new PriceModel("GBPUSD") {AskPrice = 1.60345, OfferPrice = 1.60335, },
            new PriceModel("GBPEUR") {AskPrice = 1.71345, OfferPrice = 1.71335, },
            new PriceModel("USDGBP") {AskPrice = 1.23345, OfferPrice = 1.23335, },
            new PriceModel("GBPJPY") {AskPrice = 1.34345, OfferPrice = 1.34335, }
        };
    }

    public ObservableCollection<PriceModel> MarketPrices { get; set; }

    public PriceModel SelectedPair
    {
        get { return _selectedPair; }
        set
        {
            _selectedPair = value;
            OnPropertyChanged("SelectedPair");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
    }
}

MainWindow.xaml

您可以只使用 ComboBox 显示可用对的列表并更新 TextBox 的绑定以引用 SelectedPair。

更新 XAML 如下所示：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
    <ComboBox ItemsSource="{Binding Pairs}" SelectedItem="{Binding SelectedPair}" />
    <Grid Grid.Row="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <StackPanel Grid.Column="0" Orientation="Horizontal">
            <TextBlock Margin="2" Text="Ask Price" />
            <TextBlock Margin="2" Text="{Binding SelectedPair.AskPrice}" />
        </StackPanel>
        <StackPanel Grid.Column="1" Orientation="Horizontal">
            <TextBlock Margin="2" Text="Offer Price" />
            <TextBlock Margin="2" Text="{Binding SelectedPair.OfferPrice}" />
        </StackPanel>
    </Grid>
</Grid>

样本输出