带图像的WPF ComboBox

时间:2013-08-28 14:46:38

标签: c# wpf combobox

我试图用图像填充组合。它被定义为:

<ComboBox SelectedItem="{Binding SelectedLangComboItem}"
          ItemsSource="{Binding Languages}">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <Image Source="{Binding Image}" />
                <TextBlock Text="{Binding Label}" />
            </StackPanel>
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

项目是LanguageItem类:

public class LanguageItem
{
  public System.Drawing.Bitmap Image { get; set; }
  public string Label { get; set; }
  public string Culture { get; set; }

  public LanguageItem(System.Drawing.Bitmap image, string label, string culture)
  {
    Image = image;
    Label = label;
    Culture = culture;
  }
}

现在,在我的ViewModel c中,我做了:

  _Languages = new ObservableCollection<LanguageItem>();

  System.Reflection.Assembly app = System.Reflection.Assembly.GetExecutingAssembly();
  System.IO.Stream file;
  file = app.GetManifestResourceStream("MyNamespace.Images.FLAG1.gif");
  _Languages.Add(new LanguageItem(new Bitmap(file), "ITALIAN", "it-IT"));
  file = app.GetManifestResourceStream("MyNamespace.Images.FLAG2.gif");
  _Languages.Add(new LanguageItem(new Bitmap(file), "ENGLISH", "en-EN"));

  this.SelectedLangItem = _Languages[0];

图像是嵌入的资源。我有两个问题:

  1. 不显示图像;
  2. 未选择项目,SelectedLangItem为:

    public LanguageItem SelectedLangItem     {       get {return _SelectedLangItem; }       组       {         if(_SelectedLangItem == value)           返回;

        _SelectedLangItem = value;
        this.RaisePropertyChanged("SelectedLangItem");
      }
    }
    

3 个答案:

答案 0 :(得分:4)

您的问题是您尝试将Image绑定到Image.Source属性ImageSource

最简单的解决方案是将实际图像文件添加到文件夹中,并将类中的Image属性更改为以这种格式保存图像文件路径的字符串:

/ApplicationName;component/ImageFolderName/ImageName.png

然后,您可以正确地将此字符串(框架将转换为ImageSource对象)绑定到Image.Source中的DataTemplate属性。

答案 1 :(得分:3)

使用

new BitmapImage(new Uri("MyNamespace.Images.FLAG1.gif", UriKind.Relative));

因为它必须实现ImageSource

关于未选中:如果您没有错误输入,则在xaml SelectedLangComboItem中,属性名称为“SelectedLangItem”。

CODE:

this.RaisePropertyChanged("SelectedLangItem");

XAML:

<ComboBox SelectedItem="{Binding SelectedLangComboItem}"

答案 2 :(得分:0)

尝试以下xaml代码并将图像列表绑定到组合框...

<Window.Resources>
        <DataTemplate x:Key="cmbTemplate">
            <WrapPanel Margin="0 5 0 5" Height="80">
                <Image Width="65" Height="65" Stretch="Fill" Source="{Binding Photo}" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="0,0,15,0"/>
                <Label Content="{Binding Name}" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="20"/>
            </WrapPanel>
        </DataTemplate>
    </Window.Resources>

    <StackPanel HorizontalAlignment="Center">
        <Label Content="Dropdown list with Image" HorizontalAlignment="Center" FontSize="30" Margin="20"/>
        <ComboBox x:Name="lstwithimg" HorizontalAlignment="Center" VerticalAlignment="Top" ItemTemplate="{StaticResource cmbTemplate}" Height="80" Width="400"/>
    </StackPanel>

检查以下内容......以便更好地了解实例......

http://www.codescratcher.com/wpf/wpf-combobox-with-image/