WPF - Hiding a ComboBox Selection

Question

I have a combobox which allows users to select from a collection of images. Because of the size of the images I would like to not display the image in the combobox once an image has been selected. I simply want nothing displayed in the combobox when an item is selected.

So far I have tried setting the selectedImageIndex to -1 once the selectedImageSource has been set when the user makes a selection however this did not work as the first image at [0] is still displayed in the combobox by default. I am using MVVM.

XAML

<ComboBox Grid.Row="1" SelectedIndex="{Binding SelectedImageIndex}" ItemsSource="{Binding SymbolImageCollection}">
                            <ComboBox.ItemTemplate>
                                <DataTemplate>
                                        <Image Source="{Binding Img}" Width="50" Height="50"/>
                                </DataTemplate>
                            </ComboBox.ItemTemplate>
                            <ComboBox.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <WrapPanel Width="300" HorizontalAlignment="Left"/>
                                </ItemsPanelTemplate>
                            </ComboBox.ItemsPanel>
                        </ComboBox>

View Model

public ObservableCollection<SymbolImage> SymbolImageCollection { get { return AppearanceLayerProperties.Instance.SymbolImageCollection; } }

    private string _selectedImageSource;
    public string SelectedImageSource
    {
        get { return _selectedImageSource; }
        set
        {
            SetProperty(ref _selectedImageSource, value);
            //SelectedImageIndex = -1;
        }
    }

    private int _selectedImageIndex;
    public int SelectedImageIndex
    {
        get { return _selectedImageIndex; }
        set
        {
            var selectedImage = AppearanceLayerProperties.Instance.SymbolImageCollection[value].ImgSource;
            SelectedImageSource = selectedImage;
            SetProperty(ref _selectedImageIndex, -1);

        }
    }

Possible duplicate of [How can I hide the selected item in a WPF combo box?](https://stackoverflow.com/questions/517002/how-can-i-hide-the-selected-item-in-a-wpf-combo-box) — Pavel Anikhouski, Aug 02 '19 at 09:12
Not a duplicate of that question - I need the selected item hidden from what is shown in the combobox after the item has been selected. That question is about hiding items from the collection displayed in the drop down. — je42, Aug 02 '19 at 09:20

score 0 · Answer 1 · answered Aug 02 '19 at 10:38

Changing the selection back to null after selecting an item of the ComboBox is not good practice, because if you need to use the selected value, it is not available anymore.

A solution could be to have a different template for the selected item of the ComboBox. That way, you could remove the image, but in its place put something else, like text, so the user as an idea of what item is selected. Here is a previous StackOverflow post explaining how to do this :

Can I use a different Template for the selected item in a WPF ComboBox than for the items in the dropdown part?

I hope this helps!

WPF - Hiding a ComboBox Selection

1 Answers1