事情的起因（纯粹为了增强文章的趣味性）
我对电影一向不感冒，最近网上、电视上《十面埋伏》的广告和评论扑天盖地，加上张艺谋在中央电视台还搞了个晚会，专门宣传该影片，不免也蠢蠢欲动起来。我没有去电影院看电影的习惯，所以如果网上有就到网上看了。恰巧一日QQ聊天时，一个群里的会员发了个链接，说是可以下载《十面埋伏》，我试了一下，果然，速度还不错，有70多K的速度，100多M的东东很快就下完了（是不是我特别容易满足？）。可是效果不太好，颜色基本上没有了，像过去的黑白电影，还不清晰，不过免费的东西就这样了，将就一下啦。
看了十几分钟，终于看不下去了，都是打打杀杀，三个主要人物都出场了，没有帅哥也没有美女，看得我头晕眼花直打盹。为了防止见周公，鼠标在我手里不安份起来，我用的播放器是为了看这个电影刚下载的realplay10的，这可是头一次见，以前都用8.0的，界面没新版的好看（虽然我并不觉得好看，笨笨的），所以想看看有些什么功能，最后，我打开了下面的界面：
咦，我一看那个蓝色的背景挺有趣的啊，“名称”标签和文件框组合成一个复合控件，背景颜色还可以变化，有点创意，效果也不错，那我也做一个啊，哈哈，有时候一个想法就是这样无意中产生的。
基础知识
在ASP.net中做一个复合控件不是很难了，但是如果是刚刚接触的话，可能还是需要指点一下方向，所以不妨在这里啰嗦一下，高手们莫怪。
Javascript：当今最流行的客户端脚本语言，如果要做出特效来他最有能耐。
CSS：级联样式表，用于设置元素的样式。
DHTML：动态HTML，和浏览器交互会用到。
System.Web.UI.WebControls.WebControl：在ASP.NET中自定义控件的基类，我们可能会重写他的一些方法，常用的有：
CreateChildControls（）：给予控件创建内定子控件的机会，预设情况OnPreRender（）方法会调用此方法要求该控件创建其子控件，别一种情况则是由FindControl（）方法调用。
OnPreRender()：触发PreRender事件，在绘制控件之前发生。
Render()：绘制控件。
AddAttributesToRender()：向标签中添加HTML样式或属性。
另外，还有一个方法：EnsureChildControls（），该方法用于确定服务器控控件是否包含子控件，如果不包含，则创建子控件，在设计阶段起作用。
其他的慢慢去看啦，这几个是我们的例子中会用到的。
最终效果
先看看效果，这样心中才有明确的目标。
没有任何鼠标动作 鼠标移到控件上 鼠标移出后还原
怎么样？效果挺炫吧？（我在自夸呢）
跟我一步一步来
现在，请听我的指令：喜欢这个效果的站左边，不喜欢这个效果或者极为不屑的站右边。好了，右边的朋友请关闭您的浏览器继续您喜欢的网上之旅，左边的朋友请跟我来：
1、 我们先完成效果部分，也就是编写javascript脚本。我的方法是写一个HTML文件，试验脚本的正确性：
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<TITLE></TITLE>
<script language=javascript>
var OldColor;
function mouseover(ctrl,color)
{
OldColor = ctrl.style.backgroundColor;
ctrl.style.color = "#ffffff";
ctrl.style.backgroundColor = color;
}
function mouseout(ctrl)
{
ctrl.style.backgroundColor = OldColor;
ctrl.style.color = "#000000";
}
</script>
</HEAD>
<BODY>
<table border="0" style="font-size:9pt" onmouseover="mouseover(this,'#ff0044')" onmouseout="mouseout(this)">
<tr >
<td><span>姓名:</span></td><td><input name="_ctl2" type="text" /></td>
</tr>
</table>
</BODY>
</HTML>
新建一个文本文件，将这段代码复制过去，然后将文件的扩展名改为.html，用IE打开，是不是看到了想要的效果？
2、 前期工作准备完成了，接下来打开VS.NET IDE，新建一个项目，选择Visual C#项目（别问我要VB.net的代码，我不会），在右边列表中选择“WEB控件库”，输入项目名称：LabelTextBox。
3、 把自动生成的代码删除，只留下一个类的框架，像下面这样（命名空间自定）：
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
using System.Drawing;
namespace LzhTextBpx
{
public class LabelTextbox : System.Web.UI.WebControls.WebControl
{
}
}
4、 上面看到的效果其实是一个一行两列的表格，我们把表格的border属性设成0，所以看不出来了，其中左边单元格放标签，右边单元格放文本框，所以，我们要用代码生成这个表格。用到的类有：
a) Table：表示表格
b) TableRow：表示表格行
c) TableCell：表示表格中的单元格
注意：一个表格可以有多个表格行，一个表格行中可以放置多个单元格
生成代码如下：
//定义一个表对象
Table t = new Table();
//添加一行
TableRow tr = new TableRow();
//添加两个单元格
TableCell tc1 = new TableCell();
TableCell tc2 = new TableCell();
//将控件添加到Controls集中.
tc1.Controls.Add(label);
tc2.Controls.Add(textBox);
tr.Controls.Add(tc1);
tr.Controls.Add(tc2);
t.Controls.Add(tr);
this.Controls.Add(t);
我们还要响应表格的鼠标移入移出事件，背景色的变化就是在这里触发的，下面的代码完成此事：
//添加鼠标事件
t.Attributes.Add("onmouseover","mouseover(this,'" + "#" + R + G + B + "')");
t.Attributes.Add("onmouseout","mouseout(this)");
Attributes表示表格的属性集，Add()方法用于添加一个新的属性。
顺便把表格中的字体也设置一下：
//添加样式,用来控制字体
t.Style.Add("font-size","10pt");
看到上面的R、G、B三个变量了吗？这三个变量是某种颜色的十六进制的字符串表示。使用如下的方法对颜色进行分解：
//以下将颜色值转化成十六进制表示
string R,G,B;
R = (Convert.ToInt32(this._backgroundColor.R)).ToString("X");
G = (Convert.ToInt32(this._backgroundColor.G)).ToString("X");
B = (Convert.ToInt32(this._backgroundColor.B)).ToString("X");
其中_backgroundColor是自定义属性。
这一步的全部代码如下：
private void CreateControls()//创建控件以及设置控件的相关属性
{
//以下将颜色值转化成十六进制表示
string R,G,B;
R = (Convert.ToInt32(this._backgroundColor.R)).ToString("X");
G = (Convert.ToInt32(this._backgroundColor.G)).ToString("X");
B = (Convert.ToInt32(this._backgroundColor.B)).ToString("X");
//定义一个表对象
Table t = new Table();
//添加鼠标事件
t.Attributes.Add("onmouseover","ltmouseover(this,'" + "#" + R + G + B + "')");
t.Attributes.Add("onmouseout","ltmouseout(this)");
//添加样式,用来控制字体
t.Style.Add("font-size","10pt");
//添加一行
TableRow tr = new TableRow();
//添加两个单元格
TableCell tc1 = new TableCell();
TableCell tc2 = new TableCell();
//将控件添加到Controls集中.
tc1.Controls.Add(label);
tc2.Controls.Add(textBox);
tr.Controls.Add(tc1);
tr.Controls.Add(tc2);
t.Controls.Add(tr);
this.Controls.Add(t);
}
5、 本控件向外提供了三个属性，backgroundColor 表示鼠标移入控件的背景颜色，labelString 为标签内文本，textString 为文本框内容。定义如下：
private Label label = new Label();//创建一个标签
private TextBox textBox = new TextBox();//创建一个文本框
private Color _backgroundColor;//鼠标移入的背景颜色
public Color backgroundColor
{
get
{
if(_backgroundColor == Color.Empty)
return Color.Blue;
return _backgroundColor;
}
set
{
_backgroundColor = value;
}
}
public string labelString
{
get
{
return label.Text;
}
set
{
label.Text = value;
}
}
public string textString
{
get
{
return textBox.Text;
}
set
{
textBox.Text = value;
}
}
6、 这一步需要重写 CreateChildControls() 方法，该方法会自动被调用，用来生成子控件。
protected override void CreateChildControls()
{
this.EnsureChildControls();//如果子控件没有创建,则创建
base.CreateChildControls ();//调用方法
CreateControls();
}
7、 将第一步的脚本存到一个常量中：
private const string MOUSE_SCRIPT = //用来触发鼠标事件的脚本
"<script language=javascript>/n" +
"var OldColor;/n" +
"function ltmouseover(ctrl,color)/n" + //当鼠标移入时,调用该方法,ctrl为表格,color为要改变的颜色值
"{/n" +
"OldColor = ctrl.style.backgroundColor;/n" + //记录下原来的文档背景颜色
"ctrl.style.color = '#ffffff';/n" +//将字体颜色改为白色
"ctrl.style.backgroundColor = color;/n" + //更改表格背景颜色
"}/n" +
"function ltmouseout(ctrl)/n" + //鼠标移出时调用 ,参数同上
"{/n" +
"ctrl.style.backgroundColor = OldColor;/n" + //还原背景颜色
"ctrl.style.color = '#000000';" + //将字体颜色还原成黑色
"}/n" +
"</script>/n";
重写OnPreRender()方法将该脚本输出到浏览器，考虑到同一页面可能会有多个该控件的情况，此时并不需要每个控件都生成一段脚本，而是所有控件共享这段脚本，所以，我们要用Page.IsClientScriptBlockRegistered（）
浙公网安备 33010602011771号