ColorList Anatomy

Written by PureComponents | 25 May 2010

The ColorList is .NET WinForms control, which extends the ListBox control. It does almost everything that a ListBox does and also can display a colored box next to items in the list.

The following picture shows the individual parts of the ColorList control.

Color Box Item Text Item Description Selected Item Item Gap ColorList Background

(1) Color Box

What makes the ColorList different from the other list components is a Color Box - a colored rectangle for each item. Different colors and styles can be set, as well as the ColorBoxSize.

The following image shows the Color Box FillStyle options, the values are: Flat, VerticalFading, HorizontalFading, DiagonalBackward, DiagonalForward, VistaFading, VerticalFading2, VerticalFading3

The Color Box can be of transparent color. In this case just the dotted frame is displayed.

(2) Item text,  (3) Item Description

Every item has its Text and optional Description which is displayed below the text. The text and the description have their individual style so their apearance can be set separately. The left picture shows items with the description, the right picture items without it.  

Each ColorList item can have its own style. To reach this the LocalStyle property must be set to true. This property is a member of the ColorListItem class. All the items in the following picture have their own style defined.

Each ColorList item has the divider. This is a horizontal line separating items from each other. The divider can use the different kinds of outline and its color can be changed.

(4) Selected Item

The SelectedItem has its own style defined in ColorList. It is possible to choose the color, background fill style and the border. The mouse hover effect can be set by TrackingBackColor and TrackingTransparency properties.

Selecting the item and tracking is shown in the following figure.

(5) Item Gap

The space between the items can be adjusted by the ItemGap property.

(6) ColorList Background

It is possible to set the BackColor and FillStyle of the ColorList. The picture shows the FillStyle options, the values are: Flat, VerticalFading, HorizontalFading, DiagonalBackward, DiagonalForward, VistaFading, VerticalFading2, VerticalFading3.

The drawing the odd and even items with the different style is also supported. It is done by setting the ColorList ShowAlternateItems property to true.

Databinding

The ColorList can be connected to different kinds of data sources. This is done the same way it is usual in .NET framework - through the DataSource and DataMember properties. Each ColorList item can have its text, description and color filled from the data source by setting the DisplayMemberColor, DisplayMemberDescription and DisplayMemberText properties. Formatting the text and description is supported as well using the .NET framework string formatting engine with the FormatText and FormatDescription properties. For example, the date in the data source can be formatted to "2007-05-01" by setting the FormatText property to "yyyy-MM-dd" or the numeric data can be formatted with the "Item number {0}" string.

The ColorList is part of .NET WinForms Suite.
Download trial version here or purchase full version here.