The Grouper: Custom Groupbox Control

The Grouper is a special groupbox control that is rounded and fully customizable. The control can paint borders, drop shadows, gradient and solid backgrounds, custom text, and custom icons. The purpose of this control was to design a better looking groupbox winform control. I used the Keep it Simple Stupid philosophy to design a tightly knitted re-useable control that I hope you all enjoy. This control is still in beta version, but it seems to be stable.

Terms and Conditions For Use, Copy, Distribution, and Modification

THIS CODE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS “AS IS” AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS CODE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

Using the Code

Before you add the control, you must add a reference (CodeVendor.Controls) to your project.

using CodeVendor.Controls;

The grouper control can be added to your project with the following code. Add this code to your class:

private CodeVendor.Controls.Grouper Grouper1;
this.Grouper1 = new CodeVendor.Controls.Grouper();

Custom Control Properties

Below is a list of grouper control properties that change the physical appearance of the control.

Control Properties






























Property Name Type Description
BackColor Color Paints the background color of the control.
BackgroundColor Color Changes the group control color. This color also can be used in combination with BackgroundGradientColor for a gradient paint.
BackgroundGradientColor Color Use in combination with BackgroundColor to create a gradient background.
BackgroundGradientMode GroupBoxGradientMode Turns on background gradient painting.
BorderColor Color This feature will allow you to change the color of the control’s border.
BorderThickness Float Sets the control’s border size.
CustomGroupBoxColor Color Paints the group title background to the specified color if PaintGroupBox is set to true.
GroupImage Image Adds a 16 x 16 image to the group title bar.
GroupTitle string Adds a group title to the control.
PaintGroupBox bool Paints the group title background to the CustomGroupBoxColor.
RoundCorners int Rounds the corners of the control.
ShadowColor Color Changes the control’s shadow color.
ShadowControl bool Turns on control shadowing.
ShadowThickness int Changes the size of the shadow border.

Grouper Source Code

I started writing this control because I was tired of the plain old Windows groupbox. My winform application groupbox needed an updated XP look with round edges and gradient backgrounds. Like most developers writing controls, I thought to myself, “Should I custom draw the original groupbox control or re-invent the wheel and start from the ground up?” I chose to re-invent the wheel.

Re-inventing the wheel gave me the power to draw the control without flicker and customize it to my preferences. Taking the time to make a control from the ground up seems long and futile, but having the satisfaction of knowing that I wrote the code and if anything breaks it’s because of something I wrote and not someone else’s is fully worth it.

To start designing the control, I had to figure out how the original groupbox acts as a container for other controls during design mode. Following is the code to turn any control into a design-time container control.

[Designer("System.Windows.Forms.Design.ParentControlDesigner,
           System.Design", typeof(IDesigner))]

This code must be added on top of your class as an attribute to your control, like so:

[Designer("System.Windows.Forms.Design.ParentControlDesigner,
           System.Design", typeof(IDesigner))]
public class Grouper : System.Windows.Forms.UserControl { }

Once the attribute is added your control, the control will now automatically turn into a Design-Time Control Container. WOW! Very easy and self contained; Microsoft sure does think of everything. The URL I found for this resource is:

http://support.microsoft.com/default.aspx?scid=kb;en-us;813450

Since that took hardly any time at all to add such power to my control, I decided to invest more time into where the original groupbox left off, which was the design.

More by Author

Must Read