ColorPicker, FontPicker...

• Download source code - 23.3 Kb

Note: the source code must be compiled / run against .NET framework 2.0.

Introduction

Although the .NET framework provides quite a rich collection of UI controls and components for WinForms development, there is one particular type of control that has been missing. I'm talking about a color-picker control with drop-down color selection capabilities, and a font-picker control with pop-up font selection capabilities, just like the one used within the Visual Studio .NET property browser for editing Color-typed or Font-typed properties.

About the PickerBase

As the base class of the enhanced controls ColorPicker, FontPicker, HatchStylePicker, DashStylePicker, the PickerBase class mostly implements all the general methods and properties which might be used or required in its inherited classes. Therefore, its size exceeds more than 1000 lines, and its implementation will not be detailed here (if you are interested, you can refer to the PickerBase.cs file for detailed implementation). In addition, more Picker controls can be derived from this base class if you like. (One more thing: if your derived Picker control requires a UITypeEditor which might not be provided by the .NET framework, you must define one for your Picker control. For your reference, please see the DashStyleEditor in the DashStylePicker.cs file.)

Inheritance from the PickerBase

ColorPicker: Represents a Windows picker box that displays Color values.

//ColorPicker.cs


using System;
using System.Drawing;
using System.Text;

namespace Com.Windows.Forms
{
    /// <summary>

    /// Represents a Windows picker box that displays Color values.

    /// </summary>

    public class ColorPicker : PickerBase
    {
        /// <summary>

        /// Constructor

        /// </summary>

        public ColorPicker()
            : base(typeof(Color))
        {
            Value = Color.White;
        }

        /// <summary>

        /// Value

        /// </summary>

        public new Color Value
        {
            get
            {
                return (Color)base.Value;
            }
            set
            {
                base.Value = value;
            }
        }
    }
}

FontPicker: Represents a Windows picker box that displays Font values.

//FontPicker.cs


using System;
using System.Drawing;
using System.Text;

namespace Com.Windows.Forms
{
    /// <summary>

    /// Represents a Windows picker box that displays Font values.

    /// </summary>

    public class FontPicker : PickerBase
    {
        /// <summary>

        /// Constructor

        /// </summary>

        public FontPicker()
            : base(typeof(Font))
        {
            Value = SystemFonts.DefaultFont;
        }

        /// <summary>

        /// Value

        /// </summary>

        public new Font Value
        {
            get
            {
                return (Font)base.Value;
            }
            set
            {
                base.Value = value;
            }
        }
    }
}

HatchStylePicker: Represents a Windows picker box that displays HatchStyle values.

//HatchStylePicker.cs


using System;
using System.Collections;
using System.Text;
using System.Drawing;
using System.Drawing.Design;
using System.Drawing.Drawing2D;
using System.ComponentModel;

namespace Com.Windows.Forms
{
    /// <summary>

    /// Represents a Windows picker box that displays HatchStyle values.

    /// </summary>

    public class HatchStylePicker : PickerBase
    {
        /// <summary>

        /// Constructor

        /// </summary>

        public HatchStylePicker()
            : base(typeof(HatchStyle))
        {
            Value = HatchStyle.Cross;
            Editor = new HatchStyleEditor();
            TextEditable = false;
        }

        /// <summary>

        /// Value

        /// </summary>

        public new HatchStyle Value
        {
            get
            {
                return (HatchStyle)base.Value;
            }
            set
            {
                base.Value = value;
            }
        }


        /// <summary>

        /// The UITypeEditor of HatchStyle

        /// </summary>

        private class HatchStyleEditor : UITypeEditor
        {
            /// <summary>

            /// Constructor

            /// </summary>

            public HatchStyleEditor()
            {
            }

            /// <summary>

            /// Overloaded. Gets the editor style used by the EditValue method.

            /// </summary>

            /// <param name="context">An ITypeDescriptorContext

            ///    that can be used to gain additional

            ///    context information.</param>

            /// <returns>A UITypeEditorEditStyle value that indicates

            ///    the style of editor used by the EditValue method.</returns>

            public override UITypeEditorEditStyle 
                   GetEditStyle(ITypeDescriptorContext context)
            {
                return UITypeEditorEditStyle.None;
            }

            /// <summary>

            /// Indicates whether the specified context supports painting

            /// a representation of an object's value within the specified context.

            /// </summary>

            /// <param name="context">An ITypeDescriptorContext that

            /// can be used to gain additional context information.</param>

            /// <returns>true if PaintValue is implemented;

            /// otherwise, false.</returns>

            public override bool 
                   GetPaintValueSupported(ITypeDescriptorContext context)
            {
                return true;
            }

            /// <summary>

            /// Paints a representation of the value of an object

            /// using the specified PaintValueEventArgs.

            /// </summary>

            /// <param name="e">A PaintValueEventArgs that

            /// indicates what to paint and where to paint it.</param>

            public override void PaintValue(PaintValueEventArgs e)
            {
                if (e.Value != null)
                {
                    HatchStyle style = (HatchStyle)e.Value;
                    Rectangle bounds = e.Bounds;
                    Brush brush = new HatchBrush(style, 
                                  SystemColors.WindowText, SystemColors.Window);
                    try
                    {
                        GraphicsState state = e.Graphics.Save();
                        e.Graphics.RenderingOrigin = new Point(bounds.X, bounds.Y);
                        e.Graphics.FillRectangle(brush, bounds);
                        e.Graphics.Restore(state);
                    }
                    finally
                    {
                        brush.Dispose();
                    }
                }
            }

        }
    }
}

DashStylePicker: Represents a Windows picker box that displays DashStyle values.

//DashStylePicker.cs


using System;
using System.Collections;
using System.Text;
using System.Drawing;
using System.Drawing.Design;
using System.Drawing.Drawing2D;
using System.ComponentModel;

namespace Com.Windows.Forms
{
    /// <summary>

    /// Represents a Windows picker box that displays DashStyle values.

    /// </summary>

    public class DashStylePicker : PickerBase
    {
        /// <summary>

        /// Constructor

        /// </summary>

        public DashStylePicker()
            : base(typeof(DashStyle))
        {
            Value = DashStyle.Solid;
            Editor = new DashStyleEditor();
            TextEditable = false;
            PaintValueFrame = false;
            PaintValueWidth = 40;
        }

        /// <summary>

        /// Value

        /// </summary>

        public new DashStyle Value
        {
            get
            {
                return (DashStyle)base.Value;
            }
            set
            {
                base.Value = value;
            }
        }

        /// <summary>

        /// The UITypeEditor of DashStyle

        /// </summary>

        private class DashStyleEditor : UITypeEditor
        {
            /// <summary>

            /// Constructor

            /// </summary>

            public DashStyleEditor()
            {
            }
            
            /// <summary>

            /// Overloaded. Gets the editor style used by the EditValue method.

            /// </summary>

            /// <param name="context">An ITypeDescriptorContext that

            /// can be used to gain additional context information.</param>

            /// <returns>A UITypeEditorEditStyle value that indicates

            /// the style of editor used by the EditValue method.</returns>

            public override UITypeEditorEditStyle 
                   GetEditStyle(ITypeDescriptorContext context)
            {
                return UITypeEditorEditStyle.None;
            }

            /// <summary>

            /// Indicates whether the specified context supports painting

            /// a representation of an object's value within the specified context.

            /// </summary>

            /// <param name="context">An ITypeDescriptorContext

            ///   that can be used to gain additional

            ///   context information.</param>

            /// <returns>true if PaintValue is implemented;

            ///            otherwise, false.</returns>

            public override bool 
                   GetPaintValueSupported(ITypeDescriptorContext context)
            {
                return true;
            }

            /// <summary>

            /// Paints a representation of the value of an object

            /// using the specified PaintValueEventArgs.

            /// </summary>

            /// <param name="e">A PaintValueEventArgs that

            /// indicates what to paint and where to paint it.</param>

            public override void PaintValue(PaintValueEventArgs e)
            {
                if (e.Value != null)
                {
                    DashStyle style = (DashStyle)e.Value;
                    Rectangle bounds = e.Bounds;

                    int y = bounds.Y + bounds.Height / 2;
                    Point start = new Point(bounds.Left, y);
                    Point end = new Point(bounds.Right, y);

                    Pen pen = new Pen(SystemColors.WindowText);
                    pen.DashStyle = style;
                    pen.Width = 2;
                    Brush brush = new SolidBrush(SystemColors.Window);
                    try
                    {
                        GraphicsState state = e.Graphics.Save();
                        e.Graphics.FillRectangle(brush, bounds);
                        e.Graphics.DrawLine(pen, start, end);
                        e.Graphics.Restore(state);
                    }
                    finally
                    {
                        pen.Dispose();
                        brush.Dispose();
                    }
                }
            }

        }
    }
}

Using the ColorPicker, FontPicker, HatchStylePicker, and DashStylePicker

All these enhanced controls are easy to use, by dragging & dropping them onto the destination WinForm just like other Microsoft UI controls: TextBox or ComboBox, for instance.

The following code is generated by the Windows Forms Designer after being dragged onto Form1:

//HatchStylePicker.cs


namespace TestPicker
{
    partial class Form1
    {
        /// <summary>

        /// Required designer variable.

        /// </summary>

        private System.ComponentModel.IContainer components = null;

        /// <summary>

        /// Clean up any resources being used.

        /// </summary>

        /// <param name="disposing">true if managed resources

        /// should be disposed; otherwise, false.</param>

        protected override void Dispose(bool disposing)
        {
            if (disposing && (components != null))
            {
                components.Dispose();
            }
            base.Dispose(disposing);
        }

        #region Windows Form Designer generated code

        /// <summary>

        /// Required method for Designer support - do not modify

        /// the contents of this method with the code editor.

        /// </summary>

        private void InitializeComponent()
        {
            this.fontPicker1 = new Com.Windows.Forms.FontPicker();
            this.colorPicker1 = new Com.Windows.Forms.ColorPicker();
            this.hatchStylePicker1 = new Com.Windows.Forms.HatchStylePicker();
            this.dashStylePicker1 = new Com.Windows.Forms.DashStylePicker();
            this.SuspendLayout();
            // 

            // fontPicker1

            // 

            this.fontPicker1.BackColor = System.Drawing.SystemColors.Window;
            this.fontPicker1.ForeColor = System.Drawing.SystemColors.WindowText;
            this.fontPicker1.Location = new System.Drawing.Point(15, 15);
            this.fontPicker1.Name = "fontPicker1";
            this.fontPicker1.ReadOnly = false;
            this.fontPicker1.Size = new System.Drawing.Size(245, 21);
            this.fontPicker1.TabIndex = 0;
            this.fontPicker1.Text = "Microsoft Sans Serif, 8.25pt";
            this.fontPicker1.Value = new 
                 System.Drawing.Font("Microsoft Sans Serif", 8.25F);
            // 

            // colorPicker1

            // 

            this.colorPicker1.BackColor = System.Drawing.SystemColors.Window;
            this.colorPicker1.ForeColor = System.Drawing.SystemColors.WindowText;
            this.colorPicker1.Location = new System.Drawing.Point(15, 58);
            this.colorPicker1.Name = "colorPicker1";
            this.colorPicker1.ReadOnly = false;
            this.colorPicker1.Size = new System.Drawing.Size(245, 21);
            this.colorPicker1.TabIndex = 1;
            this.colorPicker1.Text = "White";
            this.colorPicker1.Value = System.Drawing.Color.White;
            // 

            // hatchStylePicker1

            // 

            this.hatchStylePicker1.BackColor = System.Drawing.SystemColors.Window;
            this.hatchStylePicker1.ForeColor = 
                 System.Drawing.SystemColors.WindowText;
            this.hatchStylePicker1.Location = new System.Drawing.Point(15, 107);
            this.hatchStylePicker1.Name = "hatchStylePicker1";
            this.hatchStylePicker1.ReadOnly = false;
            this.hatchStylePicker1.Size = new System.Drawing.Size(245, 21);
            this.hatchStylePicker1.TabIndex = 2;
            this.hatchStylePicker1.Text = "LargeGrid";
            this.hatchStylePicker1.Value = 
                 System.Drawing.Drawing2D.HatchStyle.LargeGrid;
            // 

            // dashStylePicker1

            // 

            this.dashStylePicker1.BackColor = System.Drawing.SystemColors.Window;
            this.dashStylePicker1.ForeColor = 
                 System.Drawing.SystemColors.WindowText;
            this.dashStylePicker1.Location = new System.Drawing.Point(15, 161);
            this.dashStylePicker1.Name = "dashStylePicker1";
            this.dashStylePicker1.ReadOnly = false;
            this.dashStylePicker1.Size = new System.Drawing.Size(245, 21);
            this.dashStylePicker1.TabIndex = 3;
            this.dashStylePicker1.Text = "Solid";
            this.dashStylePicker1.Value = 
                 System.Drawing.Drawing2D.DashStyle.Solid;
            // 

            // Form1

            // 

            this.AutoScaleDimensions = new System.Drawing.SizeF(7F, 15F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(341, 253);
            this.Controls.Add(this.dashStylePicker1);
            this.Controls.Add(this.hatchStylePicker1);
            this.Controls.Add(this.colorPicker1);
            this.Controls.Add(this.fontPicker1);
            this.Font = new System.Drawing.Font("Arial", 9F, 
                        System.Drawing.FontStyle.Regular, 
                        System.Drawing.GraphicsUnit.Point, ((byte)(0)));
            this.Name = "Form1";
            this.Text = "Form1";
            this.ResumeLayout(false);

        }

        #endregion

        private Com.Windows.Forms.FontPicker fontPicker1;
        private Com.Windows.Forms.ColorPicker colorPicker1;
        private Com.Windows.Forms.HatchStylePicker hatchStylePicker1;
        private Com.Windows.Forms.DashStylePicker dashStylePicker1;
    }
}

About the downloads

The code download supplied with the article contains the ColorPicker.sln solution consisting of two projects:

• Picker.csproj - the project implements the enhanced ColorPicker, FontPicker, HatchStylePicker, and DashStylePicker controls, and their base class PickerBase.
• TestPicker.csproj - ColorPicker, FontPicker, HatchStylePicker, and DashStylePicker sample programs written in C#.NET.

Please, don't forget to:

• Rebuild the solution (Build | Rebuild Solution) after you open it for the first time (this step will ensure that the ColorPicker, FontPicker ... controls will display correctly at design-time).

History

• Wednesday, July 05, 2006 - Initial release.