概括ExtJS

来源:互联网 发布:上瘾网络剧发布会全程 编辑:程序博客网 时间:2024/04/29 07:32
    
   话说,第一次听说ExtJS这个东东是2010年。当时一个朋友java开发项目中一直在用ExtJS,在我面前一直在说开发如何如何快速,如何如何美观……
   可当时,因为一直没有腾出时间研究,并且项目中从没有用过,一直遵循传统jsp模式,直到此时,项目中使用,才研究其中框架以及demo测试。
    
   ExtJS简介:
   ExtJS是一个Ajax框架,是用javascript编写,主要用于客户端开发,与后台无关。 其中ExtJS可以应用在Java、.Net等语言中,其中使用ExtJSP可以快速开发丰富多彩的客户端界面。
   ExtJS版本介绍:
   从2011年4月22日,Extjs4.0正式发布。
   其中Ext从2.x开始收费。
   ExtJS官网:
   http://www.extjs.org.cn/
   ExtJS API介绍:
   如下:是3.2版本的,因为项目中使用Ext3系列
  
   adapter:Ext支持的底层库
   build:压缩后的ext全部源码
   docs:api帮助文档
   exmaples:Extdemo
   resources:css、图片都放在此文件夹下
   source:无压缩的Ext全部的源码。
   Ext-all.js:压缩后的ext全部源码
   ext-all-debug.js:无压缩用于调试的源码
   ext-core.js:压缩后的Ext的核心组件
   ext-core-debug.js:压缩后用于调试的Ext核心组件
   ExtJS引入应用:
   JSP页面引Ext的三个文件
   ext-all.css、ext-base.js、ext-all.js
   其中如下:
   <link rel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="../extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../extjs/ext-all.js"></script>
   ExtJS入口:
   一切都是从Ext.onReady开始的。如java中的main方法。
   小demo测试:
     Ext.onReady( function (){
      alert( "初始化");
  });
  ExtJS组件继承图:
  
  ExtJS组件分类:
  

Xtype

class

基本组件

box

Ext.BoxComponent 具有边框属性的组件

Button

Ext.Button   按钮

colorpalette                  

Ext.ColorPalette 调色板

component                     

Ext.Component 组件

container                     

Ext.Container 容器

cycle                         

Ext.CycleButton

dataview                      

Ext.DataView 数据显示视图

datepicker                    

Ext.DatePicker 日期选择面板

editor                        

Ext.Editor 编辑器

editorgrid                     

Ext.grid.EditorGridPanel 可编辑的表格

grid                         

Ext.grid.GridPanel 表格

paging                       

Ext.PagingToolbar 工具栏中的间隔

panel                        

Ext.Panel 面板

progress                     

Ext.ProgressBar 进度条

splitbutton                  

Ext.SplitButton 可分裂的按钮

tabpanel                     

Ext.TabPanel 选项面板

treepanel                    

Ext.tree.TreePanel 树

viewport                     

Ext.ViewPort 视图

window                        

Ext.Window 窗口

工具栏组件

toolbar                      

Ext.Toolbar 工具栏

tbbutton                     

Ext.Toolbar.Button 按钮

tbfill                       

Ext.Toolbar.Fill 文件

tbitem                       

Ext.Toolbar.Item 工具条项目

tbseparator                  

Ext.Toolbar.Separator 工具栏分隔符

tbspacer                     

Ext.Toolbar.Spacer 工具栏空白

tbsplit                      

Ext.Toolbar.SplitButton 工具栏分隔按钮

tbtext                       

Ext.Toolbar.TextItem 工具栏文本项

表单组件

form                         

Ext.FormPanel Form面板

checkbox                      

Ext.form.Checkbox checkbox录入框

combo                        

Ext.form.ComboBox combo选择项

datefield                    

Ext.form.DateField 日期选择项

field                        

Ext.form.Field 表单字段

fieldset                       

Ext.form.FieldSet 表单字段组

hidden                      

Ext.form.Hidden 表单隐藏域

htmleditor                   

Ext.form.HtmlEditor html 编辑器

numberfield                  

Ext.form.NumberField 数字编辑器

radio                        

Ext.form.Radio 单选按钮

textarea                      

Ext.form.TextArea 区域文本框

textfield                    

Ext.form.TextField 表单文本框

timefield                    

Ext.form.TimeField 时间录入项

trigger                      

Ext.form.TriggerField 触发录入项

  
  至于具体的demo使用,可以详见api文档。
 EXT3系列已上传【3.2api以及chm帮助文档】
原创粉丝点击