|
一年前，当本人拿到一个名叫TWIG的PHP程序时，立即被作者OOP编程思想所折服，很难想像TWIG中所有的功能（行事历、邮件、个性化）均在一个PHP文件(index.php3)中执行完成，这就得益于作者采用了程序代码与页面构架分离的思想，但是我也看到尽管作者做了很大的努力，但由于PHP的局限性，程序并没有真正做到代码与构架的分离，index.php3这个主文件由于要执行的功能太多，所以其require的模块文件相当之多，至使整个文件依然显得十分零乱，本人愚昧，当时花了半个月的时间，才真正明白程序的构架，分析代码之苦，无人能知啊(黯然泪下......)。
TWIG程序对我此后的编程有着很大的影响，但是即使这样的作品，依然没有摆脱程序代码与HTML代码混杂的局面。
程序代码与页面构架的分离是WEB程序员多年的梦想。在ASP.Net出现之前，无论是ASP、PHP还是JSP，程序代码与HTML代码都是混杂在一起的，这种做法，虽然在WEB技术初期受到赞扬，但是随着时间的的推移，它的弊端是越来越明显，当程序代码很长时，HTML代码与其混杂，程序的可读性变得很差，让人无法分清程序真正要表示的页面构架。
而新技术ASP.Net则通过Codebehind、用户控件(User Control)以及自定义控件(Custom Control)等方法真正做到了代码的分离。这是一个了不起的进步，大家可以在本文中看到分离代码后的ASP.Net程序的结构是多么的清晰。
飞刀借此地向大家演示一下它们的具体实现方法，我们先看看要实现的功能。
为了便于理解，这里设计的页面比较简单，页面分为三个主要的部分，头部包含一个AdRotator控件(用于显示广告)与一个Label控件(用于显示当前广告链接地址)；中部是一个登陆页面，包括两个TextBox控件(分别用于输入用户名与密码)、一个Label控件(显示登陆是否成功)与一个Button控件(作为提交按钮)；底部包含两个Label控件(分别显示当前用户名与用户权限)。
熟悉ASP.Net的朋友，马上就会意识到头部由于使用了AdRotator控件，所以必定存在OnAdCreated事件以便在Label控件显示相应链接；而中部由于使用Button控件做为提交按钮，所以必定有一个OnClick事件处理。
1 CodeBehind
首先我们就看看如何使用CodeBehind方法来实现代码与页面构架的分离，下面给出的源程序是主ASP.Net程序--Example1.aspx：
<% @ Page Src="cs\EventHandle.cs" Inherits="Aspcn" %>
<html>
<head>
<title></title>
</head>
<body>
<form runat="server">
<asp:Panel id="Header" runat="server">
<asp:AdRotator id="ad" AdvertisementFile="AdBanners\ad.xml" BorderWidth="0" OnAdCreated="AdCreated" runat="server" /><br>
当前广告链接：<asp:Label id="lblAdText" ForeColor="red" runat="server" />
</asp:Panel>
<asp:Panel id="Logon" runat="server">
<table>
<tr><td colspan="2" align="center"><b>登陆窗口</b></td></tr>
<tr><td colspan="2" align="center"><asp:Label id="lblMsgShow" ForeColor="red" runat="server" /></td></tr>
<tr><td>用户名：</td><td><asp:TextBox id="tbUserName" runat="server" /></td></tr>
<tr><td>密码：</td><td><asp:TextBox id="tbPasswd" TextMode="Password" runat="server" /></td></tr>
<tr><td><asp:Button id="btnSubmit" Text="登陆" OnClick="Submit_Click" runat="server" /></td></tr>
</table>
</asp:Panel>
<asp:Panel id="Footer" runat="server">
用户名：<asp:Label id="lblUserName" Font-Name="Arial" ForeColor="red" Text="游客" runat="server" />
权限：<asp:Label id="lblPurview" Font-Name="Arial" Text="无" ForeColor="red" runat="server" />
</asp:Panel>
</form>
</body>
</html>
例程中，大家可以清楚地看到程序中不包含任何C#、VB、JavaScript来处理OnAdCreated与OnClick事件，但是执行本程序，程序能够正常使用(如图2-1与图2-2)。这便是使用CodeBehinde的结果，事件处理已经被转移到其它程序中定义执行。请大家注意本例中第一行的信息：
<% @ Page Src="cs\EventHandle.cs" Inherits="Aspcn" %>
一般在ASP.Net程序中，Page指令都在设定本程序应当使用什么语言(使用Language属性)，而本例中没有出现Language属性，而是出现了两个新的Page属性：Src与Inherits。Src属性设定事件处理真正的代码位置，Inherits属性则设定需要引入的类名。可以看到本例中定义事件处理的文件是EventHandle.cs，我们来看看它的具体内容：
using System;
using System.Data;
using System.Data.SqlClient;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
public class Aspcn : Page
{
//声明Web Form中出现的控件
public Label lblAdText,lblUserName,lblPurview,lblMsgShow;
public TextBox tbUserName,tbPasswd;
public Button btnSubmit;
public AdRotator ad;
private string strConnString = "server=(local)\\Feidao;database=aspcn;Trusted_Connection=yes";
//处理Adrotator控件建立事件
public void AdCreated(Object src,AdCreatedEventArgs e)
{
lblAdText.Text = e.AlternateText;
}
public void Submit_Click(Object sender,EventArgs e)
{
SqlConnection MyConn = new SqlConnection(strConnString);
MyConn.Open();
string strUserName,strPassword,strSelect;
strUserName = tbUserName.Text;
strPassword = tbPasswd.Text;
strSelect = "select * from bbs_user where id='"+strUserName+"' and password='"+strPassword+"'";
SqlCommand MyComm = new SqlCommand(strSelect,MyConn);
SqlDataReader dr = MyComm.ExecuteReader();
if(dr.Read())
{
//登陆成功
lblMsgShow.Text = "登陆成功";
lblUserName.Text = dr["id"].ToString();
lblPurview.Text = dr["purview"].ToString();
}
else
{
//登陆不成功
lblMsgShow.Text = "登陆不成功";
}
dr.Close();
MyConn.Close();
}
}
进行事件处理是定义在一个类中的(本例中是Aspcn，注意大小写)，由于需要与Web Forms相关联，所以此类还必须继承Page类。
分析程序，大家可以看到程序中对事件的处理操作是与普通的未进行代码分离的程序是一样的，并没有什么特别的地方。(本人在程序中已经给出的相关注释，相信对大家理解程序有所帮助)
使用CodeBehind技术后，大家需要多写一些代码，比如声明控件等，也许大家很不喜欢多写这样的代码，但是大家也必须看到使用了CodeBehind技术后，主程序的可读性大大增加了。在Example1.aspx中相信大家很快就可以区分页面构架的各个部分，大家想想这些构架如果在其它技术是否能看得如此清楚？
(这里的程序只做演示用，呵呵，大家可不要抓我什么引号漏洞这些小辫子哟)
2 用户控件(UserControl)
CodeBehind技术真正实现了代码与构架的分离，比以前的技术前进了一大步，但是它的缺陷也是显而易见的，比如主页面中部那个登陆区，如果内容很多，HTML显示代码的依然会占用很大的区域，程序的可读性依然会降低。
ASP.Net也提供了解决办法，这就是用户控件。
用户控件我们可以将其视为不用编译的Server控件。即然是控件，那么就肯定会遵从控件的使用方法。我们将Example1.aspx中的每个Panel整体看成为一个控件，因此Example1.aspx的主体部分通过使用用户控件便可以减少为只有三行：
<% @ Register TagPrefix="aspcn" TagName="Header" Src="UserControls/Header.ascx" %>
<% @ Register TagPrefix="aspcn" TagName="Logon" Src="UserControls/Logon.ascx" %>
<% @ Register TagPrefix="aspcn" TagName="Footer" Src="UserControls/Footer.ascx" %>
<html>
<head>
<title></title>
</head>
<body>
<form runat="server">
<aspcn:Header id="MyHeader" runat="server" />
<aspcn:Logon id="MyLogon" runat="server" />
<aspcn:Footer id="MyFooter" runat="server" />
</form>
</body>
</html>
执行这个程序，其运行结果与使用CodeBehind技术的结果是一样的，但是现在的ASP.Net程序更加容易区分页面构架了。
<aspcn:Header id="MyHeader" runat="server" />
<aspcn:Logon id="MyLogon" runat="server" />
<aspcn:Footer id="MyFooter" runat="server" />
这三行代码，使用了三个用户控件，这么少的代码大家一眼就可以清楚的看到页面被分为三个部分。
要使用用户控件就必须使用Register指令，TagPrefix属性定义是的一个Namespace的名字，以保证它在这个页面的唯一性;TagName属性是在定义一个类(class)的别名，由于用户控件执行时是被CLR编译成为类来执行的，所以就必须给本程序中每个用户控件一个唯一的名字，以便于大家区分；Src属性则是具体指出了使用的用户控件的文件名(用户控件均以.ascx结尾)。
用户控件的使用与普通Server控件一样：
<namespace:class ... runat="server" />
namespace表示定义的命名空间，class则是相应的类名，具体的使用例子有：
<aspcn:Logon id="MyLogon" runat="server" />
下面是用户控件显示程序中所使用的用户控件的具体内容：
Header.ascx(Header用户控件)
<Script Language="C#" Runat="Server">
private void AdCreated(Object src,AdCreatedEventArgs e)
{
lblAdText.Text = e.AlternateText;
}
</script>
<asp:AdRotator id="ad" AdvertisementFile="..\AdBanners\ad.xml" BorderWidth="0" OnAdCreated="AdCreated" runat="server" /><br>
当前广告链接：<asp:Label id="lblAdText" ForeColor="red" runat="server" />
Logon.ascx(Logon用户控件)
<% @ Import Namespace="System.Data" %>
<% @ Import Namespace="System.Data.SqlClient" %>
<Script Language="C#" Runat="Server">
protected string strConnString = "server=(local)\\Feidao;database=aspcn;Trusted_Connection=yes";
//定义UserControl的属性
public string UserName
{
get
{
return tbUserName.Text;
}
set
{
tbUserName.Text = value;
}
}
public string Password
{
get
{
return tbPasswd.Text;
}
set
{
tbPasswd.Text = value;
}
}
//事件处理
private void Submit_Click(Object sender,EventArgs e)
{
SqlConnection MyConn = new SqlConnection(strConnString);
MyConn.Open();
string strUserName,strPassword,strSelect;
strUserName = tbUserName.Text;
strPassword = tbPasswd.Text;
strSelect = "select * from bbs_user where id='"+strUserName+"' and password='"+strPassword+"'";
SqlCommand MyComm = new SqlCommand(strSelect,MyConn);
SqlDataReader dr = MyComm.ExecuteReader();
if(dr.Read())
{
//登陆成功
lblMsgShow.Text = "登陆成功";
Session["UserName"] = dr["id"].ToString();
Session["Purview"] = dr["purview"].ToString();
}
else
{
//登陆不成功
lblMsgShow.Text = "登陆不成功";
}
dr.Close();
MyConn.Close();
}
</script>
<table>
<tr><td colspan="2" align="center"><b>登陆窗口</b></td></tr>
<tr><td colspan="2" align="center"><asp:Label id="lblMsgShow" ForeColor="red" runat="server" /></td></tr>
<tr><td>用户名：</td><td><asp:TextBox id="tbUserName" runat="server" /></td></tr>
<tr><td>密码：</td><td><asp:TextBox id="tbPasswd" TextMode="Password" runat="server" /></td></tr>
<tr><td><asp:Button id="btnSubmit" Text="登陆" OnClick="Submit_Click" runat="server" /></td></tr>
</table>
Footer.ascx(Footer用户控件)
<Script Language="C#" Runat="Server">
private void Page_Load(Object src,EventArgs e)
{
if(Session["UserName"]!=null)
{
lblUserName.Text = (string)Session["UserName"];
lblPurview.Text = (string)Session["Purview"];
}
}
</script>
用户名：<asp:Label id="lblUserName" Font-Name="Arial" ForeColor="red" Text="游客" runat="server" />
权限：<asp:Label id="lblPurview" Font-Name="Arial" Text="无" ForeColor="red" runat="server" />
每个控件包含有自已的显示代码以及相应的程序代码。
我们可以将一些常用的功能制作成为固定的用户控件，当需要时，我们就可直接拿来使用，而不需要使用烦人的Crtl+C，Ctrl+V来"复制"、"粘贴"长长的一大堆代码。
用户控件不仅做到了程序代码与页面构架的分离，而且还增加了代码重用性。
3 自定义控件(Custom Control)
用户控件是很不错的选择，但是由于每个用户控件都是一个ascx文件，当这些控件很多时，它们的使用就显得比较零乱。此时我们便想可不可以将一些比较相似的控件整合起来，在程序中只需要引用一次，便全部搞定。这是个很不错的想法，我们把这个想法说得更加专业一些："将多个类(class)导入同一个命名空间(namespace)"。呵呵，怎么样，这句话是不是有点有耳熟？大家快去查一查Server控件的定义，是不是发现这句话是...
我们下面就要接触如何写Server控件。编写Server控件并不是一件轻松容易的事情，需要对.Net平台有比较深的了解，适合于高级用户，因此这里本人也不会具体描述Server控件的编写步骤(要细细讲这个，非得写书不可)。请大家比较一下自定义控件源代码与用户控件的区别,作一些大致的了解：
using System;
using System.Data;
using System.Data.SqlClient;
using System.Drawing;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace aspcn
{
//首先是Header
public class Header:Control,INamingContainer
{
private AdRotator ad;
private Label lblAdText;
protected override void CreateChildControls()
{
//加入AdRotator广告控件
ad = new AdRotator();
ad.AdvertisementFile = "AdBanners/ad.xml";
ad.BorderWidth = 0;
ad.AdCreated += new AdCreatedEventHandler(this.OnAdCreated);
this.Controls.Add(ad);
this.Controls.Add(new LiteralControl("<br>"+"当前广告链接为："));
//加入Label控件
lblAdText = new Label();
lblAdText.ForeColor = Color.Red;
this.Controls.Add(lblAdText);
}
private void OnAdCreated(Object sender,AdCreatedEventArgs e)
{
this.lblAdText.Text = e.AlternateText;
}
}
//接着是Logon
public class Logon : Control,INamingContainer
{
private string strConnString = "server=(local)\\Feidao;database=aspcn;Trusted_Connection=yes";
private Label lblMsgShow;
private TextBox tbUserName,tbPasswd;
public String UserName
{
get
{
return tbUserName.Text;
}
set
{
tbUserName.Text = value;
}
}
protected override void CreateChildControls()
{
//添加HTML标签
this.Controls.Add(new LiteralControl("<table><tr><td colspan=\"2\" align=\"center\"><b>登陆窗口</b></td></tr> <tr><td colspan=\"2\" align=\"center\">"));
//添加MsgShow Label控件
lblMsgShow = new Label();
lblMsgShow.ForeColor = Color.Red;
this.Controls.Add(lblMsgShow);
this.Controls.Add(new LiteralControl("</td></tr><tr><td>用户名：</td><td>"));
//添加UserName与Passwd TextBox控件
tbUserName = new TextBox();
this.Controls.Add(tbUserName);
this.Controls.Add(new LiteralControl("</td></tr><tr><td>密码：</td><td>"));
tbPasswd = new TextBox();
tbPasswd.TextMode = TextBoxMode.Password;
this.Controls.Add(tbPasswd);
this.Controls.Add(new LiteralControl("</td></tr><tr><td>"));
//添加BtnSubmit Button控件
Button btnSubmit = new Button();
btnSubmit.Text = "登陆";
btnSubmit.Click += new EventHandler(this.Submit_Click);
this.Controls.Add(btnSubmit);
this.Controls.Add(new LiteralControl("</td></tr></table>"));
}
//显示完毕
private void Submit_Click(Object sender,EventArgs e)
{
SqlConnection MyConn = new SqlConnection(strConnString);
MyConn.Open();
string strUserName,strPassword,strSelect;
strUserName = tbUserName.Text;
strPassword = tbPasswd.Text;
strSelect = "select * from bbs_user where id='"+strUserName+"' and password='"+strPassword+"'";
SqlCommand MyComm = new SqlCommand(strSelect,MyConn);
SqlDataReader dr = MyComm.ExecuteReader();
if(dr.Read())
{
//登陆成功
this.lblMsgShow.Text = "登陆成功";
}
else
{
//登陆不成功
this.lblMsgShow.Text = "登陆不成功";
}
dr.Close();
MyConn.Close();
}
}
//最后是Footer
public class Footer : Control,INamingContainer
{
private string _UserName,_Purview;
public string UserName
{
get
{
return _UserName;
}
set
{
_UserName = value;
}
}
public string Purview
{
get
{
return _Purview;
}
set
{
_Purview = value;
}
}
public Footer()
{
_UserName = "游客";
_Purview = "无";
}
protected override void CreateChildControls()
{
this.Controls.Add(new LiteralControl("用户名："));
Label lblUserName = new Label();
lblUserName.ForeColor = Color.Red;
lblUserName.Font.Name = "Arial";
lblUserName.Text = this.UserName;
this.Controls.Add(lblUserName);
//this.Controls.Add(new LiteralControl("nbsp;"));
this.Controls.Add(new LiteralControl("权限："));
Label lblPurview = new Label();
lblPurview.ForeColor = Color.Red;
lblPurview.Font.Name = "Arial";
lblPurview.Text = this.Purview;
this.Controls.Add(lblPurview);
}
}
}
上面和程序是将需要实现的功能，全部导入了自定义控件。程序中可以看到，在aspcn命名空间中包含三个类(Header,Logon,Footer)，这三个类正是构架三个主体部分。
要使用自定义控件，还必须将原代码进行编译。
csc /t:library /out:aspcn.dll /r:System.Data.dll,System.Web.dll,System.Drawing.dll CustomControls.cs
C#程序编译指令的用法，本人在此也不再重复。需要注意的是编译的文件名，必须与控件中namespace的名字一致。
编译后的dll，仍然不能使用，我们必须将其放到.Net平台中最著名的目录--/bin中,bin目录(如果不存在，可以自行建立)存放的是当前虚拟目录中所有使用自定义控件以及组件，CLR在执行ASP.Net程序时会自动搜索此目录中的文件，以找到与ASP.Net程序相匹配的Namespace、Class 以及Assembly。
当我们将程序编译好的aspcn.dll放入/bin目录后，这个自己编写的Server控件便可以使用了。
(需要声明一下，由于编写Server控件时不能使用Session等变量，以至无法做到两个class之间的通信，因此在缺省状态下Footer控件并不能像前面的程序一样随Session内容发生改变，不过可以通过普通操作Server控件的方法来操作相应的属性达到相同的效果，此处为节约版面，未采用)
下面再来看看主体Web Form的程序内容：
<% @ Register TagPrefix="aspcn" Namespace="aspcn" Assembly="aspcn" %>
<html>
<head>
<title></title>
</head>
<body>
<form runat="server">
<aspcn:Header id="MyHeader" runat="server" />
<aspcn:Logon id="MyLogon" runat="server" />
<aspcn:Footer id="MyFooter" runat="server" />
</form>
</body>
</html>
怎么样，相当简单明了吧。
引用我们自定义的控件，也相当简洁，只需将Register指令的TagPrefix、Namespace、Assembly属性全部设定为aspcn。
至此，ASP.Net中三种代码与页面构架分离的方法已经介绍完毕。
三种方法各有优劣，本人比较倾向于使用用户控件与CodeBinde技术结合使用，因为他们均不需要编译，相对来说更容易使用，如果您要保护你的代码，自定义控件则当然是您最佳的选择。
希望本文对您的编程有所帮助。
|
