概括ExtJS

ExtJS框架入门

最新推荐文章于 2025-12-02 21:20:38 发布

最新推荐文章于 2025-12-02 21:20:38 发布 · 67 阅读

文章标签：

#java #javascript #人工智能 #ViewUI

话说，第一次听说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

其中如下：

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 触发录入项