ExtJS4.0快速入门：创建动态窗口
需积分: 12 12 浏览量
更新于2024-07-29
1
收藏 241KB DOC 举报
"ExtJS4.0学习笔记大全是一份详细记录作者在学习过程中对Ext JS 4版本的理解和实践经验的资料。在本篇笔记中，作者重点介绍了如何在Ext JS 4中使用新的组件创建方式，即`Ext.create()`函数来创建`Window`组件。这个新特性使得开发者能够动态加载所需的JS，避免一次性加载庞大的`ext-all.js`，从而提高性能。
首先，作者提供了HTML结构，包括`DOCTYPE`声明、`<head>`部分的元数据设置（如字符集和CSS和JS引用）以及JavaScript的`Ext.onReady`函数，这是Ext JS框架中常见的初始化脚本。在`onReady`函数中，作者展示了如何使用`Ext.create('Ext.Window', {...})`创建两个不同的窗口实例。每个窗口的属性被明确地定义，例如窗口的宽度、高度、位置（x和y坐标）、是否平铺（plain），以及标题栏的位置（默认在顶部，此处设置为左侧，通过`headerPosition`属性）。
`plain:true`参数表示窗口没有工具栏、菜单等附加元素，只包含基本的标题和关闭按钮。这有助于保持窗口简洁，并且符合现代Web设计的轻量级原则。
通过这些例子，读者可以了解到如何在Ext JS 4中快速、高效地创建和定制窗口组件，这对于开发人员来说是非常实用的知识点。同时，这份笔记也突出了Ext JS 4引入的新特性对提升开发效率的重要性，对于想要深入学习和使用Ext JS 4的开发者来说，这是一份非常有价值的参考资料。"
defaults:{margins:'0 5 0 0'},
items:[{
xtype:'button',
text: 'Small Size'
},{
xtype:'button',
scale: 'medium',
text: 'Medium Size'
},{
xtype:'button',
scale: 'large',
text: 'Large Size'
}]
}]
})
d3.render('d3');
})
Ext.onReady(function(){
var d1 = Ext.create('Ext.Panel',{
title:'HBox 顶对齐，且组件在容器的左边',
frame:true,
width:600,
height:100,
items:[{
anchor:'100%',
layout: {
type:'hbox',
padding:'10',
pack:'start',
align:'top'
},
defaults:{margins:'0 5 0 0'},
items:[{
xtype:'button',
text: 'Button 1'
},{
xtype:'button',
text: 'Button 2'
},{
xtype:'button',
text: 'Button 3'
},{
xtype:'button',
text: 'Button 4'
剩余21页未读，继续阅读
2011-12-19 上传
2019-11-11 上传
2011-06-15 上传
点击了解资源详情
2012-08-30 上传
2013-02-02 上传
点击了解资源详情
Delphi_solucky
- 粉丝: 0
- 资源: 4
我的内容管理
展开
最新资源
- 开源通讯录备份系统项目，易于复刻与扩展
- 探索NX二次开发：UF_DRF_ask_id_symbol_geometry函数详解
- Vuex使用教程：详细资料包解析与实践
- 汉印A300蓝牙打印机安卓App开发教程与资源
- kkFileView 4.4.0-beta版：Windows下的解压缩文件预览器
- ChatGPT对战Bard：一场AI的深度测评与比较
- 稳定版MySQL连接Java的驱动包MySQL Connector/J 5.1.38发布
- Zabbix监控系统离线安装包下载指南
- JavaScript Promise代码解析与应用
- 基于JAVA和SQL的离散数学题库管理系统开发与应用
- 竞赛项目申报系统：SpringBoot与Vue.js结合毕业设计
- JAVA+SQL打造离散数学题库管理系统：源代码与文档全览
- C#代码实现装箱与转换的详细解析
- 利用ChatGPT深入了解行业的快速方法论
- C语言链表操作实战解析与代码示例
- 大学生选修选课系统设计与实现：源码及数据库架构
