Color Picker Combo Box

• Download sample app - 17.6 KB

Introduction

This is a short article on how to use the ComboBox control as a color picker to display and select colors. A small strip of the color and its name for all the known colors is shown in the drop down of the ComboBox control as shown below:

Background

The ComboBox control has a DrawItem event which needs to be implemented in the code to achieve this. There is a property called DrawMode for the ComboBox control which determines whether the Operating System or the code will handle the drawing of the items in the list. This property must be set to ‘OwnerDrawFixed’ using the Properties window in order for the DrawItem event implementation to be called.

Using the code

The solution contains only a single project, and that project contains a single form. On the form, I have a button, the click of which will populate the combo box with all the named colors in the Color struct. I am using the selected color for changing the background color of a panel on the form.

The button click implementation is as shown below. I have used Reflection to get a collection of all the colors in the System.Drawing.Color structure. The color names are then added to the combo box.

//
// Button click event handler
//

private void btnLoad_Click(object sender, EventArgs e)
{
    ArrayList ColorList = new ArrayList();
    Type colorType = typeof(System.Drawing.Color);
    PropertyInfo[] propInfoList = colorType.GetProperties(BindingFlags.Static | 
                                  BindingFlags.DeclaredOnly | BindingFlags.Public);
    foreach (PropertyInfo c in propInfoList)
    {
        this.cmbboxClr.Items.Add(c.Name);
    }
}

In the ComboBox control’s DrawItem event, the Graphics object (which can be obtained through the Graphics property of the DrawItemEventArgs) is used to draw a strip of the named color using its FillRectangle method. The DrawString method is used to add the name of the color. The DrawItem event will be triggered for each item added to the combo box.

//
// DrawItem event  handler
//

private void cmbboxClr_DrawItem(object sender, DrawItemEventArgs e)
{
    Graphics g = e.Graphics;
    Rectangle rect = e.Bounds;
    if (e.Index >= 0)
    {
       string n = ((ComboBox)sender).Items[e.Index].ToString();
       Font f = new Font("Arial", 9, FontStyle.Regular);
       Color c = Color.FromName(n);
       Brush b = new SolidBrush(c);
       g.DrawString(n, f, Brushes.Black, rect.X, rect.Top);
       g.FillRectangle(b, rect.X + 110, rect.Y + 5, 
                       rect.Width -10, rect.Height - 10);
    }
}

A snapshot of the sample form:

You can download the full project and open it in Visual Studio 2005 for more details.