计算机新技术usercontrols论文.pdf

《计算机新技术usercontrols论文.pdf》由会员分享，可在线阅读，更多相关《计算机新技术usercontrols论文.pdf（12页珍藏版）》请在得力文库 - 分享文档赚钱的网站上搜索。

1、上海电力学院计算机新技术及应用论文题目：User controls简介与应用姓名：学号：班级：院系：专业：计算机科学与技术2012年 12 月 9 日2012 计算机新技术及应用第 2 页摘要当我们需要在多个地方使用一组控件的一些常用功能时，我们可以考虑采用自己的user controls。User controls可以将一系列控件的多种功能打包在一起，方便我们在各个网站的编写中重复调用。通过user controls可以实现多个页面对数据的重调用，能够实现无刷新的页面间导航等功能，在现行的网站设计中user controls有着其强大的用户可操作性，能够提供个性化的控件封装包，帮助实现多种网

2、页功能。关键字User control、自定义、封装控件、方便快捷、重调用、无刷新User control的背景及简介让我们想象这样一个场景，我们可能需要将一些数据表示在UI 上，我们需要将这些数据在多个布局外观不同的页面上进行表示，而这些页面上不同位置需要显示的数据可能有所区别。在这样的情况下我们可以选用 user control吗？答案是肯定的。为了在页面布局中灵活的运用这些控件实现数据的重用，我们需要做的就是建成一个user control的模板。User control 模板内封装了我们需要的数据，模板的各种实例可以在自定义页面布局中提供灵活的数据支持。有时user control 也

3、能提供我们自定义的默认显示方式。如何实现 user control的使用User control是一种简单的自定义控件，创建 user control就像创建 ASP.NET 网页一样简单，使用 visual studio的工具箱对其进行设计，在后台代码中对控件的属性和实现方法进行定义。然后这些控件就出现在你的 ASP.NET 页面中了，使用时只需调用共有成员的输入输出操作即可。所有的内部操作都被封装在控件中，对外部是不可见的。右击项目图标 添加新项 在选择模板时选择“Web 用户控件”。给其一有意义的名称，注意到该文件的后缀是“ascx”,而一般的Web 窗体的后缀是“aspx”。新创建的文

4、件源代码中仅有一行：这里用的是Control 指令，而不是Page指令。后台类的代码如下：using System;2012 计算机新技术及应用第 3 页using System.Data;using System.Configuration;using System.Collections;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.

5、UI.HtmlControls;public partial class WebControls_Address:System.Web.UI.UserControl protected void Page_Load(object sender,EventArgs e)自定义控件以WebControls_做前缀命名（后面的 Address是我们给出的文件名，或可认为是控件的名称）。继承自 System.Web.UI.UserControl 类。在设计视图中设计用户控件：用户控件一般是一些常规控件的有意义组合，或是对常规控件应用一些格式化（如应用 css 或 Theme）。所以在设计视图中，可使用

6、HTML 控件或服务端控件进行一些组合。在 Web 窗体设计中使用用户控件：工具箱中的控件我们可方便的拖拽到设计视图或源码中，但自定义的用户控件不会出现在工具箱中，我们可以直接把代表用户控件的.ascx 文件拖到设计视图中（非其他视图，一定是设计视图）。之后看Web窗体的源码，其中多出了两行代码:这是首部多出的注册指令，Src 指出自定义用户控件的位置。TagName 指出用户控件的名字。TagPrefix指出该控件的tag 前缀，这里是uc1，很容易猜想另一个自定义用户控件类的前缀可能为“uc2”。如果自定义用户控件被多个页面使用，为避免在每个页面中注册该控件，可以在配置文件中全局注册如：.

7、第二处多出的代码如：。该行代码相当简单，可到属性窗体中看一看用户控件的属性（这里只有五个）：（(ID),EndableTheming,EnableViewState,runat,V isible）2012 计算机新技术及应用第 4 页当然这是没有在自定义用户控件的后台类没有定义新的属性时的属性个数。当在代表用户控件的后台类定义中定义了新的属性时，用户控件在使用时，它的属性栏中会出现自定义的属性。用户控件是作为一个整体来使用的，欲访问用户控件只有通过其公共成员，如果没有在后台类中添加任何公共（public）成员，它仅向外部暴露很少的访问点。如果用户控件内部由一些标准控件组合而成，可把用户控件看做

8、是一个逻辑容器，它封装其组成部分，向外部隐藏其内部成员的公共访问接口。我们也可以提供到内部控件的访问路由，就像Gof 的门面设计模式的做法。如果你为自定义用户控件提供了公有的属性，则可在代表用户控件实例的Tag 元素中设定它的属性，也可在属性栏窗体中设定新提供的属性值。但在某些情况下，比如一个你设计了几个小时的麻烦页面，你不能破坏它非常复杂的页面布局。这时，可以定义其他的属性，例如改变控件的背景或前色属性。User control的优点及其应用实例实现多个页面对数据的调用让我们假设一个情景，我们需要持有一个人的名字、姓氏、年龄，在我们网站的多个地方都要对这些信息进行显示，而每次显示的布局可能有

9、所不同。User control模板的设计：我们需要做的第一件事是创建一个user control。一旦我们创建了user control，就必须为其提供一个placeholder控件进行存储。Placeholder控件正如其名字一样，可以提供一种默认的缺省继承，也可以为程序员提供自定义布局。在这个例子中，我们将创建一个person 类，其中包括人的姓氏、名字以及年龄public class PersonItem private string firstName;private string lastName;private int age;public PersonItem(string f

10、Name,string lName,int aGe)this.firstName=fName;this.lastName=lName;this.age=aGe;public string FirstName get return firstName;set firstName=value;public string LastName get return lastName;set lastName=value;public int Age get return age;set age=value;2012 计算机新技术及应用第 5 页接下来我们需要做的就是定义一个类Container clas

11、s，这个类被用作容器，可以容纳用户在自定义布局中可能用到的所有控件。定义 Container 类的主要目的是为了在自定义布局中提供FindControl 的功能。这样我们就可以以Container 类的名字来调用这个控件。这样我们就可以通过从控件类中继承这个类，来实现容器类的与外界的接口了。下面我们来创建这个类。public class PersonItemContainer:Control,INamingContainer private PersonItem person=null;public PersonItemContainer(PersonItem item)this.person

12、=item;public PersonItem Person get return person;set person=value;看看这个类，它包含person 对象的引用，但如何将这个类作为我们user control 的命名容器的那部分不是很明确。因此我们需要将这个类与刚刚创建的user control 连接起来。要做到这一点，我们要在user control的代码中创建一个ITemplate 类型的成员以及其公共性质。现在我们来看看完成了代码后植（code-behind）后的 user control，以了解完整的逻辑：public partial class TemplateUCtr

13、l:System.Web.UI.UserControl /the template control specific stuff private ITemplate personTemplate;/the controls data specific stuff private PersonItem personItem=null;protected void Page_Init(object sender,EventArgs e)/lets first clear the placeholders to attach then to new data this.phdPerson.Contr

14、ols.Clear();/but what if the user forgot to send the user information if(Person=null)phdPerson.Controls.Add(new LiteralControl(Please attach the control with a person object.);else /check if the templates are null we want to use simple literal/The user wants the default representation of the control

15、 if(PersonTemplate=null)/Lets show the default representation of the control phdPerson.Controls.Add(new LiteralControl(First Name:);phdPerson.Controls.Add(new LiteralControl(Person.FirstName);2012 计算机新技术及应用第 6 页phdPerson.Controls.Add(new LiteralControl();phdPerson.Controls.Add(new LiteralControl(Las

16、t Name:);phdPerson.Controls.Add(new LiteralControl(Person.LastName);phdPerson.Controls.Add(new LiteralControl();phdPerson.Controls.Add(new LiteralControl(Age:);phdPerson.Controls.Add(new LiteralControl(Person.Age.ToString();else PersonItemContainer container=new PersonItemContainer(this.Person);this

17、.PersonTemplate.InstantiateIn(container);phdPerson.Controls.Add(container);PersistenceMode(PersistenceMode.InnerProperty)TemplateContainer(typeof(PersonItemContainer)public ITemplate PersonTemplate get return personTemplate;set personTemplate=value;public PersonItem Person get return personItem;set

18、personItem=value;User control模板的使用让我们看看我们现在该如何使用这个user control。我们将user control 拖动到页面上，并在后台的代码中键入个人信息。protected void Page_PreInit(object sender,EventArgs e)PersonItem item=new PersonItem(one,two,23);TemplateUCtrl1.Person=item;这将在页面中以默认方式显示2012 计算机新技术及应用第 7 页如果用户未能提供个人信息怎么办。为了检查这个，我们拖动另外一个user control

19、 到页面上，并且不分配给他person 对象。因此我们使用了默认的user control。现在，如果我们想自定义user control 的布局结构，那么我们只要向 usercontrol 传递 PersonTemplate信息就可以做到这一点。2012 计算机新技术及应用第 8 页 Welcome Mr.Persons first Name:asp:TextBox ID=TextBox1 runat=server Text=Persons Last Name:asp:TextBox ID=TextBox2 runat=server Text=Persons Age:asp:TextBox

20、ID=TextBox3 runat=server Text=Give our best wishes to Mrs.后台代码如下：public partial class _Default:System.Web.UI.Page protected void Page_PreInit(object sender,EventArgs e)PersonItem item=new PersonItem(one,two,23);TemplateUCtrl1.Person=item;TemplateUCtrl2.Person=item;protected void Page_Load(object sen

21、der,EventArgs e)Page.DataBind();现在我们来运行这个应用：2012 计算机新技术及应用第 9 页实现无刷新的页面间导航页面间导航当然要刷新，这是无法避免的，但我们总不能把原本属于多个页面的逻辑塞在一个页面里吧，所以要想个办法把这些逻辑分开来。我们使用UserControl 来作为基本的视图单位，而不使用Page，这样改变加载的UserControl 也就改变了视图，相当于实现了导航，但 Page没变所以还是可以无刷新。然而怎么动态加载UserControl 呢？2012 计算机新技术及应用第 10 页这个控件只有一个属性需要关注，那就是ViewPanel.Virt

22、ualPath，你把UserControl 的路径（例如/UserControls/Sample.ascx）设置给它之后它就会自动帮你加载该UserControl。在运行过程中，如果你修改了这个属性，控件自己会通过ViewState 来保存该值，也就是一次修改永久有效，无论之后有多少次回送都没问题，直到你下一次再修改该值。要实现无刷新的视图间导航，你需要在UpdatePanel 中放置一个ViewPanel，之后不同的视图都使用UserControl 设计（其实设计起来和使用Page时差不多），通过 ViewPanel 动态加载这些UserControl 也就实现了无刷新的视图间导航了。下面这

23、个方案导航用的LinkButton 都在 UserControl 外面，所以要改变ViewPanel.VirtualPath 很容易。如果你的导航控件在UserControl 内，那就需要Page.FindControl 来找到ViewPanel 然后再改变其VirtualPath值，这个比较麻烦。可以动态加载UserControl的 ViewPanel控件（源码）using System;using System.Data;using System.Configuration;using System.Web;using System.Web.Security;using System.We

24、b.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;namespace CatChen.Cocollab.Web.UI.Controls public class ViewPanel:System.Web.UI.Control,System.Web.UI.INamingContainer private string _virtualPath;private Control _view;public string V irtu

25、alPath get return this._virtualPath;set string oldValue=this._virtualPath;this._virtualPath=value;if(this.Page!=null&value!=oldValue)this.ChildControlsCreated=false;this.EnsureChildControls();public Control View get return this._view;2012 计算机新技术及应用第 11 页protected override void OnInit(EventArgs e)bas

26、e.OnInit(e);if(!string.IsNullOrEmpty(this.VirtualPath)this.EnsureChildControls();protected override void LoadViewState(object savedState)Pair pair=savedState as Pair;if(pair!=null)base.LoadViewState(pair.First);this.VirtualPath=pair.Second as string;protected override void CreateChildControls()this.

27、Controls.Clear();if(string.IsNullOrEmpty(this.VirtualPath)return;if(this.Page=null)throw new Exception(V iewPanel.Page is null.);this._view=this.Page.LoadControl(this.VirtualPath);if(this._view=null)throw new Exception(V iewVirtualPath cannot be loaded.);this._view.ID=ucV iew;this.ClearChildState();

28、this.Controls.Add(this._view);protected override object SaveViewState()return new Pair(base.SaveViewState(),this.V irtualPath);总结当我们需要对一些常用功能进行重调用时，User controls 为我们提供了一个非常简单的方法，将这些常2012 计算机新技术及应用第 12 页用功能封装在一个控件中，并且允许用户对控件进行自定义布局，他的自定义特性使我们在不同的网页设计中都可以进行运用，这种“量身定做”的控件，不仅方便使用，而且更加美观和个性化。在当前的网页设计中，美观

29、的实用性是大家所追求的，user controls 在这方面正有着其强大的优势，相信他定能为我们的网页设计带来更多的帮助。实验心得通过这篇论文，我浏览了大量的网站资料，对user controls 有了一定的认识。知道了它的工作原理及优点特性，而通过网络牛人的经验分享，我对user controls 在网站设计中的实际应用也有了一些认识和体悟。由于技术较新，而且属于比较细节的技术，网络文献并不很多，且多以英文为主，所以文中多处为自己的拙译成果，多有不当之处，但实属心血得物。在设计网站时，我们应该多关注现在的新技术，因新技术的存在和成长一定是用户需求之所在，也一定是发展之所趋，更是便捷之所在。运

30、用新技术可以使我们的的网页更加个性、美观，使网页的设计也更加便捷简单，还能带给我们新的程序思路，这都有益于我们在计算机领域中能力的发展和成长。参考文献A Beginners Tutorial for Understanding Templated User Controlsfrom http:/ simple ASP.NET Web TabStrip User Control from http:/ User Control:File Browserfrom http:/ User Controls 用户控件 from http:/ Forms User Controls from http:/ User Controls from http:/