vbAccelerator IconComboBox Control

An extended combo box control with support for icons, indentation, auto-complete, multiple columns and more.

One of the more notable omissions from the set of .NET Framework Windows controls is a Combo Box which supports icons, despite a control of this type being used to good effect in Explorer and IE. This article provides a reusable control which extends the standard ComboBox to allow you to associate icons, indentation and multiple columns with each of the items in the combo box, as well as providing Office/VS.NET style highlighting and auto-complete features.

Features of the Control

About The Downloads

There are three code downloads provided with this article.

• The Binary download provides the official vbAccelerator strong-named signed assembly for the control, acclIconComboBox.Dll. This assembly can be registered into the Global Assembly Cache (GAC).
• The Demonstration download uses the signed assembly. You need to have the signed control to run the demonstration; it can either by registed into the GAC or placed into the demonstration executable directory.
• The Source download provides the projects used to develop and release the control. You can copy the IconComboBox control source into your own project from here, or build your own version if you provide a new strong-name key pair.

Using The Control

The structure of the control is shown in the UML diagram below:

IconComboBox control UML Diagram

IconComboBox derives from the standard framework ComboBox, and contains two main collections:

1. ObjectCollection, containing the combo items.
2. IconComboBoxColumnCollection, containing information about the columns.

Note that in this version of the control that ObjectCollection is not strongly typed, as I could not find a way to override the standard combo box ObjectCollection. This isn't a problem, just you need to remember to add IconComboItem objects (or objects which derive from it) to the control.

The next three sections describe the new features of the control and these objects.

1. Configuring the ComboBox

As well as the standard combo box properties such as drop-down style, the control additionally provides these properties:

• AutoComplete
  Gets/sets whether text entered into the text box portion of the combo box will be auto-matched to an item in the drop-down list.
• HighlightStyle
  Gets/sets the type of highlighting applied to items in the box. This can either be the standard combo box highlighting style or a VS.NET/Office style.
• BorderStyle
  Gets/sets the border style of the combo box. This can either be the standard border or a flat VS.NET/Office style with mouse-over highlighting (see the article Flat Combo Boxes for details of this technique).
• FullRowSelect
  When more than one column is associated with the control, this configures whether all items in the row are selected, or just the first column.
• GridLines
  Gets/sets whether gridlines are displayed around the items in the drop-down list. Most useful in a multi-column combo box.
• TextBoxIcon
  Gets/sets whether an icon is shown next to the text box when the control has the DropDown style.
• ImageList
  Gets/sets the ImageList used to draw images in the control.
• IndentationSize
  Each item in the control can have an associated indentation. This property specifies how many pixels are used for each unit of indentation.

2. Configuring Items

The IconComboItem class is an implementation of the IIconComboItem interface which defines the items in the control. Each item can also have a collection of IconComboSubItem subitems associated with it. Both IconComboItem and IconComboSubItem derive from the same abstract base class, IconComboItemBase, which provides a comprehensive set of formatting and display properties.

• Text
  Gets/sets an object to use to display in the item. When the control renders the item, it uses the TextFormat formatting string to display the item if it is set, or the ToString method of the object otherwise. This is allows you to display many different types of object as items in the combo box without losing the underlying object itself.
• TextFormat
  Gets/sets an optional formatting string to use when rendering the Text object into the control. For example, if the Text object was set to a Date then you might use a TextFormat of "{0:d MMMM yyyy}" to show the date.
• Icon
  Gets/sets the 0-based index of the icon in the ImageList. Set to -1 (the default) for no icon.
• StringFormat
  Gets/sets an optional System.Drawing.StringFormat object to use when rendering the item. This allows you to adjust the alignment and wrapping characteristics of the text that is displayed.
• Font
  Gets/sets the font used to display this item. If set to null, the control's font is used.
• ForeColor
  Gets/sets a foreground colour to use when drawing the item.
• BackColor
  Gets/sets a background colour to use when drawing the item.
• AutoHeight, Height
  This pair of properties allow you control how the heights of items are set in the control. If AutoHeight is set to true, then the items's size is automatically calculated. Otherwise, the value of the Height property is used.

The following properties are only available for items (IconComboItem) and not sub-items:

• LineAbove, LineBelow
  Get/set whether ruling lines are drawn above or below the item.
• Indentation
  Gets/sets the indentation used to display the item. The indentation is multiplied by the owning control's IndentationSize prior to display.
• SubItems
  Gets the collection of sub-items associated with this item.
• GroupRow
  When set true, makes this item extend the entire width of the combo box regardless of whether multiple columns are set or not.

3. Configuring Columns

By default, the IconComboBox control has a single column and any sub-items are ignored. By modifying the contents of the IconComboBoxColumnCollection you can configure the control to display more columns, and also to manipulate the order of the columns as well as whether they are shown or not. IconComboBoxColumnCollection is a standard Framework collection which is strongly-typed to contain IconComboBoxColumn objects, which have these properties:

• ColumnWidth
  Gets/sets the width of the column in the control. Set the width to 0 if you want to hide the column.
• ColumnOrder
  Gets/sets the 0-based order of this column when it is displayed in the control. Normally, the first column shown in the control is the IconComboItem which was added to the control, and this is followed by each of the subitems in the order that they were added. By setting this property ColumnOrder you can rearrange the order in which the columns are displayed.

Conclusion

This article provides a flexible and powerful combo box control with support for icons, multiple columns, indentation, auto-complete and per-item formatting properties. In future articles we'll be looking at applying the same techniques to the ListBox, as well as how to use the control to pick fonts, paragraph formatting styles and Shell file system objects.