none
WPF Combobox: selected image disappears from dropdown list RRS feed

  • Question

  • I've got a regular WPF Combobox with items of type NameWithIcon. NameWithIcon contains a pair of properties. I also add a DataTemplate for NameWithIcon.
     
    The problem raises when a instance of NameWithIcon containing an Image control is selected. The image is shown correctly in the selectionBox, but it disappears from the dropdown list.
    Could anybody provide a workaround and/or explanation?
     
    A code sniplet that reproduces the issue:
    <Window x:Class="WpfCbxIssue.MainWindow"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:w="clr-namespace:WpfCbxIssue"
     Title="MainWindow" Height="350" Width="525">
    
     <Window.Resources>
     <DataTemplate DataType="{x:Type w:NameWithIcon}">
      <WrapPanel>
       <ContentPresenter Content="{Binding Icon}" />
       <ContentPresenter Content="{Binding Name}" />
      </WrapPanel>
     </DataTemplate>
     </Window.Resources>
    
     <Canvas>
     <ComboBox>
      <w:NameWithIcon Name="name 1" Icon="n/a " />
      <w:NameWithIcon Name="name 2">
       <w:NameWithIcon.Icon>
        <Image Source="http://msdn.microsoft.com/favicon.ico" />
       </w:NameWithIcon.Icon>
      </w:NameWithIcon>
     </ComboBox>
     </Canvas>
    </Window>
    
     
    with NameWithIcon class as follows:
    public class NameWithIcon
    {
    	public object Icon { get; set; }
    	public object Name { get; set; }
    }
    

    Regards.
     





    • Modifié tpolaert mardi 23 août 2011 15:32
    lundi 22 août 2011 14:31

Réponses

  • Hello,

     

    A control can be at only one place at a time in the Visual tree. When you select the item, your Image is moved from the selection list to the "selected item" box.
    After, it is not moved anymore and then it is no more displayed in the list. Here is something which works nice:

    <Window.Resources>
      <DataTemplate DataType="{x:Type w:NameWithIcon}">
        <WrapPanel>
          <Image Source="{Binding Icon}" />
          <ContentPresenter Content="{Binding Name}" />
        </WrapPanel>
      </DataTemplate>
    </Window.Resources>
    
    <Canvas>
      <ComboBox>
        <w:NameWithIcon Name="name 1" Icon="n/a " />
        <w:NameWithIcon Name="name 2" Icon="http://msdn.microsoft.com/favicon.ico" />
      </ComboBox>
    </Canvas>
    
    

    Good luck,

     

    PS: this is a french forum: do you speak french ?


    Jonathan ANTOINE - http://wpf-france.fr - http://blog.lexique-du-net.com
    lundi 22 août 2011 15:19
    Modérateur

Toutes les réponses

  • Hello,

     

    A control can be at only one place at a time in the Visual tree. When you select the item, your Image is moved from the selection list to the "selected item" box.
    After, it is not moved anymore and then it is no more displayed in the list. Here is something which works nice:

    <Window.Resources>
      <DataTemplate DataType="{x:Type w:NameWithIcon}">
        <WrapPanel>
          <Image Source="{Binding Icon}" />
          <ContentPresenter Content="{Binding Name}" />
        </WrapPanel>
      </DataTemplate>
    </Window.Resources>
    
    <Canvas>
      <ComboBox>
        <w:NameWithIcon Name="name 1" Icon="n/a " />
        <w:NameWithIcon Name="name 2" Icon="http://msdn.microsoft.com/favicon.ico" />
      </ComboBox>
    </Canvas>
    
    

    Good luck,

     

    PS: this is a french forum: do you speak french ?


    Jonathan ANTOINE - http://wpf-france.fr - http://blog.lexique-du-net.com
    lundi 22 août 2011 15:19
    Modérateur
  • Désolé, j'ai posté ma question sur le forum français par erreur.

     

    L'objectif est d'afficher un texte alternatif dans le cas où l'icône n'est pas disponible :

    Avec un contrôle Image dans le template, il faut forcément que la propriété Icon contienne une image source. Toutefois, ça m'a mis sur la voie de la solution ci-dessous:

     <Window.Resources>
     <DataTemplate DataType="{x:Type w:NameWithIcon}">
      <Grid>
      <TextBlock Text="{Binding Alt}" />
      <Image Source="{Binding Icon}" />
      <ContentPresenter Content="{Binding Name}" />
      </Grid>
     </DataTemplate>
     </Window.Resources>
    
     <Canvas>
     <ComboBox>
      <w:NameWithIcon Name="Autriche" Icon="/WpfCbxIssue;component/Images/austria.gif" />
      <w:NameWithIcon Name="Belgique" Alt="be" />
      <w:NameWithIcon Name="France" Icon="/WpfCbxIssue;component/Images/france.gif" />
      <w:NameWithIcon Name="Espagne" Alt="es" />
      <w:NameWithIcon Name="Italie" Icon="/WpfCbxIssue;component/Images/italy.gif" />
     </ComboBox>
     </Canvas>
    

    et 

    	public class NameWithIcon
    	{
    		public string Alt { get; set; }
    		public string Icon { get; set; }
    		public object Name { get; set; }
    	}
    

     

    mardi 23 août 2011 16:32