采用Asp.NET Ajax开发屏聊系统相对于Asp+Ajax开发要相对简单得多，我们只需要像普通的Web编程一样，拖拖拽拽就可以将整个系统堆建起来，在前台我们也不需要写太多的Javascript代码，直接由框架生成就可以了，只是将传统.NET下的控件放在UpdatePanel控件里面，并为UpdatePanel设置一定的属性值，就可以实现局部区域的刷新。

　　1、屏聊系统界面区域结构

　　我们在《Ajax开发页面聊天系统》已经知道，页面屏聊系统的页面主要由两部分组成，一是最小化时的页面（AnchorCall1_Min），另一则是还原时的页面，我们这里称为最大化时的页面(AnchorCall1_Max)。为了便于大家的理解，懒羊在这将页面所要安排的UpdatePanel控件位置绘制如下(以下红框圈注部分为UpdatePanel控件)。

图三 UpdatePanel控件位置排布图

　　AnchorCall1_Min区域：

　　Min0区域：由一个IMG的Html控件与ImageButton控件构成，IMG通过JS代码将界面由最小化转为最大化界面。ImageButton控件来控制屏聊页面的关闭，并且停止屏聊程序的运行，稍后会作详细的介绍。

　　Min1区域：由一个Label控件构成，用于显示屏聊用户的提示信息，如登陆信息、改名信息等等。

　　AnchorCall1_Max区域：

　　Max0区域：与Min0区域相似，只是IMG控件是实现由最大化界面向最小化界面切换。

　　Max1区域：由两个ImageButton控件和一个TextBox控件构成。TextBox主要用于显示系统自动生成的呢称。而ImageButton一个为改名按扭，另一个将聊天记录生成为HTML文件。

　　Max2区域：本区域是整个系统的一个核心区域，主要用于显示聊天记录，由于聊天记录是定时刷新的，也就是定期会从服务器 style="COLOR: #000000" href="http://product.it168.com/files/0402search.shtml" target=_blank>服务器读取聊天信息并更新显示区域，我们显示聊天信息的区域采用一个可以多行的TextBox控件来显示，由于聊天信息量的增多，我们就会去拖动TextBox控件的滚动条，但因为我们会通过Ajax中的Timer控件来定期更新TextBox中的内容，因此TextBox中的滚动条会因此而不断的复位，而我们拖动时就会很不方便，出于人性化考虑我们还必须通过客户端代码来控制服务器 style="COLOR: #000000" href="http://server.it168.com/" target=_blank>服务器端Timer控件的启用与停止，另外还有两个采用隐藏（style=display:none）的Button控件，主要是为了协助客户端肛码控制Timer控件的启用与停止，后面同样我们将重点介绍。提示信息区与Min1区相似为一个Label控件。

　　Max3区域：由一个ImageButton控件与TextBox控件构成。主要实现聊天信息的发送功能，本功能支持Alt+S。

上一页  [1] [2] [3] [4] [5] [6] [7] 下一页  

（责任编辑：hahack）