代码改变世界

.net 控件开发第二天 怎么将 第一天写的代码 用到 .net中来

2015-04-07 10:26  刘晶  阅读(296)  评论(0编辑  收藏  举报

   前面第一天 我们看到的全是 js的代码,虽然不管是BS的框架是java 还是 php,复用性 还是特别高的,  但是 写起来比较费劲,怎么办,我们能不能 更 简单点呢?

  当然可以,这个时候我们就要用到  .net的自定义控件 了。

 首先我们 将第一天的代码  回顾一下,(下面我们有了一个初始的改变)

//这里运用的面向对象的思想 ,新建了一个按钮对象 
var button = function () {  
            this.control = null;   //属性: 按钮对象的 自己
            this.id = null;          //按钮对象的 id
            this.value = null;    //按钮对象显示的值
            this.click = null;      //按钮对象的点击事件
            //接下来是初始化, 所有 按钮的属性
            this.init = function (ClientId) {
                this.id = ClientId;   //这个是页面传过来的id
              
                var button_html = '<div href="#"  id="button_'+this.id+'"  class="button" > ' + this.value + '</div>';  // 这个是我们要插入 的 html文件
                this.control.after(button_html);  

               this.control = $("#" + ClientId);  //这是通过 id绑定控件  (有关 需找 标签 都要写到 页面加载完 标签之后执行)
//绑定点击事件  14 $("#button_"+this.id+).unbind("click").bind("click",this.click); 15 this.control.hide(); //隐藏 当前控件 
};
}

  

首先我们建立一个 类库  Control  ,  然后在建立一个 建立一个 ControlBase (  这个类 是所有控件类的 父类) 

 public class ControlBase : WebControl    // 继承webControl   
    {
        /// <summary>
        /// 加载
        /// </summary>
        /// <param name="e"></param>
        protected override void OnLoad(EventArgs e)    // 重写  页面加载
        {
            base.OnLoad(e);
        }

        /// <summary>
        /// 为指定页面添加一个自定义控件,需要放在 if(!IsPostBack){ } 之外才行。
        /// </summary>
        /// <param name="page">页面</param>
        public static void AddWebcontrolBaseToPage(Page page)
        {
            for (int i = 0; i < page.Controls.Count; i++)
            {
                if (page.Controls[i] is ControlBase)
                {
                    return;
                }
            }
            ControlBase controlbase = new ControlBase();
            page.Controls.Add(controlbase);
        }

        /// <summary>
        /// 注册资源文件
        /// </summary>
        /// <param name="strLink">资源字符串</param>
        /// <param name="control">控件</param>
        public static void RegisterSource(string strLink, System.Web.UI.Control control)
        {
            //为了保证资源只注册一次,循环比较,已存在了就不添加
            bool flag = false;
            for (Int32 i = 0; i < control.Page.Header.Controls.Count; i++)
            {
                LiteralControl lc = control.Page.Header.Controls[i] as LiteralControl;
                if (lc != null)
                {
                    if (lc.Text == strLink)
                    {
                        flag = true;
                        break;
                    }
                }
            }
            if (!flag)
            {
                LiteralControl include = new LiteralControl(strLink);
                control.Page.Header.Controls.Add(include);
            }
        }

        /// <summary>
        /// 控件添加属性
        /// </summary>
        /// <param name="writer"></param>
        /// <param name="Name"></param>
        /// <param name="Value"></param>
        protected void AddAttributeToControl(HtmlTextWriter writer, string Name, string Value)
        {
            if (!string.IsNullOrEmpty(Value))
            {
                writer.AddAttribute(Name, Value);
            }
        }
    }

  然后 我们 在建立一个类 ,叫做 Button 的类,写法如下:

 

 public class Button : ControlBase
    {
        #region 属性
        /// <summary>
        /// 属性测试
        /// </summary>
        [DefaultValue(""), Description("获取或设置页面ID")]
        public string FormID
        {
            get;
            set;
        }

        /// <summary>
        /// 设置页面样式表
        /// </summary>
        public string Class     // 这些属性都会在 页面呈现出来   
        {
            get;
            set;
        }
        #endregion

        #region 重载方法
        /// <summary>
        /// 设置装载容器
        /// </summary>
        protected override HtmlTextWriterTag TagKey
        {
            get
            {
                return HtmlTextWriterTag.Div;
            }
        }

        /// <summary>
        /// 控件加载其他操作方法
        /// </summary>
        /// <param name="e"></param>
        protected override void OnLoad(EventArgs e)
        {
            base.OnLoad(e);
        }

        /// <summary>
        /// 输出控件前操作
        /// </summary>
        /// <param name="e"></param>
        protected override void OnPreRender(EventArgs e)
        {
            base.OnPreRender(e);
        }

        /// <summary>
        /// 输出控件
        /// </summary>
        /// <param name="writer"></param>
        protected override void Render(HtmlTextWriter writer)
        {
            base.Render(writer);
            if (this.Visible)
            {
                writer.WriteLine("<script type='text/javascript'>");
                writer.WriteLine("//<![CDATA[");
                string query = this.ClientID + "_ButtonGroup";
                writer.WriteLine("var " + query + "= new Button();");
                writer.WriteLine(query + ".Init('" + this.ClientID + "','加载数据')");
                writer.WriteLine("//]]>");
                writer.WriteLine("</script>");
            }
        }

        /// <summary>
        /// 控件中添加控件
        /// </summary>
        /// <param name="writer"></param>
        protected override void RenderContents(HtmlTextWriter writer)
        {
            base.RenderContents(writer);
        }

        /// <summary>
        /// 给控件添加属性
        /// </summary>
        /// <param name="writer"></param>
        protected override void AddAttributesToRender(HtmlTextWriter writer)
        {
            base.AddAttributesToRender(writer);
            writer.AddAttribute("class", "btn_container " + this.Class);
            if (!string.IsNullOrEmpty(this.FormID))
            {
                writer.AddAttribute("FormID", this.FormID);
            }
        }
        #endregion

        #region 自定义方法
        /// <summary>
        /// 获取组织数据
        /// </summary>
        /// <returns></returns>
        private void OtherMethod()
        {

        }
        #endregion
    }

  接下来 我们怎么将她们 用到前台呢?

  首先 我们要添加该项目的引用:  

   然后在配置文件中配置:

如下图所看到的一样:   

namespace  表示 添加引用的  项目的   命名空间的地址       如下图:Control 表示类库的名称
assembly  表示你需要添加的   引用的地址
tagPrefix  表示你添加 标签 名称:  

  

<pages controlRenderingCompatibilityVersion="3.5" clientIDMode="AutoID" validateRequest="false">
      <controls>
        <add namespace="Control" assembly="Control" tagPrefix="BaseControls"/>
      </controls>
    </pages>

  然后我们新建一个 web页面,重新生成一下,打开 工具箱就 可以看到你要的控件了。

  或者 直接 输入 <BaseControls:           就能看到你要写的自定义控件了   

 

  <BaseControls:Button  Class="2323" ID="2323" runat="server"/>