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. CF700C （枚举+tarjan）

    Problem Break up (CF700C) 题目大意 给一张n个点,m条边的无向图,有边权,和起点S,终点T. (n<=1000 , m<=30000) 要求最多割掉2条边,使得S ...

  2. Azure 自动化：使用PowerShell Credential连接到Azure

    最近在中国版windows azure中新上线的自动化功能, 使用自动化,您可以导入自己的PowerShell脚本,然后设置一个运行计划使得脚本能按计划运行. 在本文中,我们来学习如何使用PowerS ...

  3. Smart210学习记录-------linux驱动中断

    Linux中断 Linux 的中断处理分为两个半部,顶半部处理紧急的硬件操作,底半部处理不紧急的耗时操作.tasklet 和工作队列都是调度中断底半部的良好机制,tasklet 基于软中断实现.内核定 ...

  4. LeetCode Sum Root to Leaf Numbers（DFS）

    题意: 给一棵二叉树,每个节点上有一个数字,范围是0-9,将从根到叶子的所有数字作为一个串,求所有串的和. 思路: 普通常规的DFS. /** * Definition for a binary tr ...

  5. Core Java Volume I — 4.7. Packages

    4.7. PackagesJava allows you to group classes in a collection called a package. Packages are conveni ...

  6. python 数据结构之单链表的实现

    链表的定义: 链表(linked list)是由一组被称为结点的数据元素组成的数据结构,每个结点都包含结点本身的信息和指向下一个结点的地址.由于每个结点都包含了可以链接起来的地址信息,所以用一个变量就 ...

  7. dede取子栏目时重复显示同级栏目的终极解决方法

    使用channelartlist标签时,当栏目没有子栏目是,会出现重复同级栏目的问题,解决方法如下: 先看下面的代码{dede:channelartlist typeid='2'}  {dede:ty ...

  8. HDU 5692 线段树+dfs序

    Snacks Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Total Sub ...

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

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

  10. bootStrap-2

    全局样式: 1.移除Body的margin声明: 2.设置Body的背景色为白色: 3.为排版设置了基本的字体,字号和行高: 4.设置全局连接颜色,且当连接处于悬浮:hover状态时,才会显示下划线样 ...