Extjs4学习指导.doc

Extjs 4 学 习 方法指导  Ext js初步 获取Extjs 下载extjs： 可以从/ 获得需要的extjs发布包及更多支持。 搭建学习环境： 假设您的机器已经安装myeclipse和tomcat，如果没有请参阅其他相关资料。 myeclipse建立新Web project项目Extjs4 并且将extjs4.0.7压缩包解压后的全部文件复制到项目的Webroot目录下 Examples目录为ext官方提供的例子程序，其中可能包涵php的代码，错误信息可以暂时不理会。 部署并且启动tomcat，测试环境是否可用。 打开浏览器，输入http://localhost:8080/Ext4/index.html 假设您的tomcat端口为8080 您会看到以下界面，证明环境已经搭建成功！ 查看api文档 http://localhost:8080/Ext4/docs/index.html 查看示例页面http://localhost:8080/Ext4/examples/index.html 测试例子 ExtJS4学习笔记(一)window的创建 发布时间：2011-04-29????来源：互联网????作者：佚名????点击：0 Extjs4,创建Ext组件有了新的方式，就是Ext.create()，而且可以使用动态加载JS的方式来加快组件的渲染，我们再也不必一次加载已经达到1MB的ext-all.js了，本文介绍如何在EXTJS4中创建一个window。 代码如下： ? !DOCTYPE?html?PUBLIC?-//W3C//DTD?XHTML?1.0?Transitional//EN?/TR/xhtml1/DTD/xhtml1-transitional.dtd html?xmlns=/1999/xhtml head meta?http-equiv=Content-Type?content=text/html;?charset=utf-8?/ title窗口实例/title link?rel=stylesheet?type=text/css?href=../../resources/css/ext-all.css?/ script?type=text/javascript?src=../../bootstrap.js/script script?type=text/javascript?src=../../locale/ext-lang-zh_CN.js/script script?type=text/jscript Ext.require(Ext.window); Ext.onReady(function(){ ??Ext.create(Ext.Window,{ ????width:400, ????height:230, ????//X,Y标识窗口相对于父窗口的偏移值。 ????x:10, ????y:10, ????plain:?true, ????//指示标题头的位置,分别为?top,bottom,left,right,默认为top ????headerPosition:?left, ????title:?ExtJS4?Window的创建，头在左 ??}).show(); ?? ??Ext.create(Ext.Window,{ ????width:400, ????height:230, ????x:500, ????y:10, ????plain:?true, ????//指示标题头的位置,分别为?top,bottom,left,right,默认为top ????headerPosition:?right, ????title:?ExtJS4?Window的创建，头在右 ??}).show(); ?? ??Ext.create(Ext.Window,{ ????width:400, ????height:230, ????x:10, ????y:300, ????plain:?true, ????//指示标题头的位置,分别为?top,bottom,left,right,默认为top ????headerPosition:?bottom, ????title:?ExtJS4?Window的创建，头在底 ??}).show(); ??var?win?=?Ext.create(Ext.Window,{ ????width:400, ????height:230, ????x:500, ????y:300, ????plain:?true, ????//指示标题头的位置,分别为?top,bottom,left,