ExtJS源码分析与开发实例宝典(附光盘源码) PDF扫描版

ExtJS源码分析与开发实例宝典 内容简介: 《Ext JS源码分析与开发实例宝典》一书全面系统地剖析了ExtJS 3．0的架构设计原理。通过对源码的“抽丝剥茧”，读者可以掌握Ext JS架构的精妙，从原理层面用活Ext JS。此外，本书还提出了大量的解决方案，以使Ext JS满足用户 日益增长的体验需要。 　　《Ext JS源码分析与开发实例宝典》一书分为4个部分，共17章。快速入门部分讲解Ext JS的背景及体系结构，并通过案例实现让 读者快速入门。核心技术部分深入讲解Ext JS的核心基础知识，包括JS原生对象的扩展、事件机制、 模板模型、数据模型，包括一个机制、两个模型及六个扩展。基于元素的开发部分讲解了在DOM元素基 础上扩展的Ext JS元素，包括元素操作、元素查找、元素样式、动画特效和拖曳实现。深入组件的开 发部分讲解Ext JS组件的原理及各大组件的应用，包括组件模型、容器模型、布局设计、Form组件、 Grid组件、Tree组件及Menu组件。 　　《Ext JS源码分析与开发实例宝典》一书结构紧凑，条理清晰，注重对Ext JS优美代码的分析和应用，通过阅读漂亮的代码，能够极 大地提升代码编写的质量。为了让读者更好地理解知识，本书还配 备了丰富的应用实例，在充分理解源 码的基础上，对Ext JS进行了大量实用性强的扩展。 　　本书可以作为Web应用开发的参考手册，适合具备一定HTML和JavaScript基础的开发人员学习， 特别适合从事RIA Web开发的人员自学参考，也可以作为Ext JS应用开发的培训教材。 媒体评论 随着浏览器的不断进步和RIA（Rich Interface Application。）的逐渐流行，JS（JavaScript）这门历史悠久的开发技术不断焕发出新的生机，开发人员为JS开发出各种框架，来提升开发的质量与效率，以适应Web 2．0时代Web应用程序的开发。在众多的框架中，Ext JS以其独特的设计、强大的功能和开源的优势，获得了巨大的成功。 　　本书的作者通过清晰的实例，详细讲述了Ext JS的核心概念和实际应用，体现了作者高度的理论修养和丰富的实践经验。读者既可以从中体会Ext JS框架的设计思想，也可以直接按照书中的实例进行操作，解决开发中遇到的问题。同时，本书行文流畅，逻辑严谨，改变了通常技术书籍晦涩难懂的形象，这是本书的又一亮点。 　　——诺和诺德(中国)科技有限公司，NNIT(China)，高级开发技术研究与培训专家，杜新润 　　本书很全面地讲解了Ext JS框架，以及其他类似的JavaScript框架，能让初学者很快上手。通过不同的开发环境，如VS、dw、Eclipse，配置Ext JS的智能感应功能，提高Ext JS的开发效率与开发速度。对Ext JS的体系结构描述清楚，通俗易懂，通过简单的例子，介绍了Ext JS 3．0对UI的应用、DOM元素、事件、数据的处理等。逻辑层次清晰，由浅入深地进述了Ext√S的点点滴滴。虽然只看了部分章节，但也能体会作者对Ext JS的每一个要点都讲得很详细，是一本难得的好书。 　　——中国软件工程网，全体开发工程师 　　本书层次清晰，层层深入地进行例子讲解，案例丰富，介绍了Ext JS的概念和应用技巧。结合实际的项目讲解Ext JS在UI和整体项目上的应用特点，值得前端设计人员和Ajax爱好者学习。 　　——成都微核科技，界面工程师，David．heii.R ExtJS源码分析与开发实例宝典 目录: 第1部分　快速入门 1 第1章　Web如此美丽，初探Ext JS 2 1.1　Ext JS是什么 2 1.2　为什么选择Ext JS 3 1.3　如何学习Ext JS 5 1.3.1　获取源码并部署 5 1.3.2　开发工具的智能提示 5 1.3.3　文档和实例的学习 8 1.3.4　学习论坛 9 1.4　Ext JS体系结构 9 1.4.1　体系结构 9 1.4.2　文件结构 11 1.5　小结 13 第2章　Ext JS 3.0实例入门 14 2.1　准备工作，配置环境 14 2.2　看似简单的登录页面，隐藏好大的学问 15 2.2.1　页面布局 16 2.2.2　表单布局 18 2.2.3　验证码 20 2.2.4　表单验证 21 2.2.5　表单提交 22 2.3　主框架页面 24 2.3.1　主框架页面布局 26 2.3.2　左边导航菜单 28 2.3.3　右边工作区域 30 2.4　子页面 32 2.4.1　数据处理 32 2.4.2　列表 34 2.5　小结 35 第2部分　核心技术 37 第3章　Ext JS核心基础 38 3.1　继承的扩展 38 3.1.1　对象的继承 38 3.1.2　类的继承 39 3.1.3　Ext.extend扩展 40 3.2　函数的扩展 42 3.2.1　从一个错误说起 42 3.2.2　函数的委托 43 3.3　数组及集合 44 3.3.1　JavaScript数组 45 3.3.2　Ext JS集合操作 46 3.4　String的转换 50 3.4.1　String转换的基本知识 50 3.4.2　String和JSON转换 50 3.4.3　查询字符串与对象转换 52 3.5　Date的使用 53 3.5.1　日期格式化 53 3.5.2　日期的比较及计算 55 3.6　定时任务 56 3.6.1　有状态的定时任务管理 56 3.6.2　定时任务管理器 58 3.7　小结 60 第4章　你必须知道的Ext JS事件机制 61 4.1　浏览器事件机制 61 4.2　Ext JS元素事件 63 4.2.1　Event对象 63 4.2.2　EventManager 67 4.3　基本事件扩展 71 4.3.1　DomReady处理 71 4.3.2　快捷键的实现 72 4.3.3　导航键的实现 74 4.3.4　鼠标按住事件 75 4.4　Ext JS组件事件 76 4.4.1　事件对象 77 4.4.2　组件的事件机制 78 4.4.3　基于拦截的事件实现 81 4.4.4　组件及元素事件结合 83 4.5　扩展TabBox事件 84 4.5.1　焦点 84 4.5.2　扩展TabBox导航 85 4.5.3　自定义TabBox事件 87 4.6　小结 89 第5章　模板模型，组件开发的基石 90 5.1　Ext JS模板概述 90 5.2　正则表达式基础 91 5.2.1　正则表达式引擎 91 5.2.2　字符匹配 93 5.2.3　选择、分组及引用 95 5.3　正则表达式的使用 97 5.3.1　exec和match 97 5.3.2　replace函数 97 5.4　基本模板 99 5.4.1　模板的构建 99 5.4.2　应用动态数据 100 5.4.3　编译模板 101 5.5　扩展模板 103 5.5.1　实现原理 104 5.5.2　编译Xtemplate模板 107 5.5.3　为Xtemplate应用动态数据 110 5.6　模板问题及改进 110 5.6.1　模板的问题 110 5.6.2　问题的解决 112 5.7　通信录的实现 114 5.7.1　应用DataView 115 5.7.2　数据分页和过滤 117 5.7.3　通信录中的信息 118 5.8　小结 119 第6章　改善用户体验，交互数据模型 120 6.1　Ajax请求 120 6.1.1　从网络通信协议开始 120 6.1.2　手动实现Ajax 123 6.1.3　便利函数让调用更加方便 126 6.1.4　表单请求 127 6.1.5　跨域请求 131 6.2　Direct请求 134 6.2.1　Comet请求 134 6.2.2　RPC请求 137 6.3　代理请求 141 6.3.1　REST风格 141 6.3.2　代理请求的处理过程 142 6.3.3　MemoryProxy的扩展 145 6.4　数据解析的实现 147 6.4.1　定义表结构 147 6.4.2　解析表数据 152 6.4.3　数组解析的扩展 156 6.5　数据回写 157 6.5.1　组装请求参数 157 6.5.2　保存之后更新 159 6.6　数据存储 160 6.6.1　构建Store对象 160 6.6.2　载入数据 162 6.6.3　保存数据 164 6.7　DWR数据交互 166 6.7.1　DWR请求扩展 167 6.7.2　DWR数据解析 169 6.7.3　CRUD操作 171 6.8　小结 172 第3部分　基于元素的开发 173 第7章　元素扩展，让开发更灵活 174 7.1　Ext. DomHelper类 174 7.1.1　元素创建 174 7.1.2　元素插入 175 7.2　Ext.DomQuery类 178 7.2.1　实现原理 179 7.2.2　查询及过滤实现 180 7.2.3　编译解析 182 7.3　Ext JS元素架构 185 7.3.1　Ext.Element元素 185 7.3.2　Ext.CompositeElementLite 187 7.4　表单实例 189 7.4.1　实现并载入表单 189 7.4.2　计算相关费用 191 7.5　小结 195 第8章　Ext JS样式的完美应用 196 8.1　样式基本操作 196 8.1.1　创建元素 197 8.1.2　元素定位 198 8.1.3　可视及其他 199 8.2　 JS操作样式 200 8.2.1　style的操作 201 8.2.2　class的操作 203 8.2.3　动态加入CSS Rules 204 8.2.4　重构它们 206 8.3　Dimensions操作 207 8.3.1　宽高操作 208 8.3.2　坐标定位操作 211 8.3.3　重构它们 214 8.4　相对定位与约束 215 8.4.1　元素相对定位 216 8.4.2　scroll定位 219 8.4.3　Resize元素定位的实现 220 8.5　ImageCropper的实现 224 8.5.1　创建容器 225 8.5.2　创建三层图片并载入 226 8.5.3　初始化Resize和拖曳 227 8.5.4　显示选择内容 229 8.6　小结 231 第9章　让Web页面动起来 232 9.1　动画的原理 232 9.1.1　原理实现 232 9.1.2　改进的实现 234 9.2　Ext JS动画实现 237 9.2.1　Ext JS动画管理器 237 9.2.2　动画对象 238 9.3　动画的进一步深入 243 9.3.1　动画类型 243 9.3.2　动画算法 247 9.3.3　Fx特效处理 251 9.4　扩展Ext JS矢量图 254 9.4.1　excanvas基本应用 254 9.4.2　excanvas高级应用 261 9.5　交互式动画报表图 266 9.5.1　基本折线图 266 9.5.2　动画的实现 273 9.5.3　交互式选择的实现 275 9.5.4　ToolTip的实现 279 9.6　小结 282 第10章　拖曳技术，让用户也动起来 283 10.1　Ext JS拖曳原理剖析 283 10.1.1　如何选中元素 283 10.1.2　如何实现鼠标移动位置 284 10.1.3　如何确定元素目标位置 285 10.2　Ext JS拖曳架构 285 10.2.1　拖曳共性处理 285 10.2.2　拖曳个性处理 289 10.3　拖曳形式的选择题应用 297 10.3.1　选择题的实现 297 10.3.2　选项拖曳的实现 299 10.4　拖曳高级扩展 303 10.4.1　拖曳元素状态处理 304 10.4.2　目标元素状态处理 306 10.4.3　把拖曳目标和拖曳元素综合起来 311 10.5　拖曳定制流程 315 10.5.1　基本的流程图 315 10.5.2　拖曳的实现 319 10.5.3　拖曳的完善 324 10.6　小结 327 第4部分　深入组件的开发 329 第11章　Ext JS组件模型的架构解析 330 11.1　认识Ext JS组件 330 11.2　生命周期设计 332 11.2.1　初始化 332 11.2.2　渲染表现 334 11.2.3　销毁组件，释放系统资源 335 11.3　可扩展性设计 337 11.3.1　类继承的支持 337 11.3.2　事件的支持 337 11.3.3　插件的支持 338 11.3.4　可配置的支持 338 11.3.5　模板方法的支持 339 11.4　可管理性设计 339 11.4.1　全局统一管理 339 11.4.2　组件类别管理 340 11.4.3　内部状态管理 340 11.5　组件分析法 343 11.5.1　生命周期分析 343 11.5.2　配置项分析 345 11.5.3　方法及属性分析 345 11.5.4　事件分析 347 11.5.5　组件特性 347 11.6　如何自定义组件 348 11.6.1　组件的需求 348 11.6.2　按生命周期来编写组件 348 11.6.3　重构 349 11.6.4　编写文档 350 11.7　小结 350 第12章　Ext JS面板，信息提示更人性化 351 12.1　浮动层（Layer） 351 12.1.1　shim实现 351 12.1.2　shadow实现 352 12.1.3　约束定位 355 12.1.4　浮动层显示 357 12.2　容器（Container）布局 359 12.2.1　生命周期分析 359 12.2.2　容器特性 361 12.3　面板（Panel）布局 363 12.3.1　面板组成 363 12.3.2　面板样式 367 12.3.3　面板的折叠/展开 370 12.4　窗体（Window）布局 372 12.4.1　最大最小化 372 12.4.2　改变大小 375 12.4.3　窗体显示问题 376 12.5　工具提示 377 12.5.1　Ext.Tip类 377 12.5.2　Ext.ToolTip类 378 12.5.3　Ext.QuickTip类 379 12.6　气球提示（BalloonTip) 382 12.6.1　实现BalloonTip组件 383 12.6.2　进一步完善 388 12.7　小结 393 第13章　Ext JS 华丽的容器布局 394 13.1　认识布局的流程 394 13.1.1　布局概述 394 13.1.2　布局的流程 395 13.2　Border布局 397 13.2.1　如何渲染 398 13.2.2　如何计算布局区域 399 13.2.3　如何实现折叠与展开 402 13.3　锚定位布局 405 13.3.1　AnchorLayout布局 405 13.3.2　AbsoluteLayout布局 407 13.3.3　FormLayout布局 408 13.4　自适应布局 409 13.4.1　FitLayout 410 13.4.2　AccordionLayout 410 13.4.3　CardLayout 412 13.5　表行列布局 413 13.5.1　ColumnLayout 413 13.5.2　RowLayout 414 13.5.3　TableLayout 415 13.6　Box布局 418 13.7　如何扩展TableFormLayout 420 13.8　小结 422 第14章　Ext JS Form的交互式表单 423 14.1　FormPanel聚散地 423 14.1.1　Form关系图 423 14.1.2　与BaseForm关联 425 14.1.3　与Field关联 426 14.1.4　验证操作 427 14.1.5　数据处理 429 14.1.6　FieldSet 433 14.2　Field组件 434 14.2.1　Field的创建 435 14.2.2　Field的验证 436 14.3　文本输入组件 438 14.3.1　单行文本输入组件 438 14.3.2　多行文本输入组件 441 14.3.3　文本编辑组件 442 14.4　选择组件 447 14.4.1　单个选择组件 447 14.4.2　选择组 448 14.5　下拉组件 452 14.5.1　TriggerField 452 14.5.2　Combox 454 14.5.3　多选组件扩展 459 14.6　注册页面的实现 465 14.6.1　基本的Form组件应用 465 14.6.2　上传处理 468 14.7　小结 471 第15章　Ext Grid组件让数据更直观 472 15.1　认识Ext JS 的Grid 472 15.1.1　概述 472 15.1.2　如何创建GridPanel 473 15.1.3　GridPanel如何运行 474 15.1.4　可编辑的GridPanel 476 15.2　列模式 480 15.2.1　CM分析 480 15.2.2　CM的高级应用 482 15.3　选择模式 485 15.3.1　RowSelectionModel 485 15.3.2　CheckboxSelectionModel 488 15.4　视图 489 15.4.1　Grid生成HTML内容 489 15.4.2　如何构建表结构 491 15.4.3　导入数据 495 15.4.4　通过流程进一步分析 497 15.5　分页栏 499 15.5.1　载入数据进行显示 500 15.5.2　请求数据 501 15.6　对Grid的改进 502 15.6.1　下拉框编辑的问题 502 15.6.2　嵌套表格的问题 505 15.6.3　多表头操作 507 15.7　单元格实现跨列运算 509 15.7.1　单元格多选模式 510 15.7.2　公式统计计算 512 15.7.3　应用实例 515 15.8　小结 516 第16章　深入Ext JS 的树形展示 517 16.1　树组件的原理 517 16.2　Ext JS树组件的分析 519 16.2.1　树的创建 520 16.2.2　树的生命周期分析 520 16.3　树组件节点 522 16.3.1　基本节点 522 16.3.2　TreeNode类 523 16.4　树组件的事件 529 16.4.1　事件的流程 529 16.4.2　事件的选择模式 532 16.5　完善树的功能 533 16.5.1　树的数据 533 16.5.2　编辑、过滤及排序 536 16.6　ECOTree的实现 540 16.6.1　树的基本实现 541 16.6.2　节点的实现 547 16.6.3　折叠、编辑、拖曳及其他完善 550 16.7　小结 554 第17章　基于Ext JS Menu组件的快速开发 555 17.1　Action类 555 17.1.1　Action类的作用 555 17.1.2　Action类的运行流程 556 17.2　Button类 558 17.2.1　生命周期 558 17.2.2　样式处理 559 17.2.3　状态切换 560 17.3　开发个性的工具栏 562 17.3.1　如何解析工具项 562 17.3.2　如何进行布局 563 17.3.3　竖形工具栏的实现 566 17.4　自己来设计菜单栏 568 17.4.1　菜单的显示 568 17.4.2　菜单的动作 570 17.5　类UE编辑器的实现 572 17.5.1　基本的编辑器 572 17.5.2　活动工具栏 574 17.6　小结 578 备了丰富的应用实例，在充分理解源 码的基础上，对Ext JS进行了大量实用性强的扩展。 　　本书可以作为Web应用开发的参考手册，适合具备一定HTML和JavaScript基础的开发人员学习， 特别适合从事RIA Web开发的人员自学参考，也可以作为Ext JS应用开发的培训教材。 媒体评论 随着浏览器的不断进步和RIA（Rich Interface Application。）的逐渐流行，JS（JavaScript）这门历史悠久的开发技术不断焕发出新的生机，开发人员为JS开发出各种框架，来提升开发的质量与效率，以适应Web 2．0时代Web应用程序的开发。在众多的框架中，Ext JS以其独特的设计、强大的功能和开源的优势，获得了巨大的成功。 　　本书的作者通过清晰的实例，详细讲述了Ext JS的核心概念和实际应用，体现了作者高度的理论修养和丰富的实践经验。读者既可以从中体会Ext JS框架的设计思想，也可以直接按照书中的实例进行操作，解决开发中遇到的问题。同时，本书行文流畅，逻辑严谨，改变了通常技术书籍晦涩难懂的形象，这是本书的又一亮点。 　　——诺和诺德(中国)科技有限公司，NNIT(China)，高级开发技术研究与培训专家，杜新润 　　本书很全面地讲解了Ext JS框架，以及其他类似的JavaScript框架，能让初学者很快上手。通过不同的开发环境，如VS、dw、Eclipse，配置Ext JS的智能感应功能，提高Ext JS的开发效率与开发速度。对Ext JS的体系结构描述清楚，通俗易懂，通过简单的例子，介绍了Ext JS 3．0对UI的应用、DOM元素、事件、数据的处理等。逻辑层次清晰，由浅入深地进述了Ext√S的点点滴滴。虽然只看了部分章节，但也能体会作者对Ext JS的每一个要点都讲得很详细，是一本难得的好书。 　　——中国软件工程网，全体开发工程师 　　本书层次清晰，层层深入地进行例子讲解，案例丰富，介绍了Ext JS的概念和应用技巧。结合实际的项目讲解Ext JS在UI和整体项目上的应用特点，值得前端设计人员和Ajax爱好者学习。 　　——成都微核科技，界面工程师，David．heii.R ExtJS源码分析与开发实例宝典 目录: 第1部分　快速入门 1 第1章　Web如此美丽，初探Ext JS 2 1.1　Ext JS是什么 2 1.2　为什么选择Ext JS 3 1.3　如何学习Ext JS 5 1.3.1　获取源码并部署 5 1.3.2　开发工具的智能提示 5 1.3.3　文档和实例的学习 8 1.3.4　学习论坛 9 1.4　Ext JS体系结构 9 1.4.1　体系结构 9 1.4.2　文件结构 11 1.5　小结 13 第2章　Ext JS 3.0实例入门 14 2.1　准备工作，配置环境 14 2.2　看似简单的登录页面，隐藏好大的学问 15 2.2.1　页面布局 16 2.2.2　表单布局 18 2.2.3　验证码 20 2.2.4　表单验证 21 2.2.5　表单提交 22 2.3　主框架页面 24 2.3.1　主框架页面布局 26 2.3.2　左边导航菜单 28 2.3.3　右边工作区域 30 2.4　子页面 32 2.4.1　数据处理 32 2.4.2　列表 34 2.5　小结 35 第2部分　核心技术 37 第3章　Ext JS核心基础 38 3.1　继承的扩展 38 3.1.1　对象的继承 38 3.1.2　类的继承 39 3.1.3　Ext.extend扩展 40 3.2　函数的扩展 42 3.2.1　从一个错误说起 42 3.2.2　函数的委托 43 3.3　数组及集合 44 3.3.1　JavaScript数组 45 3.3.2　Ext JS集合操作 46 3.4　String的转换 50 3.4.1　String转换的基本知识 50 3.4.2　String和JSON转换 50 3.4.3　查询字符串与对象转换 52 3.5　Date的使用 53 3.5.1　日期格式化 53 3.5.2　日期的比较及计算 55 3.6　定时任务 56 3.6.1　有状态的定时任务管理 56 3.6.2　定时任务管理器 58 3.7　小结 60 第4章　你必须知道的Ext JS事件机制 61 4.1　浏览器事件机制 61 4.2　Ext JS元素事件 63 4.2.1　Event对象 63 4.2.2　EventManager 67 4.3　基本事件扩展 71 4.3.1　DomReady处理 71 4.3.2　快捷键的实现 72 4.3.3　导航键的实现 74 4.3.4　鼠标按住事件 75 4.4　Ext JS组件事件 76 4.4.1　事件对象 77 4.4.2　组件的事件机制 78 4.4.3　基于拦截的事件实现 81 4.4.4　组件及元素事件结合 83 4.5　扩展TabBox事件 84 4.5.1　焦点 84 4.5.2　扩展TabBox导航 85 4.5.3　自定义TabBox事件 87 4.6　小结 89 第5章　模板模型，组件开发的基石 90 5.1　Ext JS模板概述 90 5.2　正则表达式基础 91 5.2.1　正则表达式引擎 91 5.2.2　字符匹配 93 5.2.3　选择、分组及引用 95 5.3　正则表达式的使用 97 5.3.1　exec和match 97 5.3.2　replace函数 97 5.4　基本模板 99 5.4.1　模板的构建 99 5.4.2　应用动态数据 100 5.4.3　编译模板 101 5.5　扩展模板 103 5.5.1　实现原理 104 5.5.2　编译Xtemplate模板 107 5.5.3　为Xtemplate应用动态数据 110 5.6　模板问题及改进 110 5.6.1　模板的问题 110 5.6.2　问题的解决 112 5.7　通信录的实现 114 5.7.1　应用DataView 115 5.7.2　数据分页和过滤 117 5.7.3　通信录中的信息 118 5.8　小结 119 第6章　改善用户体验，交互数据模型 120 6.1　Ajax请求 120 6.1.1　从网络通信协议开始 120 6.1.2　手动实现Ajax 123 6.1.3　便利函数让调用更加方便 126 6.1.4　表单请求 127 6.1.5　跨域请求 131 6.2　Direct请求 134 6.2.1　Comet请求 134 6.2.2　RPC请求 137 6.3　代理请求 141 6.3.1　REST风格 141 6.3.2　代理请求的处理过程 142 6.3.3　MemoryProxy的扩展 145 6.4　数据解析的实现 147 6.4.1　定义表结构 147 6.4.2　解析表数据 152 6.4.3　数组解析的扩展 156 6.5　数据回写 157 6.5.1　组装请求参数 157 6.5.2　保存之后更新 159 6.6　数据存储 160 6.6.1　构建Store对象 160 6.6.2　载入数据 162 6.6.3　保存数据 164 6.7　DWR数据交互 166 6.7.1　DWR请求扩展 167 6.7.2　DWR数据解析 169 6.7.3　CRUD操作 171 6.8　小结 172 第3部分　基于元素的开发 173 第7章　元素扩展，让开发更灵活 174 7.1　Ext. DomHelper类 174 7.1.1　元素创建 174 7.1.2　元素插入 175 7.2　Ext.DomQuery类 178 7.2.1　实现原理 179 7.2.2　查询及过滤实现 180 7.2.3　编译解析 182 7.3　Ext JS元素架构 185 7.3.1　Ext.Element元素 185 7.3.2　Ext.CompositeElementLite 187 7.4　表单实例 189 7.4.1　实现并载入表单 189 7.4.2　计算相关费用 191 7.5　小结 195 第8章　Ext JS样式的完美应用 196 8.1　样式基本操作 196 8.1.1　创建元素 197 8.1.2　元素定位 198 8.1.3　可视及其他 199 8.2　 JS操作样式 200 8.2.1　style的操作 201 8.2.2　class的操作 203 8.2.3　动态加入CSS Rules 204 8.2.4　重构它们 206 8.3　Dimensions操作 207 8.3.1　宽高操作 208 8.3.2　坐标定位操作 211 8.3.3　重构它们 214 8.4　相对定位与约束 215 8.4.1　元素相对定位 216 8.4.2　scroll定位 219 8.4.3　Resize元素定位的实现 220 8.5　ImageCropper的实现 224 8.5.1　创建容器 225 8.5.2　创建三层图片并载入 226 8.5.3　初始化Resize和拖曳 227 8.5.4　显示选择内容 229 8.6　小结 231 第9章　让Web页面动起来 232 9.1　动画的原理 232 9.1.1　原理实现 232 9.1.2　改进的实现 234 9.2　Ext JS动画实现 237 9.2.1　Ext JS动画管理器 237 9.2.2　动画对象 238 9.3　动画的进一步深入 243 9.3.1　动画类型 243 9.3.2　动画算法 247 9.3.3　Fx特效处理 251 9.4　扩展Ext JS矢量图 254 9.4.1　excanvas基本应用 254 9.4.2　excanvas高级应用 261 9.5　交互式动画报表图 266 9.5.1　基本折线图 266 9.5.2　动画的实现 273 9.5.3　交互式选择的实现 275 9.5.4　ToolTip的实现 279 9.6　小结 282 第10章　拖曳技术，让用户也动起来 283 10.1　Ext JS拖曳原理剖析 283 10.1.1　如何选中元素 283 10.1.2　如何实现鼠标移动位置 284 10.1.3　如何确定元素目标位置 285 10.2　Ext JS拖曳架构 285 10.2.1　拖曳共性处理 285 10.2.2　拖曳个性处理 289 10.3　拖曳形式的选择题应用 297 10.3.1　选择题的实现 297 10.3.2　选项拖曳的实现 299 10.4　拖曳高级扩展 303 10.4.1　拖曳元素状态处理 304 10.4.2　目标元素状态处理 306 10.4.3　把拖曳目标和拖曳元素综合起来 311 10.5　拖曳定制流程 315 10.5.1　基本的流程图 315 10.5.2　拖曳的实现 319 10.5.3　拖曳的完善 324 10.6　小结 327 第4部分　深入组件的开发 329 第11章　Ext JS组件模型的架构解析 330 11.1　认识Ext JS组件 330 11.2　生命周期设计 332 11.2.1　初始化 332 11.2.2　渲染表现 334 11.2.3　销毁组件，释放系统资源 335 11.3　可扩展性设计 337 11.3.1　类继承的支持 337 11.3.2　事件的支持 337 11.3.3　插件的支持 338 11.3.4　可配置的支持 338 11.3.5　模板方法的支持 339 11.4　可管理性设计 339 11.4.1　全局统一管理 339 11.4.2　组件类别管理 340 11.4.3　内部状态管理 340 11.5　组件分析法 343 11.5.1　生命周期分析 343 11.5.2　配置项分析 345 11.5.3　方法及属性分析 345 11.5.4　事件分析 347 11.5.5　组件特性 347 11.6　如何自定义组件 348 11.6.1　组件的需求 348 11.6.2　按生命周期来编写组件 348 11.6.3　重构 349 11.6.4　编写文档 350 11.7　小结 350 第12章　Ext JS面板，信息提示更人性化 351 12.1　浮动层（Layer） 351 12.1.1　shim实现 351 12.1.2　shadow实现 352 12.1.3　约束定位 355 12.1.4　浮动层显示 357 12.2　容器（Container）布局 359 12.2.1　生命周期分析 359 12.2.2　容器特性 361 12.3　面板（Panel）布局 363 12.3.1　面板组成 363 12.3.2　面板样式 367 12.3.3　面板的折叠/展开 370 12.4　窗体（Window）布局 372 12.4.1　最大最小化 372 12.4.2　改变大小 375 12.4.3　窗体显示问题 376 12.5　工具提示 377 12.5.1　Ext.Tip类 377 12.5.2　Ext.ToolTip类 378 12.5.3　Ext.QuickTip类 379 12.6　气球提示（BalloonTip) 382 12.6.1　实现BalloonTip组件 383 12.6.2　进一步完善 388 12.7　小结 393 第13章　Ext JS 华丽的容器布局 394 13.1　认识布局的流程 394 13.1.1　布局概述 394 13.1.2　布局的流程 395 13.2　Border布局 397 13.2.1　如何渲染 398 13.2.2　如何计算布局区域 399 13.2.3　如何实现折叠与展开 402 13.3　锚定位布局 405 13.3.1　AnchorLayout布局 405 13.3.2　AbsoluteLayout布局 407 13.3.3　FormLayout布局 408 13.4　自适应布局 409 13.4.1　FitLayout 410 13.4.2　AccordionLayout 410 13.4.3　CardLayout 412 13.5　表行列布局 413 13.5.1　ColumnLayout 413 13.5.2　RowLayout 414 13.5.3　TableLayout 415 13.6　Box布局 418 13.7　如何扩展TableFormLayout 420 13.8　小结 422 第14章　Ext JS Form的交互式表单 423 14.1　FormPanel聚散地 423 14.1.1　Form关系图 423 14.1.2　与BaseForm关联 425 14.1.3　与Field关联 426 14.1.4　验证操作 427 14.1.5　数据处理 429 14.1.6　FieldSet 433 14.2　Field组件 434 14.2.1　Field的创建 435 14.2.2　Field的验证 436 14.3　文本输入组件 438 14.3.1　单行文本输入组件 438 14.3.2　多行文本输入组件 441 14.3.3　文本编辑组件 442 14.4　选择组件 447 14.4.1　单个选择组件 447 14.4.2　选择组 448 14.5　下拉组件 452 14.5.1　TriggerField 452 14.5.2　Combox 454 14.5.3　多选组件扩展 459 14.6　注册页面的实现 465 14.6.1　基本的Form组件应用 465 14.6.2　上传处理 468 14.7　小结 471 第15章　Ext Grid组件让数据更直观 472 15.1　认识Ext JS 的Grid 472 15.1.1　概述 472 15.1.2　如何创建GridPanel 473 15.1.3　GridPanel如何运行 474 15.1.4　可编辑的GridPanel 476 15.2　列模式 480 15.2.1　CM分析 480 15.2.2　CM的高级应用 482 15.3　选择模式 485 15.3.1　RowSelectionModel 485 15.3.2　CheckboxSelectionModel 488 15.4　视图 489 15.4.1　Grid生成HTML内容 489 15.4.2　如何构建表结构 491 15.4.3　导入数据 495 15.4.4　通过流程进一步分析 497 15.5　分页栏 499 15.5.1　载入数据进行显示 500 15.5.2　请求数据 501 15.6　对Grid的改进 502 15.6.1　下拉框编辑的问题 502 15.6.2　嵌套表格的问题 505 15.6.3　多表头操作 507 15.7　单元格实现跨列运算 509 15.7.1　单元格多选模式 510 15.7.2　公式统计计算 512 15.7.3　应用实例 515 15.8　小结 516 第16章　深入Ext JS 的树形展示 517 16.1　树组件的原理 517 16.2　Ext JS树组件的分析 519 16.2.1　树的创建 520 16.2.2　树的生命周期分析 520 16.3　树组件节点 522 16.3.1　基本节点 522 16.3.2　TreeNode类 523 16.4　树组件的事件 529 16.4.1　事件的流程 529 16.4.2　事件的选择模式 532 16.5　完善树的功能 533 16.5.1　树的数据 533 16.5.2　编辑、过滤及排序 536 16.6　ECOTree的实现 540 16.6.1　树的基本实现 541 16.6.2　节点的实现 547 16.6.3　折叠、编辑、拖曳及其他完善 550 16.7　小结 554 第17章　基于Ext JS Menu组件的快速开发 555 17.1　Action类 555 17.1.1　Action类的作用 555 17.1.2　Action类的运行流程 556 17.2　Button类 558 17.2.1　生命周期 558 17.2.2　样式处理 559 17.2.3　状态切换 560 17.3　开发个性的工具栏 562 17.3.1　如何解析工具项 562 17.3.2　如何进行布局 563 17.3.3　竖形工具栏的实现 566 17.4　自己来设计菜单栏 568 17.4.1　菜单的显示 568 17.4.2　菜单的动作 570 17.5　类UE编辑器的实现 572 17.5.1　基本的编辑器 572 17.5.2　活动工具栏 574 17.6　小结 578