Javascript语言本身并没有提供命名空间的机制,很多种Javascript Lib都有各自的模拟方法,在qooxdoo里面,命名空间是通过这个方法调用实现的:
[code]
qx.OO.defineClass("you.package.YourClassName", parentObject, initFunction);
[/code]
举一个实际的例子来说明就很容易明白这个API的用法:
qooxdoo提供了qx.ui.component.DateChooser这个日期选择的类,他的界面如下:
[img]http://readonly.iteye.com/upload/picture/pic/44/ae898a57-bd44-4e11-ac2f-74108b464d16.jpg[/img]
它本身是直接嵌入页面的,而实际需求往往是一个popup date chooser window,偶们可以用20来行代码实现:
[code]
qx.OO.defineClass("com.javaeye.qooxdoo.DateChooserWindow", qx.ui.window.Window,
function(vDate, vWindowManager)
{
qx.ui.window.Window.call(this, "Date Chooser", "icon/16/date.png", vWindowManager);
with(this){
setSpace(120, 200, 120, 140);
setModal(true);
setShowClose(true);
setShowMaximize(false);
setShowMinimize(false);
setResizeable(false);
}
var dateChooser = this._dateChooser = new qx.ui.component.DateChooser(vDate);
with(dateChooser){
setWidth("auto");
setHeight("auto");
}
this.add(dateChooser);
});
[/code]
这样就定义了一个新的namespace ("com.javaeye.qooxdoo") 下新的Widget Class ("DateChooserWindow"),并且继承了 qx.ui.window.Window 所有方法,我们只需要在代码里面这样调用:
[code]
var w = new com.javaeye.qooxdoo.DateChooserWindow;
w.open();
[/code]
就能够popup一个date chooser window了,界面如下:
[img]http://readonly.iteye.com/upload/picture/pic/45/754033c2-8532-4040-8294-50fb1584a17a.jpg[/img]
通过qooxdoo提供的namespace、继承机制和丰富的widget lib,偶们很容易就能够组合出更易用的用户界面了。
[code]
qx.OO.defineClass("you.package.YourClassName", parentObject, initFunction);
[/code]
举一个实际的例子来说明就很容易明白这个API的用法:
qooxdoo提供了qx.ui.component.DateChooser这个日期选择的类,他的界面如下:
[img]http://readonly.iteye.com/upload/picture/pic/44/ae898a57-bd44-4e11-ac2f-74108b464d16.jpg[/img]
它本身是直接嵌入页面的,而实际需求往往是一个popup date chooser window,偶们可以用20来行代码实现:
[code]
qx.OO.defineClass("com.javaeye.qooxdoo.DateChooserWindow", qx.ui.window.Window,
function(vDate, vWindowManager)
{
qx.ui.window.Window.call(this, "Date Chooser", "icon/16/date.png", vWindowManager);
with(this){
setSpace(120, 200, 120, 140);
setModal(true);
setShowClose(true);
setShowMaximize(false);
setShowMinimize(false);
setResizeable(false);
}
var dateChooser = this._dateChooser = new qx.ui.component.DateChooser(vDate);
with(dateChooser){
setWidth("auto");
setHeight("auto");
}
this.add(dateChooser);
});
[/code]
这样就定义了一个新的namespace ("com.javaeye.qooxdoo") 下新的Widget Class ("DateChooserWindow"),并且继承了 qx.ui.window.Window 所有方法,我们只需要在代码里面这样调用:
[code]
var w = new com.javaeye.qooxdoo.DateChooserWindow;
w.open();
[/code]
就能够popup一个date chooser window了,界面如下:
[img]http://readonly.iteye.com/upload/picture/pic/45/754033c2-8532-4040-8294-50fb1584a17a.jpg[/img]
通过qooxdoo提供的namespace、继承机制和丰富的widget lib,偶们很容易就能够组合出更易用的用户界面了。
本文介绍如何使用qooxdoo框架创建自定义组件。通过示例演示如何定义新的命名空间及组件,并实现一个弹出式的日期选择窗口。

被折叠的 条评论
为什么被折叠?



