Ext学习_Window窗口1

Ext.namespace("com.deng");
/**
 * Panel的子类-Window窗口
 * Window是Panel的子类，Ext.Window = Ext.extend(Ext.Panel,{}),从源代码可以看出
 * Window继承自Panel，意味着Window具体Panel的所有特征，并且具有自己的个性
 * 从外观上来看Window对象更像Window操作系统中的窗口，有标题栏、关闭按钮，默认显示在页面最中间、能够拖到
 * 改变窗口大小、自动激活选中窗口，Window必须使用show()方法才会显示出来，render方法和renderTo对它来说无用。
 * 
 * Window有两种类型： 模式窗口和非模式窗口，默认为后者。模式窗口在窗口没有关闭之前无法对其它组件作任何操作，等
 * 同于Ext.Msg.alert(),默认情况下，Window接受ESC按键，按下ESC按键，窗口会自动关闭
 * 因为Ext.Window继承自Ext.Panel,所以很多用法非常类似，一个典型的Ext.Window对象包含标题栏、关闭按钮,这也是
 * 默认行为
 */
/**
Ext.onReady(function(){
	new Ext.Window({
		title: "窗口",
		width: 400,
		height: 300
	}).show(Ext.getBody());
});
*/

/**
 * Window要通过show()方法才能显示，参数为动画参照物，窗口会从参照物上飞出，如果不指定参数，则没有动画效果
 * Window是一个容器，可以通过下面三种方法往Window正文区域放置内容
 * 1. 直接配置html属性
 */
/**
Ext.onReady(function(){
	new Ext.Window({
		title: "窗口",
		width: 400,
		height: 300,
		html: "显示内容的窗口",
		bodyStyle: "padding: 5px"
	}).show(Ext.getBody());
});
*/
/**
 * bodyStyle配置选项是Window正文区域的样式，填充间距被设置成5个像素，防止内容和窗口边框挨得太近
 * 2.将另一个文件中的内容加载到Window中
 */
/**
Ext.onReady(function(){
	new Ext.Window({
		title: "窗口2",
		width: 400,
		height: 300,
		bodyStyle: "padding: 5px",
		autoLoad: {url: "inner.html",scripts:true}
	}).show(Ext.getBody());
});