ComboBoxes共享Observable集合不断打破

Question

我有四个组合框经历了一个奇怪的怪癖。它的我很难解释究竟怎么回事...所以我把它放在一个视频：

https://www.youtube.com/watch?v=OuB-kSGMMSo

<ComboBox x:Name="images1" Grid.Row="0" Grid.Column="0" Margin="3"/> 
<ComboBox x:Name="images2" Grid.Row="0" Grid.Column="1" Margin="3"/> 
<ComboBox x:Name="images3" Grid.Row="0" Grid.Column="2" Margin="3"/> 
<ComboBox x:Name="images4" Grid.Row="0" Grid.Column="3" Margin="3"/> 

代码背后

public ObservableCollection<ComboBoxItem> images = 
    new ObservableCollection<ComboBoxItem>(); 

public ImageSelect(MainWindow mainWindow, string tab_name) 
{ 
    InitializeComponent(); 

    Generic.ImportImages(tab_name, images1, images); 

    images2.ItemsSource = images; 
    images3.ItemsSource = images; 
    images4.ItemsSource = images; 
} 

我班

public static void ImportImages(string tabID, ComboBox combo, ObservableCollection<ComboBoxItem> list) 
{ 
    try 
    { 
     string root = System.IO.Path.GetDirectoryName(System.Reflection.Assembly.GetExecutingAssembly().Location); 
     var files = Directory.GetFiles(Path.Combine(root, "input\\" + tabID), "*.png"); 

     foreach (var file in files) 
     { 
      string[] paths = file.Split('\\'); 
      ComboBoxItem item = new ComboBoxItem(); 
      item.Tag = paths.Last(); 

      var stack = new StackPanel() { Orientation = Orientation.Horizontal }; 
      stack.Children.Add(new Image() { Source = new BitmapImage(new Uri(file, UriKind.Absolute)), Height = 44 }); 
      stack.Children.Add(new Label() { Content = paths.Last(), VerticalContentAlignment = VerticalAlignment.Center }); 
      item.Content = stack; 

      list.Add(item); 
     } 
    } 
    catch (Exception) { } 

    combo.ItemsSource = list; 
} 

Answer 1

基本的WPF示例。请看MVVM模式，WPF数据绑定和数据模板。

视图定义

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

<Window.Resources> 

    <DataTemplate x:Key="ComboBoxItemTemplate"> 
     <StackPanel Orientation="Horizontal"> 
      <Image Height="44" Source="{Binding ImageUrl}"/> 
      <Label Content="{Binding Name}" VerticalAlignment="Center"/> 
     </StackPanel> 
    </DataTemplate> 

</Window.Resources> 

<StackPanel Orientation="Horizontal"> 

    <ComboBox x:Name="cbOne" ItemTemplate="{StaticResource ComboBoxItemTemplate}"/> 
    <ComboBox x:Name="cbTwo" ItemTemplate="{StaticResource ComboBoxItemTemplate}"/> 
    <ComboBox x:Name="cbThree" ItemTemplate="{StaticResource ComboBoxItemTemplate}"/> 
    <ComboBox x:Name="cbFour" ItemTemplate="{StaticResource ComboBoxItemTemplate}"/> 

</StackPanel> 

代码隐藏

public partial class MainWindow : Window 
{ 
    private ObservableCollection<ImageInfo> _images; 

    public MainWindow() 
    { 
     InitializeComponent(); 

     _images = new ObservableCollection<ImageInfo>(GetImages()); 

     cbOne.ItemsSource = _images; 
     cbTwo.ItemsSource = _images; 
     cbThree.ItemsSource = _images; 
     cbFour.ItemsSource = _images; 
    } 

    public IEnumerable<ImageInfo> GetImages() 
    { 
     const string path = @"C:\_D\_Log\"; 

     var items = from x in Directory.GetFiles(path, "*.png") 
        select new ImageInfo 
        { 
         ImageUrl = x, 
         Name = System.IO.Path.GetFileName(x) 
        }; 
     return items; 
    } 
} 

public class ImageInfo 
{ 
    public string ImageUrl { get; set; } 
    public string Name { get; set; } 
}