NCV5-轻量级组件技术红皮书.doc

NC Rich Client 轻量级组件技术红皮书 NC-UAP 5.0 用友NC-UAP 2007-10-22 目 录 第一章 前言 1 1. 文档介绍 1 2. 概述 1 3. 组件整体继承关系介绍 1 第二章 各组件详细设计与使用方法介绍 2 1. BaseComponent 2 2. ModalDialogComp………………………………………………………………… 2. ConfirmDialogComp 5 3. MessageDialogComp 6 4. WarningDialogComp 7 5. ErrorDialogComp 9 6. ProgressDialogComp 10 7. PanelComp 11 8. TabComp 12 9. ButtonComp 14 10. ComboComp 16 11. ListToListComp 19 12. StringTextComp 22 13. IntegerTextComp 24 14. DateTextComp 25 15. FloatTextComp 26 16. TreeViewComp 27 17. OutLookBarComp 31 18. SliderbarComp 33 19. GridComp 35 前言 文档介绍文档目的文档范围读者对象术语与缩写解释缩写、术语 解 释 概述 在为传统的web应用编写HTML页面的时候，页面编写者只有非常有限的一套预定义GUI组件，即HTML表单元素。他们的特征集在近10年的时间里几乎没有什么变化，与现代的GUI工具集相比，它们是非常基础的。如果页面作者希望引入树控件或者可编辑的栅格、日历控件或者分级菜单之类的，就需要借助于基础文档元素的底层编程。由于开发Portal的需要，为了Portal更具实用性和易用性，同时随着Ajax技术的逐渐流行，客户端的重视程度日益提高，为了很好的利用Ajax技术提高web界面的响应速度，并带给用户更好的浏览体验，开发一套适用于portal并具有一定灵活性和可扩展性的基础控件库也成了势在必行的工作。 组件整体继承关系介绍 由于JavaScript代码均是下载到客户端解释执行，所以为了减轻客户端压力，类的继承层次不能太深，否则在客户端运行时代码的执行速度就会变慢，生成的原始js代码就会增多，考虑这个效率原因，NC Rich Client的大部分组件均采用一级继承，即直接继承自基类BaseComponent。 NC Rich Client组件特色 通过prototype属性建立面向对象的轻量级控件库 接口标准化,比如所有事件触发以onXX开放 支持动态更改皮肤外观。尽量以css将展现分离，支持单个控件的各个细节的自定义外观修改 将控件本身与数据绑定分离。树控件，grid控件均采用MVC设计模式实现 使控件适应于tag和ajax等多种环境 提供丰富的控件类别。Rich Client控件库提供了几十种轻量级控件，完全满足大多数Web应用的需要 同时对各个控件，进行尽量轻度的封装，减轻客户端压力 提供完善的js调试方式。比如WatchTime(监测代码执行时间)和log(前台日志) 注意: 控件使用过程中，如果要销毁一个控件，必须调用destroySelf方法，这样才能保证控件所占用资源完全被释放 Rich Client控件的一些开发规范 如果子控件的显示对象不是Div_gen,必须覆盖getObjHtml()方法返回真正的显示对象 如果objHtml是显示对象，那么使用objHtml.owner可以得到控件的数据对象 如果obj是数据对象，那么使用obj.parentHtml可以得到父控件的显示对象 如果obj是数据对象，那么使用obj.parentOwner可以得到父控件的数据对象 基类BaseComponent采用了template pattern设计模式为控件放入父控件的过程提供了统一的流程，子类必须实现manageSelf方法,子控件在放入父控件后会调用此方法 子控件兼听父控件的大小改变调整自己的大小，子控件如果需要改变自己的大小必须提供adjustSelf方法 各组件详细设计与使用方法介绍 BaseComponent 组件名称：BaseComponent 组件类型：所有控件的基类 组件说明 所有控件基类,包含了所有控件的共同属性和操作方法，此类不需要用户主动调用。 以下给出了这个类的详细函数原型描述。 函数介绍 Constructor Summary BaseComponent(name, left, top, w