Multi-Column Selector

Question

Hi there. I am searching for some hybrid of ComboBox and ListView and I am wondering why there exists nothing like that, although I feel it's a quite natural wish to have it.

In more detail: A WPF ItemsControl should have an ItemsSource of all applicable items. These items have multiple properties, say ID:int, Name:string and Description:string. Now my ItemControl should:

1. Show these three properties as nicely aligned columns in some combobox-like drop-down
2. Provide some way of quickly finding an item by just typing text into a single textbox (without specifying, which property shall be searched). This should either select the first match or filter the items hiding all non-matching ones.

Key is that the control is perfectly usable without a mouse, but also provides some "explorer"-mode, if the user does not remember the perfectly identifying ID but only parts of some description or name. A configurable "Search-Function" would be nice, and it would be no problem if you would need to explicitly state all the properties to be included in a search or display function.

Answer 1

There is no such control so far, but you can certainly make one easily,

Create a C# Custom Control and define control template as Expander containing a DataGrid/ListView.

You can define dependency properties of your custom control as needed for ListView and do templatebinding for them. Expander's header should be bound to selected item's text or some sort of text representation of your objects.

Alternative:

Add a GRID inside Item Template and define its column definitions. And you can specify multi column values in the GRID easily.

<ComboBox>
   <ComboBox.ItemTemplate>
       <DataTemplate>
           <Grid>
                <Grid.ColumnDefinitions>
                     <ColumnDefinition Width="100"/>
                     <ColumnDefinition Width="200"/>
                     <ColumnDefinition Width="100"/>
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0" Text="{Binding CustomerName}"/>
                <TextBlock Grid.Column="1" Text="{Binding CustomerEmail}"/>
                <TextBlock Grid.Column="2" Text="{Binding CustomerPhone}"/>
           </Grid>
       </DataTemplate>
   </ComboBox.ItemTemplate>
</ComboBox>

By applying widths correctly, and giving margins to textblock, you can create multicolumn list to be displayed easily. Dont forget to TextSearch.SearchPath property in order to be able to select item by keyboad.