How to Customize Items in ComboBox: WPF

September 10, 2013 , , , , 0 Comments

In our previous post I have discussed about the introduction of combo box control and insert some items in it. What if I want to insert an image also with a text in combo box items? So in this article, I will add some items in combo box which will have text as well as an image also.

To place an image and a text, I am using a stack panel with orientation horizontal. This stack panel will contain an image and a textblock, providing sufficient information. Check out the below code:
<ComboBox Name="customizeComboBox" Height="30" Width="200"
<StackPanel TextSearch.Text="Item 1" Orientation="Horizontal">
<Image Source="image1.png"></Image>
<TextBlock Text="First item with image"></TextBlock>
<StackPanel TextSearch.Text="Item 2" Orientation="Horizontal">
<Image Source="image2.png"></Image>
<TextBlock Text="Second item with image"></TextBlock>

The XAML code have simple definition of combo box which contains a name, height and width. IsEditable property will be used to do some search when user will type something in combo box. In the combo box tags I have used two stack panel (may be more), with an image and a text.

Run the code and a combobox will be shown with two items, each containing an image and a text specified above:

Customize items in combo box wpf

Subhash Sharma

Some say he’s half man half fish, others say he’s more of a seventy/thirty split. Either way he’s a fishy bastard. Google