w技术交流.docVIP

ExtJs简介 ExtJs历史简介 ExtJS可以用来开发RIA也即富客户端的AJAX应用，是一个用javascript写的，主要用于创建前端用户界面，是一个与后台技术无关的前端ajax框架。因此，可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。ExtJs最开始基于YUI技术，由开发人员JackSlocum开发，通过参考JavaSwing等机制来组织可视化组件，无论从UI界面上CSS样式的应用，到数据解析上的异常处理，都可算是一款不可多得的JavaScript客户端技术的精品。 Ext的UI组件模型和开发理念脱胎、成型于Yahoo组件库YUI和Java平台上Swing两者，并为开发者屏蔽了大量跨浏览器方面的处理。EXT要比开发者直接针对DOM、W3C对象模型开发UI组件轻松。 面向对象 ExtJs对Js进行了封装。对继承进行了很好的支持。下面是一些主要对象的继承模型。 可扩展 可以在ext的基础上继续开发。Ext像eclipse一样，使用plugin的方法使任何开发者进行扩展。 与具体开发平台无关 作为一套Js框架，后台可以是Java、.NET或者php。 Ext主要对象的介绍 GridPanel GridPanel几乎是最吸引人的地方之一。很多人都是因为看中了ext的GridPanel才来应用Ext的。下面对GridPanel的特点进行一下介绍。下面是gridPanel的一些主要特点。 分页 多选 加号展开 列支持拖拽 对多列排序进行支持 异步加载（界面友好） 示例：http://localhost/ext-3.2.1/examples/grid/paging.html http://localhost/ext-3.2.1/examples/grid/grid-plugins.html FormPanel 最好的就是异步提交。可以防止重复提交。 示例：http://localhost/ext-3.2.1/examples/form/dynamic.html http://localhost/ext-3.2.1/examples/form/xml-form.html TreePanel 只用简单的几行代码就可以得到树。 GridPanel + Tree http://localhost/ext-3.2.1/examples/treegrid/treegrid.html CheckboxTree http://localhost/ext-3.2.1/examples/tree/check-tree.html ViewPort 这个对象就是页面。一个页面只能有一个viewport. 其他常用对象 Element， Ajax，Window和ComboBox。 Ext布局介绍 Extjs的布局是一个很重要的概念，也是页面规划中比较复杂的一个内容。 常用有: Border区域布局，Column列布局，Accordion布局。 页面布局由类Ext.layout.BorderLayout定义，布局名称为border。该布局把容器分成东南西北中五个区域，分别由east，south, west，north, cente来表示，在往容器中添加子元素的时候，我们只需要指定这些子元素所在的位置，Border布局会自动把子元素放到布局指定的位置。Column列布局：Column列布局由Ext.layout.ColumnLayout类定义，名称为column。列布局把整个容器组件看成一列，然后往里面放入子元素的时候，可以通过在子元素中指定使用columnWidth或width来指定子元素所占的列宽度。columnWidth表示使用百分比的形式指定列宽度，而width则是使用绝对象素的方式指定列宽度，在实际应用中可以混合使用两种方式。Accordion布局：Accordion布局由类Ext.layout.Accordion定义，名称为accordion，表示可折叠的布局，也就是说使用该布局的容器组件中的子元素是可折叠的形式。http://localhost/ext-3.2.1/examples/layout-browser/layout-browser.html Ext学习经验总结 多动手。 防止出现眼高手低。 Javascript基础打好。 Ext本身是一个Javascript的框架。其各种面向对象的方法都是基于Javascript的语法的。因此，要想更好的了解ext，必须去读源码，深入了解ext的思想。要读懂其源码，js的基础一定要过关。 Eval()。 Prototype属性。 数据类型。Constructor. ExtJs开发实例 开发推荐 Aptana 一个javascript的eclipse插件 Firefox或者