第7章 用户控件和自定义控件

第7章用户控件和自定义控件学习目的与要求除在ASP.NET网页中使用Web服务器控件外，还可以使用用于创建ASP.NET网页的相同技术创建可重复使用的自定义控件，这些控件称作用户控件。学习目的与要求本章即将讲解用户控件和自定义控件的开发和使用。通过本章的学习你将能够：u了解用户控件的相关概念。u掌握如何将Web窗体转换成用户控件。u掌握创建和使用用户控件的方法。u学会如何开发简单的自定义控件。理解复合自定义控件开发的方法。u了解用户控件和自定义控件的联系和区别。本章主要内容用户控件：包括什么是用户控件和如何创建用户控件。将Web窗体转换成用户控件。自定义控件的开发。用户控件和自定义控件的异同。7.1用户控件用户控件是一种复合控件，工作原理非常类似于ASP.NET网页。可以向用户控件添加现有的Web服务器控件和标记，并定义控件的属性和方法。然后可以将控件嵌入ASP.NET网页中充当一个单元。7.1.1用户控件概述用户控件使开发人员能够根据应用程序的需求，方便的定义和编写控件。开发所使用的编程技术将与编写Web窗体的技术相同，只要开发人员对控件进行修改，就可以将使用该控件的页面的所有控件都进行更改。7.1.1用户控件概述用户控件与ASP.NET网页有以下区别：u（1）用户控件的文件扩展名为.ascx。u（2）用户控件中没有@Page指令，而是包含@Control指令，该指令对配置及其他属性进行定义。u（3）用户控件不能作为独立文件运行。而必须像处理任何控件一样，将它们添加到ASP.NET页中。u（4）用户控件中没有html、body或form元素。这些元素必须位于宿主页中。7.1.2将Web窗体页转换为用户控件1．将单文件ASP.NET网页转换为用户控件将单文件ASP.NET网页转换为用户控件的步骤如下：u（1）重命名控件使其文件扩展名为.ascx。u（2）从该页面中移除html、body和form元素。u（3）将@Page指令更改为@Control指令。u（4）移除@Control指令中除Language、AutoEventWireup（如果存在）、CodeFile和Inherits之外的所有特性。u（5）在@Control指令中包含className特性。这允许将用户控件添加到页面时对其进行强类型化。7.1.2将Web窗体页转换为用户控件2．将代码隐藏ASP.NET网页转换为用户控件将代码隐藏ASP.NET网页转换为用户控件的步骤如下：u（1）重命名.aspx文件，使其文件扩展名为.ascx。u（2）根据代码隐藏文件使用的编程语言，重命名代码隐藏文件使其文件扩展名为.ascx.vb或.ascx.cs。u（3）打开代码隐藏文件并将该文件继承的类从Page更改为UserControl。u（4）针对每个.aspx文件，按照将单文件ASP.NET网页转换为用户控件的步骤操作。u（5）在@Control指令中包含className特性。这允许将用户控件添加到页面时对其进行强类型化。7.1.2将Web窗体页转换为用户控件3．将Web窗体转换成用户控件首先，需要删除body、html、head等标记。对于Web窗体，其标记方式的代码参见webPage.aspx页面文件。而对于用户控件，声明代码参见webPageUserControl.ascx文件。7.1.3用户控件的开发1．建立用户控件在VisualStudio2008中，首先打开或新建一个网站项目，新建用户控件。7.1.3用户控件的开发用户控件创建完毕后，会生成一个WebUserControl1.ascx页面，然后它将在设计器中打开。用户控件创建完成后，.ascx页面的代码如下所示。u%@ControlLanguage=C#AutoEventWireup=trueuCodeBehind=WebUserControl1.ascx.csInherits=WebApp7_1.WebUserControl1%7.1.3用户控件的开发2．完善用户控件ASP.NET用户控件能够封装一个单元中多个子控件的功能。用户控件由一个或多个ASP.NET服务器控件（Button控件、TextBox控件等）以及控件执行功能所需的任何代码组成。用户控件还可以包括自定义属性或方法，这些属性或方法向容器（通常为ASP.NET页）显示用户控件的功能。用户控件实例编写一个用作选择器控件的ASP.NET用户控件。u首先向新用户控件添加2个列表控件3个按钮控件，并对控件的布局和相关属性进行修改和设置。u界面布局如图7-4所示u当界面布局完毕后，就需要为用户控件编写事件。u接着，需要在网站中创建一个Web窗体。u切换到新页面HostUserControl.aspx的“设计”视图中，将用户控件文件（WebUserControl1.ascx）拖动到页面上。源代码参见HostUserControl.aspx，和WebUserControl1.ascx文件用户控件实例将用户控件放置到页面上将会在页面中创建两个新元素：（1）页面的顶部是一个新的@Register指令，示例代码如下所示：u%@Registersrc=~/WebUserControl1.ascxtagname=WebUserControl1utagprefix=“uc1”%//声明控件引用（2）第二个新元素是用户控件的元素，示例代码如下所示：uuc1:WebUserControl1ID=“WebUserControl11”runat=“server”///使用用户控件用户控件实例运行HostUserControl.aspx页面，如图7-5所示。7.2自定义控件用户控件能够执行很多操作。并实现一些功能，但是在复杂的环境下，用户控件并不能够达到开发人员的要求，是因为用户控件大部分都是使用现有的控件进行组装，编写事件来达到目的。于是，ASP.NET允许开发人员编写自定义控件实现复杂的功能。7.2.1简单的自定义控件自定义控件是编写的一个类，此类从Control或WebControl派生。Control类提供了将其放在Page类的控件树中的基本功能。自定义控件需要定义一个直接或间接从Control类派生的类，并重写Render方法。WebControl类将功能添加到基本的控件类，用于在客户端计算机上显示可视的内容。例如可以使用WebControl类以控制外观和样式通过诸如字体、颜色和高度等属性。简单自定义控件实例首先，需要创建一个自定义控件ServerControl1。简单自定义控件实例自定义控件创建完成后，会自动生成一个类和相应的方法，用户能够在源代码中编写属性，示例代码如下所示。uprivateintnoOfTimes;upublicintNoOfTimes//编写属性u{uget{returnthis.noOfTimes;}//获取属性uset{this.noOfTimes=value;}//设置属性u}简单自定义控件实例然后，开发人员可以在源代码中编写和添加属性。当需要呈现给HTML页面输出时，只需要重写Render方法即可。接着，需要将自定义控件编译成DLL文件。还需要打开现有的或创建一个新的ASP.NETWeb应用程序项目。在该webApp7-2项目中添加自定义控件的引用。单击【确定】按钮完成引用的添加后，就可以在页面中使用此自定义控件。若需要在页面中需要使用此自定义控件，同样与用户控件一样需要在头部声明自定义控件，示例代码如下所示。u%@RegisterTagPrefix=MyControlNamespace=ServerControl1uAssembly=ServerControl1%简单自定义控件实例自定义注册完毕后，在工具栏中也会呈现自定义控件，如图7-11所示。就可以直接拖动自定义控件到页面，并且配置相应的属性简单自定义控件实例用户拖动自定义页面到控件后，页面会生成相应的自定义控件的HTML代码如下所示。uformid=form1runat=serverudivuMyControl:ServerControl1ID=ServerControl11runat=server/u/divu/form详细源代码参见ServerControl1的ServerControl1.cs文件，项目WebApp7-2中的Default.aspx文件7.2.2复合自定义控件最常见的复杂功能控件就是SqlDataSource控件。SqlDataSource控件是数据源控件，通过SqlDataSource控件能够配置数据源，并且实现分页、插入、删除等功能。复合自定义控件就类似这样一个功能复杂的控件。7.2.2复合自定义控件编写复合自定义控件有以下几种方式：u（1）创建用户控件，并使用用户控件封装的用户界面实现复合控件。u（2）开发一个编译控件，封装一个按钮控件和文本框控件，通过重写Render方法呈现。u（3）从现有的控件中派生出新控件。u（4）从基本控件类之一派生来创建自定义控件。复合自定义控件实例下面介绍一个自定义的用户登录控件的创建和使用。该控件可以通过几个TextBox控件和Button控件来实现当用户进行网站访问时，网站希望用户能够注册和登录到网站从而提高网站的用户粘度、提升访问量。复合自定义控件实例首先，需要创建一个自定义控件，在自定义控件中添加相应的服务器控件（子控件），声明一个事件。完成对控件和事件的声明，可以利用类的构造方法完成登录控件的初始化和布局处理。接着，就需要进行属性的编写。u配置ForeColor等属性，重写Render方法，编写登录事件将自定义控件Login编译成DLL文件复合自定义控件实例最后，需要在WebApp7-2项目中为自定义控件【添加引用】，并将该控件拖到Web页面Default.aspx中。u可通过自定义控件的属性实现控件的属性做相应的配置，如图7-13所示。u运行界面如图7-14所示。源代码参见Login服务项目的LoginCtrl.cs文件，以及WebApp7-2项目的Default.aspx文件复合自定义控件实例7.3用户控件和自定义控件比较对比用户控件和自定义控件，很多人或认为用户控件更加容易开发，而自定义控件的门槛较高，不方便应用程序的开发。通常用户控件在一个项目中经常使用，而自定义控件用来在通用的程序中使用，当网站应用程序开发中，导航控件如果使用用户控件实现，是非常方便的。但是通过自定义控件实现，可能并不能适合所有的应用场合，当需要适应其他场合时，可能需要重新开发和编译。7.3用户控件和自定义控件比较用户控件和自定义控件区别如表7-2所示AscentWeb医药商务系统应用实例参见教材本章总结用户控件的应用始终贯彻着一个高级的设计思想,即“模块化设计，模块化应用”的原则。本章着重讲解了.NET中代码复用的相关内容，即用户控件和自定义控件。本章通过一些实例详细介绍了用户控件和自定义控件的开发步骤，以及界面、属性和事件的编写过程。通过本章的学习，读者可以更好地掌握ASP.NET用户控件、如何创建用户控件和自定义控件的开发和使用方法，对以后网站的开发和制作都有很大的帮助。