Click here to Skip to main content
13,259,771 members (53,345 online)
Click here to Skip to main content
Add your own
alternative version


50 bookmarked
Posted 25 May 2008

A ListBox Displaying (User-)Controls

, 1 Jul 2008
Rate this:
Please Sign up or sign in to vote.
Use this Control to line up controls in a ListBox
Sample Image - ARBOScrollableListBox.png


From time to time, I was looking for an easy way to show a collection of information in my programs. Searching around, I always ended up displaying information in a ListView. One day I found an article here on The Code Project about a multiline ListBox, but that does not really solve the problem of displaying data collections like addresses. Thus I started to write a usercontrol which should be easy to use and solve my needs. Maybe it is helpful for others, too...


My first thought was: easy... take a usercontrol, make it scrollable and add each sub-control with DockStyle.Top. The rest is done by the usercontrol itself and the framework.
Ok, so 5 minutes later the first version was on start. Adding 100 controls (I created an address control displaying name, street, zip, city and phone) took about 17 seconds. no good idea... Some tests later (disabling DockStyle etc.), I started from scratch. The only thing that is equal to the first approach - it's still a usercontrol.


The next step was to think about a method that still displays items, but won't take seconds to build the list. The solution is something like a "virtual" visible list. That means, the usercontrol holds a list of controls to be displayed and rebuilds the items to be shown each time the control scrolls.

That also means that I have to control the scrollbar on my own. To do so, I need to remember the first element on the screen and the number of elements. On each scroll event, I need to rebuild the items that are in the visible area of my usercontrol.

... More Speed

The new version of the usercontrol was nearly what I wanted it to be like. It is (nearly) fast and it can scroll items, even if the items do not have the same height.
But if I add a lot of elements (let's say...1000) it still gets a little bit slow and flickers horribly. So the next step was to add an "update" mechanism. Each time I call Update(), a member update is increased, and on each EndUpdate() it is decreased. While update is > 0, no visual things are done. And when update is 0 again, the visual things are done.

Item Selection

Now we are fast enough for a lot of items, we can add/remove them and they can be scrolled. But no one gets informed as to which item is selected.

The first thing on my mind was "let's add a click event handler". But that's not really all, because if the child control itself contains other child controls, we will never be informed about the click. so we need to register to the click handler of all child controls recursively (and deregister on deletion). So adding a control leads to calling AttachClickEvents(ChildControl).

private void AttachClickEvents( Control Control ) {
    Control.Click += new EventHandler( Control_Click );
    if( Control.Controls != null ) {
        foreach( Control C in Control.Controls ) {
            AttachClickEvents( C );

Now, if any child control is clicked, we are informed about that event. we need to compare, if the clicked control is in our list of controls. If not, we need to take the parent control and do that compare, again. If we find the control in our list, we find the control for which we need to fire the ControlSelected event.

Sorting Items

The last thing that is outstanding is sorting. That is really easy. We need to have a public property for an IComparer which can be set from outside the usercontrol. Now, if that comparer is set, adding/removing a control to/from our item list needs a call of items.Sort(comparer).

Using the Code

Though we have a property to get the list of controls our usercontrol is displaying, we may not use this list to change elements, because the click event handler is not properly set. They are only set in Add(Control) and they are only removed in Remove(Control) or RemoveAt(Index).

The public methods and properties are:

    public ARBOScrollableListBox()

    public List Items                       // list of controls to display
    public bool AdaptControlWidth           // make controls width fitting
    public bool AdaptControlHeight          // make controls heights fitting
    public Control CurrentSelected          // the selected control
    public IComparer Comparer               // the comparer to use
    public OrientationEnum Orientation      // orientation of the items

    public void BeginUpdate()               // stop screen updating
    public void EndUpdate()                 // redo updating
    public void Add( Control Control )      // add a control
    public void Remove( Control Control )   // remove a control
    public void RemoveAt( int Index )       // remove a control at position "index"
    public void Clear()                     // clear list of controls
    public void Rebuild()                   // rebuild the display
    public void SelectControl( Control C )  // manually select a control

Points of Interest

Writing this control showed up some interesting points explained in the background section, like click event or speed up.

Extension 1: Orientation

By now, you can set the orientation of the items within the ListBox. That means, if you set Orientation to OrientationEnum.Vertical, you will get the list of items sorted from top to bottom (in connection with the item comparer you use). Otherwise you will get them in order from left to right.

If you set the AdaptControlWidth property to false, you will get as many columns (rows), as fit on the control (see screenshot).

Extension 2: Invisibility

Thanks to my readers, I was able to change the behaviour when the control is invisible. Some of the calculations for the scrollbars depend on the number of items visible within the control. When invisible, this leads to a "division by zero" error (corrected).


... to Marc Clifton, who read the article and gave me some hints, before I published it...
If you want to get good information - read his articles!


  • 2008-05-21 : Initial release
  • 2008-06-25 : Orientation and multi cols/rows added
  • 2008-06-29 : Article updated


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


About the Author

Achim Bohmann
Software Developer acs - it-systems
Germany Germany
No Biography provided

You may also be interested in...


Comments and Discussions

QuestionQuestions?????????? Pin
mojtabaNava11-Nov-12 8:19
membermojtabaNava11-Nov-12 8:19 
GeneralMy vote of 5 Pin
khalleo22-Mar-12 14:51
memberkhalleo22-Mar-12 14:51 
BugIssue with Rebuild() method Pin
ant-damage20-Aug-11 8:34
memberant-damage20-Aug-11 8:34 
For example, when the list contains items, and you use the Clear() method to clear the virtual list, the control collection in panelControls.Controls doesn't get update, leaving them visible.

EDIT: if you add this line to the begin of Rebuild(), it will solve the bug:
if (items.Count == 0) panelControls.Controls.Clear();

QuestionScrollbar gone crazy!! Pin
Xixles15-Jul-08 13:28
memberXixles15-Jul-08 13:28 
AnswerRe: Scrollbar gone crazy!! Pin
Achim Bohmann12-Aug-08 4:31
memberAchim Bohmann12-Aug-08 4:31 
GeneralRe: Scrollbar gone crazy!! Pin
Thisisryan7-Jan-09 5:03
memberThisisryan7-Jan-09 5:03 
QuestionDivided by zero error Pin
cakirhal27-Jun-08 2:59
membercakirhal27-Jun-08 2:59 
AnswerRe: Divided by zero error Pin
Achim Bohmann27-Jun-08 11:04
memberAchim Bohmann27-Jun-08 11:04 
QuestionListbox doesn't follow docking style Pin
K.L.K13-Jun-08 12:18
memberK.L.K13-Jun-08 12:18 
AnswerRe: Listbox doesn't follow docking style Pin
Achim Bohmann26-Jun-08 10:59
memberAchim Bohmann26-Jun-08 10:59 

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.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.171114.1 | Last Updated 2 Jul 2008
Article Copyright 2008 by Achim Bohmann
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid