Comment déclarer combobox itemTemplate ayant Itemsource comme valeurs Enum dans WPF?

Question

J'ai un ENUM disons

enum MyEnum 
{ 
    FirstImage, 
    SecondImage, 
    ThirdImage, 
    FourthImage 
}; 

J'ai binded ce Enum à mon combobox en XAML.

Lors de la définition d'un combobox j'ai défini un ItemTemplate combox prendre deux éléments de l'interface utilisateur:

1. TextBlock qui montrent la valeur ENUM (Description)
2. image

Je l'ai fait beaucoup en XAML.

Je me demande où je peux spécifier l'image corrosponding à chaque élément de la valeur Enum dans un combobox? Est-ce possible grâce au déclencheur de données?

J'apprécie vraiment si quelqu'un a le XAML pour ce scénario.

Merci beaucoup à l'avance

Answer 1

Vous pouvez utiliser un DataTrigger, mais serait plus maintenable si vous utilisez un convertisseur. Voici un exemple qui utilise un DataTrigger pour une vue de l'image et du texte, puis le même DataTrigger pour afficher l'image et le texte dans ListBox et ComboBox, et enfin, un ListBox et ComboBox qui utilisent un convertisseur pour afficher l'image et texte:

XAML

<Window x:Class="WpfSandbox.EnumToImage.EnumToImage" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:System="clr-namespace:System;assembly=mscorlib" 
     xmlns:local="clr-namespace:WpfSandbox.EnumToImage" 
     Title="Enum To Image" SizeToContent="WidthAndHeight" > 

    <Window.DataContext> 
     <local:ImageViewModel x:Name="Model" /> 
    </Window.DataContext> 

    <Window.Resources> 

     <ObjectDataProvider x:Key="EnumDataProvider" 
          MethodName="GetValues" 
          ObjectType="{x:Type System:Enum}"> 
      <ObjectDataProvider.MethodParameters> 
       <x:Type TypeName="local:Decade"/> 
      </ObjectDataProvider.MethodParameters> 
     </ObjectDataProvider> 

     <local:DecadeEnumImageConverter x:Key="ImageConverter" /> 


     <ControlTemplate x:Key="ImageTemplate" > 

      <StackPanel Orientation="Horizontal"> 
       <Image x:Name="MyImage" Width="64" Height="32" /> 
       <TextBlock Text="{Binding}" VerticalAlignment="Center" /> 
      </StackPanel> 


      <ControlTemplate.Triggers> 
       <DataTrigger Binding="{Binding}" Value="Ninties" > 
        <DataTrigger.Setters> 
         <Setter TargetName="MyImage" 
           Property="Source" 
           Value="/EnumToImage/images/90s.jpg"/> 
        </DataTrigger.Setters> 
       </DataTrigger> 
       <DataTrigger Binding="{Binding}" Value="Eighties" > 
        <DataTrigger.Setters> 
         <Setter TargetName="MyImage" 
           Property="Source" 
           Value="/EnumToImage/images/80s.jpg"/> 
        </DataTrigger.Setters> 
       </DataTrigger> 
       <DataTrigger Binding="{Binding}" Value="Seventies" > 
        <DataTrigger.Setters> 
         <Setter TargetName="MyImage" 
           Property="Source" 
           Value="/EnumToImage/images/70s.jpg"/> 
        </DataTrigger.Setters> 
       </DataTrigger> 
       <DataTrigger Binding="{Binding}" Value="Sixties" > 
        <DataTrigger.Setters> 
         <Setter TargetName="MyImage" 
           Property="Source" 
           Value="/EnumToImage/images/60s.jpg"/> 
        </DataTrigger.Setters> 
       </DataTrigger> 
       <DataTrigger Binding="{Binding}" Value="Fifties" > 
        <DataTrigger.Setters> 
         <Setter TargetName="MyImage" 
           Property="Source" 
           Value="/EnumToImage/images/50s.jpg"/> 
        </DataTrigger.Setters> 
       </DataTrigger> 
       <DataTrigger Binding="{Binding}" Value="Forties" > 
        <DataTrigger.Setters> 
         <Setter TargetName="MyImage" 
           Property="Source" 
           Value="/EnumToImage/images/40s.jpg"/> 
        </DataTrigger.Setters> 
       </DataTrigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 

     <DataTemplate x:Key="ItemsTemplateWithConverter"> 
      <StackPanel Orientation="Horizontal"> 
       <Image Width="64" Height="32" 
         Source="{Binding Converter={StaticResource ImageConverter}}"/> 
       <TextBlock Text="{Binding}" VerticalAlignment="Center" /> 
      </StackPanel> 
     </DataTemplate> 

     <DataTemplate x:Key="ItemsTemplateWithDataTrigger"> 
      <ContentControl Template="{StaticResource ImageTemplate}" /> 
     </DataTemplate> 

    </Window.Resources> 


    <StackPanel> 
     <ContentControl Margin="10" MouseUp="OnImageMouseUp" 
         HorizontalAlignment="Center" Cursor="Hand" 
         DataContext="{Binding Path=ImageEnum}" 
         Template="{StaticResource ImageTemplate}" /> 

     <StackPanel Orientation="Horizontal"> 

      <StackPanel> 
       <ListView Margin="10" 
        ItemsSource="{Binding Source={StaticResource EnumDataProvider}}" 
        ItemTemplate="{StaticResource ItemsTemplateWithConverter}" /> 

       <ComboBox Margin="10" 
        ItemsSource="{Binding Source={StaticResource EnumDataProvider}}" 
        ItemTemplate="{StaticResource ItemsTemplateWithConverter}" /> 
      </StackPanel> 

      <StackPanel> 
       <ListView Margin="10" 
        ItemsSource="{Binding Source={StaticResource EnumDataProvider}}" 
        ItemTemplate="{StaticResource ItemsTemplateWithDataTrigger}" /> 

       <ComboBox Margin="10" 
        ItemsSource="{Binding Source={StaticResource EnumDataProvider}}" 
        ItemTemplate="{StaticResource ItemsTemplateWithDataTrigger}" /> 
      </StackPanel> 

     </StackPanel> 
    </StackPanel> 

</Window> 

code Derrière

using System; 
using System.ComponentModel; 
using System.Globalization; 
using System.Windows; 
using System.Windows.Input; 
using System.Windows.Data; 

namespace WpfSandbox.EnumToImage 
{ 
    /// <summary> 
    /// Interaction logic for EnumToImage.xaml 
    /// </summary> 
    public partial class EnumToImage : Window 
    { 
     public EnumToImage() 
     { 
      InitializeComponent(); 
     } 

     private int i = 1; 
     private void OnImageMouseUp(object sender, MouseButtonEventArgs e) 
     { 
      i++; 
      Model.ImageEnum = (Decade)i; 

      if(i == 6) 
       i = 0; 
     } 
    } 

    public enum Decade 
    { 
     Ninties = 1, 
     Eighties = 2, 
     Seventies = 3, 
     Sixties = 4, 
     Fifties = 5, 
     Forties = 6, 
    }; 

    public class ImageViewModel : INotifyPropertyChanged 
    { 
     private Decade _imageEnum; 
     public Decade ImageEnum 
     { 
      get { return _imageEnum; } 
      set 
      { 
       _imageEnum = value; 
       RaisePropertyChanged("ImageEnum"); 
      } 
     } 

     public ImageViewModel() 
     { 
      ImageEnum = Decade.Ninties; 
     } 

     public event PropertyChangedEventHandler PropertyChanged; 

     protected void RaisePropertyChanged(string propertyName) 
     { 
      var handler = PropertyChanged; 
      if(handler != null) 
      { 
       handler(this, new PropertyChangedEventArgs(propertyName)); 
      } 
     } 

    } 

    public class DecadeEnumImageConverter : IValueConverter 
    { 
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
     { 

      var myEnum = (Decade)Enum.Parse(typeof(Decade), value.ToString()); 

      switch(myEnum) 
      { 
       case Decade.Ninties: 
        return "/EnumToImage/images/90s.jpg"; 
       case Decade.Eighties: 
        return "/EnumToImage/images/80s.jpg"; 
       case Decade.Seventies: 
        return "/EnumToImage/images/70s.jpg"; 
       case Decade.Sixties: 
        return "/EnumToImage/images/60s.jpg"; 
       case Decade.Fifties: 
        return "/EnumToImage/images/50s.jpg"; 
       case Decade.Forties: 
        return "/EnumToImage/images/40s.jpg"; 
       default: 
        throw new ArgumentOutOfRangeException(); 
      } 
     } 

     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
     { 
      throw new NotImplementedException(); 
     } 
    } 
}