Click here to Skip to main content
11,639,178 members (64,681 online)
Click here to Skip to main content

Writing your Custom Control: step by step

, 31 Mar 2002 613.9K 16.1K 223
Rate this:
Please Sign up or sign in to vote.
Making a cute button of two semi-transparent user-changeble colors
<!-- Download Links --> <!-- Article image -->

Sample Image - cuteButton.jpg

<!-- Add the rest of your HTML here -->

Introduction

This is a short and simple demonstration of .NET framework's capability of creating custom controls.

Here I'm going to make a custom control and then, test my control in a Windows application. I have implemented some custom properties for my control, so you can learn how it is done in C#.

Building the Control

  1. Open the Visual Studio and start a new project. Your project must be based on the Windows Control Library template. Call your project ctlCuteButton and click OK.

  2. Once you have your project open, delete the UserControl from the project. Just remove it because the 'User Control' is not exactly what we need here.

  3. Now go to the 'Project' menu: Project->Add User Control... and select the Custom Control template there. 'Custom Control' is what we need in this case. You may call it cuteButton. Now click OK. A new Custom control has been added to your project.

  4. The first thing we must do here is to change the base class of the cuteButton:

    Override the following line:

    public class cuteButton : System.Windows.Forms.Control

    by this one:

    public class cuteButton : System.Windows.Forms.Button

    Now your control is based on the System.Windows.Forms.Button class.

  5. Now let's create some custom properties for our control. This is done by inserting the following code inside the cuteButton class:

    private Color m_color1 = Color.LightGreen;  //first color
    private Color m_color2 = Color.DarkBlue;   // second color
    private int m_color1Transparent = 64; // transparency degree 
                                          // (applies to the 1st color)
    private int m_color2Transparent = 64; // transparency degree 
                                          //  (applies to the 2nd color)
    
    public Color cuteColor1
    {
        get { return m_color1; }
        set { m_color1 = value; Invalidate(); }
    }
    
    public Color cuteColor2
    {
        get { return m_color2; }
        set { m_color2 = value; Invalidate(); }
    }
    
    public int cuteTransparent1
    {
        get { return m_color1Transparent; }
        set { m_color1Transparent = value; Invalidate(); }
    }
    
    public int cuteTransparent2
    {
        get { return m_color2Transparent; }
        set { m_color2Transparent = value; Invalidate(); }
    }

    The Invalidate() methoid is used to refresh the design view and all controls inside (the tip from Tom Welch).

  6. And the last thing to do before compiling our control is to override the Paint event. So let's do it:

    // Calling the base class OnPaint
    base.OnPaint(pe);
    // Create two semi-transparent colors
    Color c1 = Color.FromArgb(m_color1Transparent , m_color1);
    Color c2 = Color.FromArgb(m_color2Transparent , m_color2);
    Brush b = new System.Drawing.Drawing2D.LinearGradientBrush(ClientRectangle, 
                                                               c1, c2, 10);
    pe.Graphics.FillRectangle (b, ClientRectangle);
    b.Dispose();
  7. Now you may compile the control by pressing <Ctrl>+<Shift>+<B>.

Here is the complete contents of cuteButton.cs file (just in case…):

COMPLETE CODE:

using System;
using System.Collections;
using System.ComponentModel;
using System.Drawing;
using System.Data;
using System.Windows.Forms;


namespace ctlCuteButton
{
    /// <summary>
    /// Summary description for cuteButton.
    /// </summary>

    public class cuteButton : System.Windows.Forms.Button
    {
    private Color m_color1 = Color.LightGreen; // first color
    private Color m_color2 = Color.DarkBlue;  // second color
    private int m_color1Transparent = 64; // transparency degree 
                                             // (applies to the 1st color)
    private int m_color2Transparent = 64; // transparency degree 
                                          //  (applies to the 2nd color)

    public Color cuteColor1
    {
        get { return m_color1; }
        set { m_color1 = value; Invalidate(); }
    }

    public Color cuteColor2
    {
        get { return m_color2; }
        set { m_color2 = value; Invalidate(); }
    }

    public int cuteTransparent1
    {
        get { return m_color1Transparent; }
        set { m_color1Transparent = value; Invalidate(); }
    }

    public int cuteTransparent2
    {
        get { return m_color2Transparent; }
        set { m_color2Transparent = value; Invalidate(); }
    }


    public cuteButton()
    {
    }


    protected override void OnPaint(PaintEventArgs pe)
    {
        // Calling the base class OnPaint
        base.OnPaint(pe);
        // Create two semi-transparent colors
        Color c1 = Color.FromArgb
            (m_color1Transparent , m_color1);
        Color c2 = Color.FromArgb
            (m_color2Transparent , m_color2);
        Brush b = new System.Drawing.Drawing2D.LinearGradientBrush
            (ClientRectangle, c1, c2, 10);
        pe.Graphics.FillRectangle (b, ClientRectangle);
        b.Dispose();
    }
}
}

Testing the Control

  1. Open a new instance of the VS .NET. Create a new project choosing the Windows Application template.

  2. From a new Windows Forms project, we can add the compiled custom control to the toolbox. I do this by right-clicking the toolbox, selecting Customize Toolbox, and from the .NET Framework Components tab, clicking Browse and locating the Control Library DLL # (in our case, ctlCuteButton\bin\debug\cuteButton.dll). The component cuteButton will then appear in the Toolbox.

    You can play a bit changing it’s properties (cuteColor1, cuteColor2, cuteTransparent1, cuteTransparent2).

That’s all so far about building and using custom controls.

Good Luck.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Share

About the Author

Alexandr_K
Software Developer (Senior)
Canada Canada
No Biography provided

You may also be interested in...

Comments and Discussions

 
QuestionCustomControlFor Listbox Pin
namrata kongutte19-May-15 21:11
membernamrata kongutte19-May-15 21:11 
QuestionCan not drag and drop Custom Control in window form VS2010 Pin
SaurabhSoni29-Mar-14 5:06
memberSaurabhSoni29-Mar-14 5:06 
QuestionCustom Control in C#.Net Pin
Ammar alzubairy11-Jun-13 4:50
memberAmmar alzubairy11-Jun-13 4:50 
GeneralMy vote of 2 Pin
Lagkip4-Jun-13 9:22
memberLagkip4-Jun-13 9:22 
GeneralMy vote of 5 Pin
batime3-Dec-12 0:07
memberbatime3-Dec-12 0:07 
QuestionJust a question Pin
Grumbscut27-Nov-12 22:12
memberGrumbscut27-Nov-12 22:12 
AnswerRe: Just a question Pin
Grumbscut28-Nov-12 2:26
memberGrumbscut28-Nov-12 2:26 
Question5 stars Pin
Isuru Nanayakkara21-Nov-12 0:38
memberIsuru Nanayakkara21-Nov-12 0:38 
GeneralMy vote of 5 Pin
amish kumar2-Nov-12 21:03
memberamish kumar2-Nov-12 21:03 
GeneralMy vote of 5 Pin
avidela17-Oct-12 11:48
memberavidela17-Oct-12 11:48 
SuggestionA very useful easy to understand step by step guide to create custom control in visual studio with snap-shots Pin
KrishanGahlot30-Sep-12 18:37
memberKrishanGahlot30-Sep-12 18:37 
Questionexcellence Pin
daghune3-Sep-12 23:30
memberdaghune3-Sep-12 23:30 
GeneralMy vote of 2 Pin
daghune3-Sep-12 23:14
memberdaghune3-Sep-12 23:14 
GeneralRe: My vote of 2 Pin
amirmohamad3-Sep-12 23:30
memberamirmohamad3-Sep-12 23:30 
GeneralRe: My vote of 2 Pin
daghune3-Sep-12 23:32
memberdaghune3-Sep-12 23:32 
it is not your business baby gaga
shut down youreself before i do that
GeneralRe: My vote of 2 Pin
amirmohamad3-Sep-12 23:33
memberamirmohamad3-Sep-12 23:33 
GeneralRe: My vote of 2 Pin
daghune3-Sep-12 23:34
memberdaghune3-Sep-12 23:34 
GeneralArsefuckr Pin
bartjuh1027-Dec-12 10:03
memberbartjuh1027-Dec-12 10:03 
Questiongreat article Pin
Wrangly10-Jan-12 22:15
memberWrangly10-Jan-12 22:15 
QuestionSuper Pin
Member 84713099-Dec-11 2:48
memberMember 84713099-Dec-11 2:48 
GeneralMy vote of 5 Pin
GuyThiebaut29-Oct-11 6:21
memberGuyThiebaut29-Oct-11 6:21 
GeneralMy vote of 4 Pin
Member 772135016-Apr-11 0:50
memberMember 772135016-Apr-11 0:50 
GeneralGood Job Pin
RockingDownTheHighway9-Feb-11 16:36
memberRockingDownTheHighway9-Feb-11 16:36 
QuestionIs it PRO version required? Pin
BogdanJankowski1-Mar-10 4:27
memberBogdanJankowski1-Mar-10 4:27 
QuestionHow to anchor a custom control? Pin
ChanHwiHwang10-Nov-09 17:01
memberChanHwiHwang10-Nov-09 17:01 
GeneralThanks Pin
rutstyle20-Jun-09 0:09
memberrutstyle20-Jun-09 0:09 
AnswerWindows Forms Control Library =~ Windows Control Library, also a partial class error Pin
dblanchard17-Mar-09 15:00
memberdblanchard17-Mar-09 15:00 
General3Ks Pin
whatcsu3-Aug-08 13:14
memberwhatcsu3-Aug-08 13:14 
GeneralThanks Pin
Laurent Cozic2-Aug-08 9:10
memberLaurent Cozic2-Aug-08 9:10 
QuestionInclude control during runtime Pin
Vagga Raghavendra10-Aug-07 20:06
memberVagga Raghavendra10-Aug-07 20:06 
GeneralLoad custom control dynamically Pin
VINH TRAN20-Jul-07 12:11
memberVINH TRAN20-Jul-07 12:11 
GeneralNice... Pin
ESTANNY13-Jul-07 13:41
memberESTANNY13-Jul-07 13:41 
GeneralThanks! Just what I needed Pin
halciber10-Apr-07 9:36
memberhalciber10-Apr-07 9:36 
GeneralTransparent control Pin
arijit_datta268-Mar-07 20:38
memberarijit_datta268-Mar-07 20:38 
GeneralMany thx! Pin
flyingchen10-Feb-07 19:21
memberflyingchen10-Feb-07 19:21 
Generalvery good Pin
Zhi Chen1-Feb-07 15:33
memberZhi Chen1-Feb-07 15:33 
Questioncustom control on window ce Pin
buithelan31-Jan-07 15:57
memberbuithelan31-Jan-07 15:57 
QuestionTo make Scrollable Contextmenustrip Pin
jeyaseelanmca5-Dec-06 17:31
memberjeyaseelanmca5-Dec-06 17:31 
QuestionHow lock to change the font and colour Pin
Nata;19-Jun-06 23:58
memberNata;19-Jun-06 23:58 
GeneralDoes not work for textbox Pin
monal12315-May-06 20:59
membermonal12315-May-06 20:59 
QuestionInstaller for your new control. Pin
Bertus Kruger15-Mar-06 12:10
memberBertus Kruger15-Mar-06 12:10 
Generalusing UserControl for application webform Pin
onebitcuongdv7-Dec-05 0:32
memberonebitcuongdv7-Dec-05 0:32 
Generalgreat job Pin
bmustata19-Feb-05 9:10
memberbmustata19-Feb-05 9:10 
Generalcustomer controls Pin
abidkayani13-Jan-05 10:40
memberabidkayani13-Jan-05 10:40 
GeneralUsing standard control on ToolBar Pin
jimsleon7-Jul-04 19:12
memberjimsleon7-Jul-04 19:12 
QuestionCan I change the Back Color of a Toolbar Control Pin
Qumer Mumtaz Goraya18-May-04 20:32
sussQumer Mumtaz Goraya18-May-04 20:32 
Generalgreat job Pin
vishwa_3120-Apr-04 13:04
membervishwa_3120-Apr-04 13:04 
Generalself contained code Pin
BoudewijnL23-Nov-03 20:40
memberBoudewijnL23-Nov-03 20:40 
GeneralRe: self contained code Pin
Charlie Williams7-Dec-03 15:48
memberCharlie Williams7-Dec-03 15:48 
QuestionCustom Control in SAME project!? Pin
omoshima14-Jul-03 17:18
memberomoshima14-Jul-03 17:18 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.150728.1 | Last Updated 1 Apr 2002
Article Copyright 2002 by Alexandr_K
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid