代码改变世界

我的开源项目:InteWidgetTookit

2006-11-27 20:03 Jeffrey Zhao 阅读(...) 评论(...) 编辑 收藏

介绍

目前这么称呼它还让我有些汗颜,因为事实上这只是我在上周五下班后才开始动手的“项目”,花了差不多一个周末的时间用来写代码(还不是埋头在写),正在CodePlex上为它申请,可惜到现在还没有批下来。

“InteWidgetToolkit”很明显是一个Toolkit,也就是工具包。“Inte”是“Integrate”的缩略。而Widget的含义则是“小工具”。其实这个名字的本意是“一个集成第三方脚本类库中Widget的ASP.NET AJAX工具包”,但是目前的决定是“一个集成第三方脚本类库的ASP.NET工具包,提供了各种Widget”。其实做这样一个工具包的想法已久(不喜欢AjaxControlToolkit的部分控件,例如有的控件功能有些弱等等),可惜ASP.NET Control Tookit还不稳定,再加上比较“懒”,因此到现在才开始。万事开头难,既然已经开始了,把它做做好,做做大(对我来说)就相对容易些了。

InteWidgetToolkit的目的是提供各种控件,目前想法是以Extender的方式为主,但是不排除今后会加入普通WebControl的类型。目前第三方脚本控件暂且定位在Dojo和Yahoo! UI Library。

在周末的两天里我实现了如下内容:

  1. 一个能够为建立Behavior添加“事件”的ExtenderBase(我一直对于ASP.NET AJAX Control Toolkit不提供事件的支持感到很奇怪)。
  2. 便于开发“基于第三方Widget组件”的BehaviorBase。
  3. 便于开发“基于Dojo里Widget组件”的ExtenderBase和BehaviorBase(有了它们,开发基于Dojo Widget的Extender几乎不用写任何客户端代码,服务器端代码也只需要编写几个属性,标记几个CustomAttribute就可以了。由于Dojo的“特性”,这部分事实上比想象中麻烦,我也尝试了多种做法,将在之后的文章里进行描述)。
  4. 使用上面的基础开发了三个基于不同“类型”和“使用方式”Dojo Widget的Extender,证明了上述基础的可行性。它们是:
    • ColorPaletteExtender
    • SplitContainerExtender
    • TooltipExtender

等CodePlex空间申请成功后,我会将源代码放上去,并将部分(尤其是基础部分)的实现和使用方式解释给大家,并希望能从大家那里得到意见和建议。

 

使用效果

下面描述一下上述三个Extender的使用效果(点击小图可查看大图)。

ColorPaletteExtender:

这个Extender的作用是提供一个颜色选择盘,提供了一个选择颜色的功能,提供了3x4与7x10两种大小。示例中配合PopupControlExtender一起使用,效果如下:

 

SplitContainerExtender:

这个Extender是提供了WinForm一般的“Split控件” 的功能,能够将界面分成几个部分,并且任意改变。使用它能够设定每一块的初始大小,分割栏的宽度,是否即时改变大小等设置。示例中使用了两个SplitContainerExtender进行嵌套,效果如下:

 

TooltipExtender:

这个Extender的作用是提供了显示Tooltip的能力,能够为任意控件提供各种样式的Tooltip,能够控制Tooltip显示和隐藏的效果(例如伸缩,渐变等)。效果如下:

(这个Extender提供的各种动态效果只有在您的机器上运行示例代码才能看出)

 

示例部署

上述Extender的示例代码可以点击这里进行下载,不过它还需要Dojo脚本库的支持。Dojo的官方网站是http://dojotoolkit.org,您可以点击这里下载到它最新的0.4版本。下载Dojo库之后,请您将压缩包内“\dojo-0.4.0-ajax\dojo.js”文件复制为网站的“~/js/dojo/dojo.js”文件,并且将压缩包内“\dojo-0.4.0-ajax\src\”目录下的所有内容复制到网站的“~js/dojo/src/”文件夹下。其中“~/js/dojo/dojo.js”为Dojo的入口文件,它的地址可以在Web.config里进行配置,但是dojo.js文件和src目录的相对位置必须保持不变,这个是Dojo的“强制要求”。

然后您就可以打开ColorPaletteSample.aspx,SplitContainerSample.aspx和TooltipSample三个文件来查看三个Extender的使用效果了。

这三个Extender并不成熟,例如无法在UpdatePanel中使用,对于设计器的支持也不好,也不支持ViewState等。我会继续对它们进行改进,请大家多多包涵。