EXT简单介绍
1. EXT4.* 介绍
ExtJS是一个用javascript、css、和HTML等技术在实现的主要用于RIA即富客户端,且与后台技术无关的前端Ajax框架.
常用于企业内部管理系统,行政系统等SAP类型的应用.
1.1 特点
- 提供了非常多的丰富、功能强大的组件。
- 面向组化件开发，区别于jQuery的面向Dom开发。
- 跨浏览器支持：IE、Chrome、Firefox、Safari、Opera。
- 框架体积庞大，适合编写内网项目。(ExtJS4.2.1的ext-all.js大小为1.46M)
###1.2 使用协议### ExtJS提供2种使用协议：GPL3.0(免费) 和 商业协议(付费)。
###1.3 MVC模式###
ExtJS是一个MVC模式的框架
ExtJS是一个MVC模式的框架(在ExtJS 5中加入了MVVM模式)。(由于公司所做系统是基于4.版本的所以我直接从这里开始学习)
MVC，全称为Model-View-Controller，即模型 - 视图 - 控制器，是一个用于编写软件的架构模式。它把软件系统分为三个基本部分：模型（Model）、视图（View）和控制器（Controller）。此模式通过对复杂度的简化，使程序结构更加直观。
ExtJS 4对各个部分定义的功能：
Model(模型) ：用于封装与应用程序的业务逻辑相关的数据以及对数据的处理方法。一个数据字段的集合，可通过关联被链接到其他模型和通过代理链接到一个数据流。
View(视图) ：表示数据给用户。任何类型的组件，这些组件将信息输出到浏览器，如Form、Grid、Chart。
Controller(控制器) ：是MVC应用程序的逻辑部分。它处理事件并作出响应。“事件”包括用户的行为和数据 Model 上的改变。Ext.app.Controller为控制器的基类。
###2.资源说明###
###2.1 资源目录###
###2.1.1###
builds ：ExtJS压缩后的代码,经过压缩的代码体积更小,加载更快.
docs ：ExtJS的文档目录,index.html可查看EXTJS的API,Guides,Examples.
examples ：Demo源码目录,index.html可查看Demo列表.
locale ：多语言资源目录,其中ext-lang-zh_CN.js为简体中文.
resources ：ExtJS所用到的样式和图片等资源.
src ：各组件的与源目录. welcome ：访问页目录
###2.1.2 文件### ext-all.css : 一个页面首先引入的css文件;
ext.js : 已压缩的js代码,基本框架,动态加载扩展类.
ext-all.js : 已压缩的js代码,包括ExtJS整个框架.通常用于页面的引用,在css之后引入.
ext-all-debug.js : 未压缩的JS代码,包括ExtJS整个框架,用于开发调试.
###2.2 组件###
###2.2.1组件分类### ExtJS 的组件大致分为三类: 基本组件, 工具栏组件,表单及元素组件
基本组件 :如:Panel, Container, Tab, Button, 等
工具栏组件: Menu, Toolbar, DatePicker等
表单组件:Form, CheckBox, ComboBox, Date Field, HTML Editor, label, Text Field等等
###2.2.2 组件名称###
要想调用组件,就需要知道组建的名字,在ExtJS 中组件包含className和xtype两种名字.
class: 类名; ExtJS采用命名空间的方式定义了所有的类,其中也包含了组件.如: form(表单)的class为Ext.form.Panel,表示Ext->form命名空间下的Panel组件.
xtype: 每个组件有一个名为’xtype’的符号名,也可以理解为组建的简称,并且组件的xtype为全局唯一性.如Ext.panel.Panel的xtype为panel；Ext.form.Panel的xtype为form。如Ext.panel.Panel的xtype为panel；Ext.form.Panel的xtype为form。
###2.2.3 配置###
常见的配置项：
requires: 在自定义类的时候，需要引用其他类的时候，就需要该配置项，Extjs在实例化这些类的时候，先自动去加载requires中的类，以避免这些类因未被加载而造成的错误。
extend: 在自定义类的时候，用来指定该自定义类将从哪个类扩展
items: 用来定义当前组建的子组件
xtype: 用来说明当前配置对象使用的时哪个类
id: 为组件定义一个唯一的id，以便查找组件，该id也会作为组件最终的HTML代码的id
itemId: 作用与id类似，不过不会将它作为组件最终的HTML代码的id，而且，该id的使用范围也被限制在容器内，这样做避免由于id太多，造成的id冲突
scope: 用来定义作用域，
defaults: 用来简化组件定义代码的配置项，当父组件有了该配置项的时候，在创建子组件的时候，会将该配置项中定义的配置应用到子组件中。
defaultType：用来设置子组件的默认类型，这样子组件就不用每个都写xtype
layout: 用来定义容器的布局.