Window窗体组件

window是一个指定的打算作为一个应用程序窗口的面板,默认窗口是浮动的,resizable, 并且draggable,默认的,窗体靠document.body呈现。

1、示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../ext-js-4.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="../ext-js-4.2.1/ext-all.js"></script>
<script type="text/javascript" src="../ext-js-4.2.1/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function() {
var win = new Ext.Window({
title : '窗体window',
width : 500,
height : 200,
html : '<div>这里是窗体的内容</div>',
resizable : true,
modal : true,
closable : true,
maximizable : true,
minimizable : true
});
win.show();
});
</script>
</head>
<body>
<!--
说明:
(1)var win = new Ext.Window({}):创建一个新的Window窗体对象。
(2)title: '窗口':窗体的标题。
(3)width: 500,height: 200:宽度及高度。
(4)html: '<div>这里是窗体内容</div>':窗体内部显示的html内容。
(5)resizable: true:是否可以调整窗体的大小,这里设置为 true。
(6)modal: true:是否为模态窗体[什么是模态窗体?当你打开这个窗体以后,如果不能对其他的窗体进行操作,那么这个窗体就是模态窗体,否则为非模态窗体]。
(7)closable:true:是否可以关闭,也可以理解为是否显示关闭按钮。
(8)maximizable: true:是否可以最大化,也可以理解为是否显示最大化按钮。
(9)minimizable: true:是否可以最小化,也可以理解为是否显示最小化按钮。
(10)win.show():窗体展示。
     (11)draggable : true:是否可以拖动窗体,false代表不可拖动,默认为true。
--> </body> </html>

2、效果图:

3、属性及常用方法:

(1) 属性:

    plain:布尔类型,true表示强制与背景色保持协调,默认值为false。 
    resizable:布尔类型,用户是否可以调整窗体大小,默认值为true表示可以调整大小。 
    maxinizable:布尔类型,true表示显示最大化按钮,默认值为false。 
    maximized:布尔类型,true表示显示窗体时将窗体最大化,默认值为false。 
    closable:布尔类型,true表示显示关闭按钮,默认值为true。 
    bodyStyle:与边框的间距,如:bodyStyle:"padding:3px"。 
    buttonAlign:窗体中button的对齐方式(left、center、right),默认值为right。 
    closeAction:"close"释放窗体所占内存,"hide"隐藏窗体,建议使用"hide"。

(2) 方法:

    show:打开窗体时触法。 
     hide:隐藏窗体时触法。 
     close:关闭窗体时触法。

ExtJs学习笔记之Window组件的更多相关文章

  1. ExtJs学习笔记之ComboBox组件

    ComboBox组件 (1)ComboBox控件支持自动完成.远程加载.和许多其他特性. (2)ComboBox就像是传统的HTML文本 <input> 域和 <select> ...

  2. ExtJs学习笔记之Button组件

    按钮Button组件 可以使用该组件的创建简单的按钮. 可以自定义属性包括 aligned icons, dropdown menus, tooltips 和 sizing options. 当出发点 ...

  3. ExtJs学习笔记之FormPanel组件

    FormPanel组件 FormPanel 为 form 表单提供了一个标准的容器. 本质上还是一个标准的 Ext.panel.Panel, 只是自动创建了一个 BasicForm 来管理所有添加到 ...

  4. 【React】react学习笔记02-面向组件编程

    react学习笔记02-面向组件编程 面向组件编程,直白来说,就是定义组件,使用组件. 以下内容则简单介绍下组建的声明与使用,直接复制demo观测结果即可. 步骤: 1.定义组件   a.轻量组件-函 ...

  5. Extjs 学习笔记1

    学习笔记 目   录 1 ExtJs 4 1.1 常见错误处理 4 1.1.1 多个js文件中有相同的控件,切换时无法正常显示 4 1.1.2 Store的使用方法 4 1.1.3 gridPanel ...

  6. ExtJs学习笔记之学习小结LoginDemo

    ExtJs学习小结LoginDemo 1.示例:(登录界面) <!DOCTYPE html> <html> <head> <meta charset=&quo ...

  7. Java学习笔记--Swing用户界面组件

    很多与AWT类似. 事件处理参考:Java学习笔记--AWT事件处理 1.设计模式: 模型:存储内容视图:显示内容控制器:处理用户输入· 2. 文本输入常用组件 2.1 文本域: JLabel lab ...

  8. Netty学习笔记(二)——netty组件及其用法

    1.Netty是 一个异步事件驱动的网络应用程序框架,用于快速开发可维护的高性能协议服务器和客户端. 原生NIO存在的问题 1) NIO的类库和API繁杂,使用麻烦:需要熟练掌握Selector.Se ...

  9. extjs 学习笔记(二)

    EXTJS实用开发指南 1. 要使用ExtJS 框架的页面中一般包括下面几句: <link rel="stylesheet" type="text/css" ...

随机推荐

  1. iOS应用中通过设置VOIP模式实现休眠状态下socket的长连接

    如果你的应用程序需要在设备休眠的时候还能够收到服务器端发送的消息,那我们就可以借助VOIP的模式来实现这一需求.但是如果的应用程序并不是正真的VOIP应用,那当你把你的应用提交到AppStore的时候 ...

  2. (工作经验总结一二)队列--多个main的原因

    1,项目创建最好有一个自己的继承于UIViewController的类,并且其他控制器继承这个控制器,灵活性较大,例如: 要给项目每个页面添加截图或用户操作轨迹记录等,这样就省去了到每个页面添加的麻烦 ...

  3. 《深入浅出Node.js》第3章 异步I/O

    @by Ruth92(转载请注明出处) 第3章 异步I/O Node 的基调:异步 I/O.事件驱动.单线程. Node 不再是一个服务器,而是一个可以基于它构建各种高速.可伸缩网络应用的平台. No ...

  4. 非常基础的css注意点

    排版了很多页面,才发现自己忽视了一个很基本且重要的知识点: 一个div在一般的浏览器中,算它的width,要计算其content,padding,border. 但是在CSS中定义一个div的widt ...

  5. (基础篇)PHP流程控制语句

    不论是PHP还是别的语法,程序总是由若干条语句组成. 从执行方式上看,语句的控制结构分为以下三种: 1.  顺序结构:从第一条语句到最后一条语句完全顺序执行: 2.  选择结构:根据用户输入或语句的中 ...

  6. hdu 4253 Two Famous Companies BZOJ 2654 tree

    [题意]:给出n个点,m条边,边分为两种,一种是A公司的,一种是B公司的.边上有权值,问用n-1条边把n个点连起来的最小费用是多少,其中A公司的边刚好有k条.题目保证有解. 思路:我们发现,如果我们给 ...

  7. 使用oss批量上传图片

    <?php set_time_limit(0);// 引入自动加载类// 确保路径是否正确require_once 'autoload.php';// 确定参数 需要申请$accessKeyId ...

  8. 如何优雅的写C++代码(一)

    // get the greatest power of two that is a divisor of n: return n&-n; // swap two integers a and ...

  9. html中怎么去掉input获取焦点时候的边框

    如图   这个是在360浏览器极速模式下的效果 有个颜色的边框,,但是在兼容模式下就可以的呢 看看兼容模式下的效果 很显然 上面那个被高亮了,焦点的时候有边框 要怎么弄才能让他始终没有边框呢 2014 ...

  10. hdu3308 线段树——区间合并

    更新一个点: 求某个区间的最长连续上升序列: 链接:http://acm.hdu.edu.cn/showproblem.php?pid=3308 #include <cstdio> #in ...