Extjs4.0.7 desktop基础搭建.doc

Extjs4.0.7 desktop初级搭建 涉及内容：1.classes.js的拆分 2.App.js和Settings.js里代码的含义 3.桌面图标的换行 4.一些小小的修改 首先上官网上下载最新版本的Extjs，本次讲解以4.0.7版本为例，下载地址/products/extjs/download/ext-js-4.0.7/1234 然后打开myeclipse新建一个web project工程，这个工程的结构如下 其中core文件夹用于存放desktop的核心代码 css文件夹用于存放样式表 ext文件夹用于存放ext-all.js等 images文件夹用于存放desktop实例中images modules文件夹用于存放桌面上显示的模块 resources文件夹用于存放desktop实例自带的壁纸文件夹wallpapers和Extjs中resources下的themes文件夹 接下来把App.js,Settings.js和index.jsp(即desktop.html)放在webroot目录下面 一．classes.js的拆分：首先来看一下index.jsp中的代码 !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN /TR/html4/strict.dtd html head meta http-equiv=Content-Type content=text/html; charset=utf-8 titleextjs4 desktop/title !-- css -- link rel=stylesheet type=text/css href=js/css/ext-all.css / link rel=stylesheet type=text/css href=js/css/desktop.css / !-- base js -- script type=text/javascript src=js/ext/ext-all.js/script script type=text/javascript src=js/ext/ext-lang-zh_CN.js/script !-- core js -- script type=text/javascript src=js/core/Module.js/script script type=text/javascript src=js/core/Video.js/script script type=text/javascript src=js/core/Wallpaper.js/script script type=text/javascript src=js/core/FitAllLayout.js/script script type=text/javascript src=js/core/StartMenu.js/script script type=text/javascript src=js/core/TaskBar.js/script script type=text/javascript src=js/core/ShortcutModel.js/script script type=text/javascript src=js/core/Desktop.js/script script type=text/javascript src=js/core/App.js/script !-- module js -- script type=text/javascript src=modules/WallpaperModel.js/script script type=text/javascript src=modules/VideoWindow.js/script script type=text/javascript src=modules/BogusModule.js/script script type=text/javascript src=modules/BogusMenuModule.js/script script type=text/javascript src=modules/TabWindow.js/script script type=text/javascript src=modules/GridWindow.js/script scrip