Custom controls introduction, Creation and usage in asp.net project

A best friend of mine recently requested me to create a post for "Custom Controls creation and use in asp.net " with example and detailed explanation , so today I am going to talk a bit about custom controls which leads to a practical example of how to create a custom control and how to use it in your asp.net project.
First lets have little introduction of custom controls :

"Custom controls are individual assemblies, compiled into a dynamic link library (DLL) and used as any other ASP.Net server control", we can create them by :

1.  deriving from the base control class ( today's example )
2. driving from one existing control ( extending functionality of existing one )
3.  combing two or more existing controls ( combination of more than one existing controls )

Today we have example of first type , we are going to create a custom label , the functionality of this label is that , when we set its text , it will validate if the assigned text is a valid email or not and change its color and append message as prefix like this in screen shot :

Now lets see how to create an asp.net custom control first :

• Open visual studio , go to File->New->Project
• Select Web projects and select Asp.net Server Control project
• Name it , lets say CustomLabelControl
• When you create project , you will have ServerControl1.cs class inherited from WebControl class, this is every thing for your custom control.
• There will be a method " protected override void RenderContents( HtmlTextWriter output)", which is key , that is how your control will response to you visually , just copy and replace the following code with it :         

     protected override void RenderContents( HtmlTextWriter output)

        {

            if (!String.IsNullOrEmpty(this.Text))

            {

                if (this.IsValidEmailAddress())

                {

                    output.Write("This is a valid email : ");

                    output.Write("<FONT size=5 color=Blue>");

                    output.Write("<B>");

                    output.Write(Text);

                    output.Write("</B>");

                    output.Write("</FONT>");

                }

                else

                {

                    output.Write("This is not a valid email : ");

                    output.Write("<FONT size=5 color=red>");

                    output.Write("<B>");

                    output.Write(Text);

                    output.Write("</B>");

                    output.Write("</FONT>");

                }

            }

            else

            {

                output.Write("<FONT size=5 color=red>");

                output.Write("<B>");

                output.Write("Must enter something to validate!");

                output.Write("</B>");

                output.Write("</FONT>");

            }

        }

It is using IsValidEmailAddress() method which can be defined in the same class as :

   protected bool IsValidEmailAddress( )

        {

            try

            {

                // this is use for time saving, not optimal solution , but you can replace it with regular expression

                MailAddress m = new MailAddress(this.Text);

                return true;

            }

            catch (FormatException)

            {

                return false;

            }

        }

• And that's all , your custom control is ready to use , now build your project.

Now second part starts from here , i.e how to use this control in your asp.net project, simple three step process :

• Add reference of this control ( project dll ) to your asp.net project where you want to use it.
• Register the control on the page where you want to use it , just directly below the @page directive like that :

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="CustomControlTest._Default" %>

<%@ Register Assembly="CustomLabelControl"  Namespace="CustomLabelControl" TagPrefix="ccs" %>

• Add control to your page like this :                                                                               <ccs:ServerControl1 runat="server" ID="ServerControl11" Text = "" />
• Now just set the text of this control , behind any event , lets say on button click,                     protected void Button1_Click(object sender, EventArgs e)

        {

            this.ServerControl11.Text = this.TextBox1.Text;

        }

And this control will be automatically say if this is a proper email address or not.

Sample solution project with custom control project and its use in asp.net project is attached here :    CustomControl Project.