Ext2.2正式发布了,刚下载体验了下。
在ext官方网上下载 www.extjs.com
EXT下载:http://extjs.com/products/extjs/download.php
完整信息:http://extjs.com/blog/2008/08/04/ext-22-released/
Every component has a specific xtype, which is its Ext-specific type name, along with methods for checking the xtype like getXType and isXType. 下面就是这些可以使用了控件的列表了,我直接从它的帮助文档复制过来,并同时加上了它的英文原文,因为每次看到这段我总是能够想起什么,呵呵:
Ext组件主要包括一些常用组件,如表单组件,数据组件,导航组件,相信大家看名称就知道什么意思了.
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
propertygrid Ext.grid.PropertyGrid
slider Ext.Slider
splitbutton Ext.SplitButton
statusbar Ext.StatusBar
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
checkbox Ext.form.Checkbox
combo Ext.form.ComboBox
datefield Ext.form.DateField
field Ext.form.Field
fieldset Ext.form.FieldSet
hidden Ext.form.Hidden
htmleditor Ext.form.HtmlEditor
label Ext.form.Label
numberfield Ext.form.NumberField
radio Ext.form.Radio
textarea Ext.form.TextArea
textfield Ext.form.TextField
timefield Ext.form.TimeField
trigger Ext.form.TriggerField
Ext的每个组件都是有一个指定的Xtype属性值,通过该值就可以得到该组件的类型,同时也可以根据该组件来定义一个组件 例如:
{xtype:"button",id:"btnEnter",text:"确定"} //这就是定义了一个按钮的组件.
{xtype:"field",id:"txtName"} //这就是定义了一个输入框的组件.
{xtype:"field",id:"txtPwd",inputType:"password"} //这就是定义了一个密码框的组件.
当然你可以不用xtype 比如:
var btnEnter = new Ext.Button({id:"btnEnter",text:"确定"} );//这就是定义了一个按钮的组件.
var txtName = new Ext.form.Textfield({id:"txtName"} );//这就是定义了一个输入框的组件.
var txtPwd = new Ext.form.Textfield({id:"txtPwd",inputType:"password"} );//这就是定义了一个密码框的组件.
是不是很简单,在下面会解说具体的示例,包括它的基本的语法结构,同时,你需要明确,这和你在javascript里面的用法不会有不同的地方,只是有些方法Ext已经给我们封装好了,我们只要有拿来主义的精神就可以.特别一说的是:Ext的一些很实用的类都是全局的,无须new了,直接用就可以.
在下节会介绍一些Ext的很好的很实用的也很简单就能够使用的Util类.
该示例演示的是:定义一个Ext的按钮组件,点这个按钮后就会弹出一个非常精美的Ext式样的消息框.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ExtJS</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript" src="../examples.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<%--既然Ext是基于javascript的,所以我们要把Ext的东东包裹在javascript里面--%>
<script type="text/javascript">
//定义一个函数,在里面定义一个弹出按钮,当网页上出现弹出按钮后,点击就会出现hello世界了.
function ready()
{
// 下面openMs就是出发事件后所执行的函数
var openMsg = function()
{
//alert("good");比较下ext的弹出消息框是多么多么的令人狂喜
Ext.Msg.alert("提示消息,可以自定义","hello世界-hello世界-hello世界-hello世界");
};
//定义Ext的按钮
var 弹出按钮 = new Ext.Button
({
id:"btnOpen", //定义按钮的ID
text:"弹出按钮", //定义按钮的标题
handler:openMsg, //定义按钮出发的事件,handler后面直接写函数的名称openMsg
//也可以写成下面这样,本质是一样的,效果也是一样的
//handler:function(){Ext.Msg.alert("提示消息,可以自定义","hello世界-hello世界-hello世界-hello世界"); },
renderTo:document.body//将弹出按钮渲染到窗体上
});
}
Ext.onReady(ready);//里面的参数就是上面定义的函数
//onReady是使用Ext的入口,只有在上面所说的Ext框架全部加载完成后,才会执行Ext.onReady里面所包含的函数,就是说具体执行什么函数,由Ext的onReady方法指定.
//当然onReady这个Ext方法总共有三个参数,为了力求简单,这里先使用一个参数,在提高篇里面则会详细讲解.
</script>
</div>
</form>
</body>
</html>
效果如:
- 大小: 5.6 KB
分享到:
相关推荐
EXT使用的时候,需要引用js文件,在博客中,ext的学习笔记(1)详细介绍了用法,欢迎使用
2. EXT_JS实用开发指南_个人整理笔记.docx:这是一份个人整理的学习笔记,可能包含了一些实战经验,对于学习EXT JS的实际应用和解决常见问题很有帮助。 3. ExtJS实用开发指南.pdf:同名但格式不同的文档,可能提供了...
### ExtJS 学习笔记概览 #### 一、ExtJS 入门 **1.1 ExtJS 构成及如何引用** ExtJS 是一款基于 JavaScript 的开源框架,专为 Web 应用程序的前端界面设计。其核心优势在于提供了一套丰富的 UI 组件和强大的数据...
### Java学习笔记知识点总结 #### 一、JVM与内存管理 **1.1 JVM基本概念** - **JVM(Java Virtual Machine)**: Java虚拟机是执行Java字节码的虚拟机,它提供了运行Java程序所需的环境。 **1.2 线程** - **线程...
### GRUB 学习笔记 —— 引导 Linux 和 XP #### 1. 启动管理器概述 启动管理器是一段重要的程序,通常被放置于磁盘的开始扇区,比如硬盘上的主引导记录(Master Boot Record, MBR)。当计算机完成自检后,BIOS...
### Linux知识学习笔记 #### 一、Linux操作系统概述 Linux是一种开源、免费的类Unix操作系统,自1991年由芬兰学生Linus Torvalds创建以来,迅速在全球范围内获得了广泛的关注和支持。它不仅具备强大的稳定性,还...
### Liferay6官方培训学习笔记:开发环境搭建与数据库配置详解 #### 一、开发环境搭建 Liferay是一款基于Java的开源企业级门户框架,它提供了丰富的功能和强大的定制能力,适用于构建各种复杂的Web应用程序。在...
### 深入Java虚拟机JVM类加载学习笔记 #### 一、Classloader机制解析 在Java虚拟机(JVM)中,类加载器(ClassLoader)是负责将类的`.class`文件加载到内存中的重要组件。理解类加载器的工作原理对于深入掌握JVM以及...
《Ext2.2 API中文版(最终完成版).CHM》是EXTJS 2.2版本的API中文手册,涵盖了该版本的所有类、方法、属性和事件,是开发者日常编程的重要参考。通过这个文档,你可以快速查找EXTJS 2.2中的各个组件和功能,理解其...
### OMAP_L138 学习笔记之 EMIFA(External Memory Interface A) #### EMIFA 概述 在 OMAP_L138 微处理器中,EMIFA(External Memory Interface A)作为一个重要的组成部分,提供了对外部存储器(如 NOR Flash、...
1. 引入ExtJS的CSS文件,如`extjs-4.1.1/resources/css/ext-all.css`。 2. 引入ExtJS的核心库文件,通常是`extjs-4.1.1/ext-all.js`或`extjs-4.1.1/ext-all-debug.js`。 这种固定的引用顺序确保了CSS样式能够正确...
首先,我们看到"Ext3.2中文API(最终完成版2010-12-05).CHM"和"Ext2.2API中文版(最终完成版).CHM",这两个文件都是关于ExtJS的API文档。ExtJS是一个基于JavaScript的开源富客户端框架,用于构建桌面级的Web应用。...
### RHCE6 学习笔记知识点总结 #### 一、RHEL6.1无人值守安装 ##### 1.1 配置FTP服务器放置安装源 - **步骤**: - 插入安装光盘。 - 将光盘挂载到`/var/ftp/pub`目录:`mount /dev/cdrom /var/ftp/pub`。 - ...
* 选择进入分区1,然后EXT3格式化磁盘分区 * 正在进行格式化分区 * 正在进行安装 * 安装成功后界面 3.实验结果 通过本实验,我们成功地安装了WIN2003 SERVER和RED HAT LINUX 9.0的双系统,总结了实验的步骤和相关...
环境:ubuntu16.04,python2.7.12 版本:networkx==2.2, matplotlib==1.5.1, numpy==1.11.0 官方文档:...graph.add_node(1) graph.add_node(2, value=float('inf'
可以在命令行工具中使用`dd`命令或者使用`mkfs.ext3`工具来创建一个特定大小的文件作为SD卡的镜像。 - **装载SD卡**:使用`mount`命令将创建好的镜像文件挂载到模拟器的指定位置。 - **复制文件**:通过`cp`命令将...