Click here to Skip to main content
15,884,783 members
Articles / Web Development / HTML

ExCB - Extended Multi Column ComboBox

Rate me:
Please Sign up or sign in to vote.
4.77/5 (31 votes)
21 Mar 2016CPOL6 min read 77.2K   3.6K   43   51
Presenting an easy-to-use, flexible, filterable ComboBox, managing various data types (including images), also sortable, resizable and reordable columns

Sample Image - maximum width is 600 pixels


This component, written in VB.NET, was first produced in 2008. But recently, I decided to introduce some new features, especially in the ListView part. Some reasons are listed below:

  • The need to present Images and good 'CheckBoxes', not just those resulting from the use of characters from the Wingdings font.
  • The need to automatically adjust the height of the subcomponents, given the use of different fonts and font sizes.
  • The need to 'correctly' sort Text, Numeric and Date(Time) Columns.
  • A fact which irritated everyone: with Visual Studio 2008 on Windows XP, increasing the font size did not change the height of the ListView header. Annoying... So, I also decided to impose the Header Height.

Thus, the control became, not only 'one more ComboBox', but an enhanced, flexible, powerful and easy-to-use component.

  • It works with various types of data: Text, Numbers, Date(Time), Images and Booleans
  • Images can be sent as (real) images or by path reference
  • Booleans are shown as 'checkboxes', but in 2 ways: by picture (better aspect, scalable), or by characters from Wingdings font (higher performance)
  • Has a built-in Row Counter
  • Rows can be filtered, in order to reduce the list, by typing characters in the TextBox
  • The user can control the List Header Height and Colors
  • The user can control the List Rows Height
  • The user can control each Column's Fore & Back Colors
  • The user can control the Size and SizeMode of Images and 'picture checkboxes'
  • Columns can be Resized, Reordered and Sorted (ascending/descending, with Arrow indicator)
  • Numbers and Dates are 'effectively' ordered, regardless of the Format in which they are displayed

Image 2

Of course, the more images are added, the worse the performance...


Also, the code is as simple as possible, and programmers can find some useful code snippets, related to:

  • Expandable properties
  • Fading effects
  • Color change
  • Embedded controls handling
  • HeaderControl subclassing (NativeWindow)
  • HDM_LAYOUT capture
  • Header Height control
  • Header Sort Arrows
  • Columns Text, Date & Numeric effective sorting

See Documentation and Examples

First of all, download the .ZIP file.

The .ZIP file includes ExCB_Documentation.PDF, which fully describes the component.
The demo forms present several examples, techniques and tips to manipulate data.

Last Updates

  1. Addendum to ExCB_Documentation.PDF:
    Filtering - To reset filtering, selecting all Rows, just drop-down the List clicking the mouse right-button.
  2. When starting the provided solution, if you receive the message 'A project with an Output Type of Class Library cannot be started directly', then:
    Go to the Solution Explorer, select ExCB_Test Project, right-click mouse button and click Set as StartUp Project.
  3. Addendum to ExCB_Documentation.PDF: Take note of another Event:
    Event DropDownChanged - Occurs when the List is Opened/Closed.
    DropDownChanged(IsDroppedDown as Boolean)
    - IsDroppedDown = True - The List was Opened
    - IsDroppedDown = False - The List was Closed
  4. To avoid an error, in a very specific circumstance, please,
    in Class ExCB.vb, Property SelectedIndex(), replace the line:
    MyLV1.Items(value).Selected = True
        MyLV1.Items(value).Selected = True
    End Try
  5. In response to questions posed by L.Botello:
    1. seems that, in certain circumstances, when font size is increased, the list is slightly truncated (bottom). Isn't?
      Yes, it's a bug. To fix it, please:
      in ExCB.vb, Region "TextBox & Button code", Sub Button1_MouseDown, replace the line:
      Dim LX As Integer = Sizes_.ListHeader_Height + 1 + MX * (_ListRowHeight + 1)
      Dim LX As Integer = Math.Max(Sizes.ListHeader_Height, _
                              TextRenderer.MeasureText(" ", Me.Font).Height + 4) + _
                              MX * (_ListRowHeight + 1)
    2. Did you ever have considered the possibility of growing/shrink the list (regardless of MaxRowsDisp property value) when the form is resized?
      Thank you for the suggestion, that will improve control's features.
      It will be an option. Please, do the following:
      in Class ExCB.vb, Region "Public Methods", insert the following Sub:
      Public Sub AdjustListHeight()
              Dim Parent_csH As Integer = Me.ParentForm.ClientSize.Height ' Exclude TitleBar and Borders
              Dim HeaderH = Math.Max(Sizes.ListHeader_Height, TextRenderer.MeasureText(" ", Me.Font).Height + 4)
              Dim RestH As Integer = Parent_csH - Me.Top - MyLV1.Top - HeaderH
              _MaxDsp = RestH \ (_ListRowHeight + 1)
              Dim MinRows As Integer = Math.Min(_MaxDsp, MyLV1.Items.Count + 1)
              If MyLV1.Visible Then
                  MyLV1.Height = HeaderH + MinRows * (_ListRowHeight + 1)
                  Me.Height = _LblBoxH + MyLV1.Height
              End If
          End Try
      End Sub
      Then, in your Form, insert this code and invoke the Method just for the Control instance(s) you want the feature active:
      Private Sub Me_Sizes(sender As Object, e As EventArgs) Handles Me.Resize, Me.SizeChanged
          ' ...
          ' ExCBn.AdjustListHeight()
      End Sub
      Anyway, define MaxRowsDisp value for the first display (when it occurs before the first resize...).
  6. Made available for download a new project (source and demo), for VS2012, which is the 'original' plus all the above updates (including Method AdjustListHeight), plus a new Property AutoComplete, which gives the Control AutoComplete-like capabilities: whenever a key is pressed, the List drops down, showing only the rows that matches the typed string. The match applies to any subitem (Column). Setting the Property AutoComplete to True implies Property Filterable to be also set to True. Before running ExCB_Test project, don't forget to Set it as StartUp Project.

Using the Code

The component is provided in 2 versions: Visual Studio 2008 and Visual Studio 2012.
All features are available in both versions, but version 2012 is less limited and easier to use.

The component DLL is located at ...\ExCB\VS20xx\ExCB\bin\Release\ExCB.dll.

  • Add it to your Toolbox, right-clicking the Toolbox area -> Choose Items… -> Browse -> select the DLL
  • In the Solution Explorer, select your Project, open My Project -> References -> Add… -> Browse -> select the DLL
  • Drag the component from the Toolbox to your Form.

Brief Description of the Component's Own Properties, Event and Methods

Browsable Properties

  • BorderStyle The BorderStyle which applies to the TextBox subcomponent
  • Colors (Expandable Property)
    • HeadBackColor - BackColor of the ListView Header
    • HeadForeColor - ForeColor of the ListView Header
    • ListBackColor - BackColor of the ListView Items
    • ListForeColor - ForeColor of the ListView Items
    • TBoxBackColor - BackColor of TextBox element
    • TBoxForeColor - ForeColor of TextBox element
  • CounterLoc - The position and alignment of the built-in Row Counter, relative to the TextBox
  • DisplayColumn - The Index of the SubItem (Column) to display in the TextBox, when selecting a Row in the List
  • Filterable - Indicates if the ListView Rows can/cannot be filtered
  • Font - Defines the Font Name, Size and Styles for ALL the subcomponents (ListView, TextBox and Counter)
  • GridLines - Displays grid lines around Items and SubItems, in the ListView
  • MaxRowsDisp - Maximum number of Rows to display, when the List is dropped-down
  • MinimunWidth - Minimum Width of the component. Changes when the component is resized
  • Read_Only - When True, the component cannot be dropped-down / changed, but shows the current selection
  • Reordable - Indicates if the ListView Columns can/cannot be reordered
  • Resizable - Indicates if the ListView Columns can/cannot be resized
  • Sizes - (Expandable Property)
    • Image_Height - Height of the Images sent to the List
      • Image_Width - Width of the Images sent to the List
      • ListHeader_Height - Height of the ListView Header
      • ListRow_Height - Height of the ListView Rows
      • YesNo_Height - Height (and Width) of the "checkboxes"
  • Sortable Indicates if the ListView Columns can/cannot be sorted

Non-browsable Properties

  • Count - Gets the number of Rows in the List
  • SelectedIndex - Gets / Sets the Index of the Row currently selected
  • Text - Gets / Sets the Text from/to the TextBox part of the component


  • ItemSelected - Occurs when a Row is Selected / programmatically Unselected
  • DropDownChanged - Occurs when the List is Opened/Closed


  • AddColumn - Creates a new Column (with 1 required and 13 optional parameters)
    AddColumn(HeaderText As String,
        [Width As Integer = 80],
        [Align As System.Windows.Forms.HorizontalAlignment = HorizontalAlignment.Left],
        [DataType As ExCB.ExCB.DataType = ExCB.ExCB.DataType._Text],
        [Format As String = Nothing],
        [ForeColor As System.Drawing.Color = Nothing], '(VS2012)
        [BackColor As System.Drawing.Color = Nothing], '(VS2012)
        [ImgWidth As Integer = 0],
        [ImgHeight As Integer = 0],
        [SizeMode As ExCB.ExCB.SizeMode = ExCB.ExCB.SizeMode._Stretch],
        [Resizable As Boolean = True],
        [Reordable As Boolean = True],
        [Sortable As Boolean = True],
        [ArrowOnRight As Boolean = False])
  • AddRow - Adds a Row (Item) to the ListView (sends a String or Object Array)
  • ARGB - Converts a Color to its Integer value
  • Clear - Deletes all Rows of the List (including Embedded Controls), optionally all Columns
  • RowSelect - Selects a Row, giving a Value and a Column Index, optionally returning another subitem
  • GetImage - Retrieves the Image at the specified Index within the Component's array


03.Jun.2014 - First posted

05.Jun.2014 - Added Last Updates 1. and 2. to See Documentation and Examples

11.Jun.2014 - Added Last Updates 3. and 4. to See Documentation and Examples

05.Dec.2014 - Added Last Updates 5. to See Documentation and Examples

21.Mar.2016 - Added Last Updates 6. to See Documentation and Examples


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Written By
Portugal Portugal
Working on computers since Mar,6 1969
Languages: RPN, Fortran, COBOL, Univac 1100 Meta-assembler, Basic, Z80 Assembly, 8086 Assembly, IBM Assembler (360/370, 38xx, 43xx), Clipper, ANSI C, SQL, Visual Basic, VBA, VB.NET
Lately, some HTML, JavaScript, C#
Actually retired, but still developing (for pleasure).

Comments and Discussions

GeneralRe: My vote of 5 ***** Pin
Avelino Ferreira5-Jun-14 1:21
professionalAvelino Ferreira5-Jun-14 1:21 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.