第二章：准备与资源.doc

第二章：准备与资源一、下载 要开始Extjs，必须先从网上下载所有需要的文件。目前的稳定版为Extjs2.2，3.0也快发布了。下载的文件解压后，包含若干个文件夹和文件，作用分别如下： adapter文件夹：该文件夹包含了extjs和其实框架如jquery、yui、prototype的桥接器，用于Extjs和这些框架的友好整合。 build文件夹：包含了所有js文件的紧凑压缩版，方便网络传输，提高下载速度。 docs文件夹：Extjs的帮助文档，遗憾的是要先布署在服务器上才能访问。网上有人制作了无需布署的版本。 examples文件夹：自带的示例全部在该文件夹中，一定记得去看看。 resources文件夹：包含了Extjs所需要的样式表文件和图片资源。 source文件夹：源代码文件夹，没有经过压缩的版本。 ext-base.js：基础类库。 ext-core.js：核心类库。 ext-all.js：类库完整版。 ext-all-debug.js：带格式的未压缩的类库完整版，带调试功能。 ext-core-debug.js：带格式的未压缩的核心类库。 CHANGES.html：开发及升级日志。 license.txt：协议，比较复杂，但用惯了盗版的我们来说完全不予理会。二、拦路虎 在学习之前，有一些问题需要澄清一下，不然，碰到问题的时候准会傻眼。我们还会在后面不断提醒，但事先让您知道也许是个不错的主意。 问题1：导入js文件后，在js文件中定义的中文显示在页面后为什么会出现乱码？ 问我算是问对人了，因为我为这事迷糊了一整天。乱码问题在JavaEE中司空见惯，但没有哪个的头疼度能和Extjs比。简直太伤人了。 我们还得一二三逐步来，不然死了都不知道是怎么死的。在MyEclipse中，js文件的默认编码是Iso-8859-1，这种编码和中文水火不容，从下面的界面中可以改成别的编码，如gbk，其实我建议大家使用utf-8，根据我的经验，utf-8出现乱码的机率比较少。在页面中导入js文件是，要指明字符集编码，形如： 为了绝对的安全，将eclipse工作区的编码变成utf-8，现在您也许不信，因为不改确实很好呐，可是，等到万一出现问题的时候，千万别怪我没告诉你。 问题2：为什么同样的程序在IE和Firefox中显示不同？ Extjs在很多情况下使用11px字体，11px大小是一种边缘字体，不同的浏览器对11px的渲染各不相同，IE的渲染和12px相似，而在Firefox中，则和10px相似，导致字体在FF中过小的问题。当然，英文看不出来，中文则相当别扭。像我这种追求完美的人是无法忍受的。网上有一些文章能解决一部分问题，但不能解决全部问题，一不做二不休，我们干脆打开extjs/resources/css/ext-all.css文件，把里面的11px全部替换成12px，OK，成了。 问题3：为什么有些图片无法显示？ 对不起，你的描述其实不对，不是有些，只有一张图片显示不出来，但这张图片的影响力太大了，可以说牵一发而动全身。为了配合皮肤，需要一张1*1大小的空白图片，变态的是，这张图片不是从本地获取的，而是访问了/s.gif，也就是说，访问了网络上的图片，如果没有连网，就会出现图片无法显示的情况。解决的方案是，在js文件中添加如下语句：Ext.BLANK_IMAGE_URL = ./extjs/resources/images/default/s.gif; BLANK_IMAGE_URL是Extjs中定义的一个常量，我们重新赋了新值。但是，由于环境不同，您的路径可能会有些许变化。三、布署环境 把“布署环境”四个字拿出来，显然是吓人的，不就是脚本吗？不过，如果出错又解决不了，自信心会被严重打击，还是听我说吧。 请先将必要文件导入您的工程，以下是最精简的结构： ext-lang-zh_CN.js是为了本地化的需要，没别的用途。 众所周知，我们习惯将javascript写成独立的js文件，方便维护和共享，在页面中如果要访问js文件，需要使用script标签导进来，Extjs有两个js文件是必须的，如下： 还是那句话，由于上下文环境不同，您的实际情况可能和上面的不一样，由js文件的实际路径决定。 同样，CSS也同样要导入到工程中。以下是全部需要导入的文件： 要注意的是，不要随意调整各文件的顺序，特别是ext-base.js必须在ext-all.js文件之前，记住了！四、SpketIDE “工欲善其事,必先利其器”，再厉害的程序员，如果没有好的智能开发工具，效率也不可能提高。好的IDE能减少代码出错的机会，并对代码文件进行高效管理。事实上，因为javascript是弱弱弱类型语言，市面上没有像eclipse这样的集成开发环境帮助我们写javascript代码，但是，勉强能用的还是不少，SpketIDE就是其一。 SpketIDE在Vs Stduio和Eclipse平台上都有相应的插件。本人是搞JavaEE的，对NET方向无法作出交待，下面介绍SpketIDE for Eclipse的安装和使用。1、 首先手头上要有spket-1.6.16.zip文件，从网上可以下载，或者从学校FTP上获取。我现在使用的版本是1.6.16；2、 将spket-1.6.16.zip文件解压，复制文件夹所在目录，如：E:LiZanhongDevolpmentext-2.0.2spket-1.6.16，如果没有意外，下一级目录应该是eclipse，千万不要复制eclipse；3、 切换到eclipse所在目录，并进入links目录（如果不存在，自己创建一个），如：D:Program FilesMyEclipse 6.5eclipselinks，在该目录中创建一个文本文件，文件名为：“skpet.1.6.16.link”，用记事本打开文件，输入内容：path= E:LiZanhongDevolpmentext-2.0.2spket-1.6.16;4、 重新启动Eclipse，如果安装成功，在Window-Preferences中会出现Spket的选项。5、 下面的图能说明问题点击右上角的“new”按钮，弹出下面的对象框：输入任意名称，如“extjs”，点击“OK”后，选中新加的“extjs”节点，单击“add library”按钮，如下图所示：选择“ExtJS”，如下图：选中“ExtJS”，单击“Add File”按钮，弹出下面的对话框：想办法在extjs的文件夹中找到ext.jsb文件，打开后最后应该是下面这个样子：至少，SpKetIDE安装完成。 五、资源 最好的资源自然是官方提供的AIP文档和示例，这些东西很宝贵啊，虽然是洋文，但还是值得去研究。 另外，去上网吧，不是为了游戏，也不是为了聊天和娱乐，而是为了淘到更多的东西帮助我们学习这才是正途。 这里提供一个：/ajaxjs/ind