2010-03-28 9 views
7

Ich habe eine Enum sagen wirWie Combobox ItemTemplate deklarieren, die Itemsource als Enum-Werte in WPF hat?

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

ich dieses Enum in XAML meiner Combobox binded haben.

Während eine Combobox definieren ich eine ItemTemplate von combox definiert haben zwei UI-Element zu nehmen:

  1. TextBlock-, die den ENUM-Wert zeigen (Beschreibung)
  2. Bild

Ich habe dies getan viel in XAML.

Ich frage mich, wo ich das Bild für jeden Enum-Wert in einer Combobox angeben kann? Ist das durch Datentrigger möglich?

Ich schätze wirklich, wenn jemand das XAML für dieses Szenario hat.

Vielen Dank im Voraus

Antwort

13

Sie einen Datatrigger verwenden können, wäre aber besser verwaltbar, wenn Sie einen Konverter verwendet. Hier ist ein Beispiel, das einen DataTrigger für eine Ansicht des Bildes und des Textes selbst verwendet, und dann den gleichen DataTrigger, um das Bild und den Text in ListBox und ComboBox anzuzeigen, und schließlich eine ListBox und ComboBox, die einen Konverter zum Anzeigen des Bildes und verwenden Text:

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 Hinter

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(); 
     } 
    } 
} 
+0

Vielen vielen Dank für die Lösung für beide mit Konverter und Daten Trigger. Ich stimme Ihnen zu, dass die Verwendung von Konverter wartungsfreundlicher sein wird. –