基础温习(三) 开发ASP.NET控件基础

如果日常都是做同以类型的应用,而开发使用的都是些成熟的框架和控件,日子久了,人就容易变得麻木,慢慢忘记了这些框架和控件的当初到底是怎么来的 T_T

很快就要接受新领域的开发了,今天趁着闲时温习一下开发ASP.NET控件基础.认真的把那些用到的命名空间下边的类和方法,还有元数据好好的细看了一遍,找回了当初一点感觉 :)

基本的步骤是:
1.自己"画"出控件的HTML原码
2.继承System.Web.UI.Control类,覆写Render方法,输出HTML
3.编写控件的事件

今天做个小Demo,就是纯有样子的Demo,主要熟悉一下输出,事件还没有编写 :)

编写完控件,要在项目中使用,也很简单
1.在项目中加上控件库的引用,如果是在同一个解决方案中,会自动加上
2.在调用的页面中注册,如:

<%@ Register Assembly="CustomWebControl" Namespace="CustomWebControl" TagPrefix="customControl" %>

3.然后就可以使用自定义的标签进行调用了,如

<customControl:PersonInfoForm 
            ID="PersonInfoForm1" 
            runat="server" 
            PersonBirthdayText='出生日期:'
            PersonNameText='姓名:' 
            PersonNickNameText='昵称:' 
            PersonSexText='性别:' 
            SubmitButtonText='提交' /> 

当然,如果你加了引用后,工具箱就会自动添加上那个控件让你调用,如图:

直接拖拉到页面中,VS也会替你写上那些注册代码的,不过为了保持代码风格统一,还是自己操刀好一点咯 :)

控件Demo代码:

PersonInForm.cs#region PersonInForm.cs

/**//***********************************************************************
* 文件名:            PersonInForm.cs
* 功能:            编写控件PersonInForm的类

* 创建时间:            2007-10-24
* 创建人:            清风
* 最后修改时间:        2007-10-24
* 最后修改人:        清风
***********************************************************************/

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CustomWebControl
...{
    [DefaultProperty("PersonInfoFormText")]
    [ToolboxData(@"<{0}:PersonInfoForm 
        PersonNameText='姓名:'
        PersonNickNameText='昵称:'
        PersonSexText='性别:'
        PersonBirthdayText='出生日期:'
        SubmitButtonText = '提交'
        runat=server></{0}:PersonInfoForm>")]
    public class PersonInfoForm : WebControl
    ...{

        private string personNameText = "姓名:";

        [Browsable(true)]
        [Category("Appearance")]
        [DefaultValue("姓名:")]
        [Description("获取或者设置用户的姓名")]
        public string PersonNameText
        ...{
            get ...{ return ViewState["PersonNameText"] != null ? (string)ViewState["PersonNameText"] : "姓名:"; }
            set ...{ ViewState["PersonNameText"] = value; }
        }


        private string personNickNameText = "昵称:";

        [Browsable(true)]
        [Category("Appearance")]
        [DefaultValue("昵称:")]
        [Description("获取或者设置用户的昵称")]
        public string PersonNickNameText
        ...{
            get ...{ return ViewState["PersonNickNameText"] != null ? (string)ViewState["PersonNickNameText"] : "昵称:"; }
            set ...{ ViewState["PersonNickNameText"] = value; }
        }

        private string personSexText = "性别:";

        [Browsable(true)]
        [Category("Appearance")]
        [DefaultValue("性别:")]
        [Description("获取或者设置用户的性别")]
        public string PersonSexText
        ...{
            get ...{ return ViewState["PersonSexText"] != null ? (string)ViewState["PersonSexText"] : "性别:"; }
            set ...{ ViewState["PersonSexText"] = value; }
        }

        private string personBirthdayText = "出生日期:";

        [Browsable(true)]
        [Category("Appearance")]
        [DefaultValue("出生日期:")]
        [Description("获取或者设置用户的出生日期")]
        public string PersonBirthdayText
        ...{
            get ...{ return ViewState["PersonBirthdayText"] != null ? (string)ViewState["PersonBirthdayText"] : "出生日期:"; }
            set ...{ ViewState["PersonBirthdayText"] = value; }
        }

        private string submitButtonText = "提交";

        [Browsable(true)]
        [Category("Appearance")]
        [DefaultValue("提交")]
        [Description("获取或者设置提交按钮的文字")]
        public string SubmitButtonText
        ...{
            get ...{ return ViewState["SubmitButtonText"] != null ? (string)ViewState["SubmitButtonText"] : "提交"; }
            set ...{ ViewState["SubmitButtonText"] = value; }
        }

        protected override void Render(HtmlTextWriter writer)
        ...{
            要输出的HTML代码#region 要输出的HTML代码
            //<table style="width: 48%;height: 133px;">

            //<tr>
            //<td>姓名:</td>
            //<td ><input id="PersonName" type="text" /></td>
            //</tr>

            //<tr>
            //<td>昵称:</td>
            //<td ><input id="PersonNickName" type="text" /></td>
            //</tr>

            //<tr>
            //<td>性别:</td>
            //<td ><input id="PersonSex" type="text" /></td>
            //</tr>

            //<tr>
            //<td>出生日期:</td>
            //<td >
            //<select id="PersonBirthdayYearSelect" name="D1">
            //<option></option>
            //</select>年
            //<select id="PersonBirthdayMonthSelect" name="D2">
            //<option></option>
            //</select>月
            //</td>
            //</tr>

            //<tr>
            //<td colspan="2">
            //<input id="SubmitButton" type="button" value="提交" /></td>
            //</tr>

            //</table> 
            #endregion

            writer.Write("<table style='width: 48%;height: 133px;'>");
            
            writer.Write("<tr>");
            writer.Write("<td>" + PersonNameText + "</td>");
            writer.Write("<td ><input id='PersonName' type='text' /></td>");
            writer.Write("</tr>");

            
            writer.Write("<tr>");
            writer.Write("<td>" + PersonNickNameText + "</td>");
            writer.Write("<td ><input id='PersonNickName' type='text' /></td>");
            writer.Write("</tr>");

            writer.Write("<tr>");
            writer.Write("<td>" + PersonSexText + "</td>");
            writer.Write("<td ><input id='PersonSex' type='text' /></td>");
            writer.Write("</tr>");

            writer.Write("<tr>");
            writer.Write("<td>" + PersonBirthdayText + "</td>");
            writer.Write("<td >");
            writer.Write("<select id='PersonBirthdayYearSelect' name='PersonBirthdayYearSelect'>");
            for (int year = 1950; year < 2007; year++)
            ...{
                writer.Write("<option value='" + year.ToString() + "'>" + year.ToString() + "</option>");
            }
            writer.Write("</select>年");
            writer.Write("<select id='PersonBirthdayMonthSelect' name='PersonBirthdayMonthSelect'>");
            for (int month = 1; month < 13; month++)
            ...{
                if (month < 10)
                    writer.Write("<option value='" + month.ToString() + "'>" + "0" + month.ToString() + "</option>");
                else
                    writer.Write("<option value='" + month.ToString() + "'>" + month.ToString() + "</option>");
            }
            writer.Write("</select>月");
            writer.Write("</td>");
            writer.Write("</tr>");

            writer.Write("<tr>");
            writer.Write("<td colspan='2'>");
            writer.Write("<input id='SubmitButton' type='button' value=" + SubmitButtonText + " /></td>");
            writer.Write("</tr>");

            writer.Write("</table>");
            

            base.Render(writer);
        }

    }
}

#endregion

控件界面: