- 浏览: 90794 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
hzxlb910:
背景看的头晕
extJs 2.1学习笔记(Ext.data.JsonReader篇一) -
whyang:
先鄙视一下这个论坛,要做测试才能回复。
我是想问下楼主,
第 ...
Struts2的异常处理机制:
activeItem : String/Number
用于设置当前活动的子组件,取值为此子组件的序号或者是id。但是它只能应用于那种一次只能显示一个子组件的布局类,例如:Ext.layout.Accordion, Ext.layout.CardLayout和Ext.layout.FitLayout。
allowDomMove;Boolean
是否可以在组件呈现的过程中移动组件的dom节点。默认值为true。
animCollapse : Boolean
设置是否在面板收缩时起用动画,如果Ext.Fx有效(被包含进来)则默认为true,否则为false。
applyTo:Mixed
x-panel对应的div的id。
autoDestroy : Boolean
如果要把一个子组件从panel中移除且此值为true,则在移除的过程中自动会销毁此组件,返之,则不会,必须要手工销毁,默认值为true。
autoHeight : Boolean
如果为true,把this.el.dom.style.height='auto'。默认值为false。
autoScroll : Boolean
为true时,则把this.body.dom.style.overflow='auto'。默认值为false。
autoShow : Boolean
为true时,检查组件是否被设成隐藏,如果有,则移除这个效果。
autoWidth : Boolean
同autoHeight一样。。
baseCls : String
this.baseCls的class(默认值为'x-panel')
bbar : Object/Array
面板底部的工具栏。它可是一个Ext.Toolbar对象,也可以是一个toolbar的config对象,或者是一个要加入到工具栏的按钮的 config的数组。注意:这个属性在render后就无效了,如果要在render后使用它,请使用 getBottomToolbar获得引用。
bodyBorder : Boolean
如果为true则为this.el对应的元素显示边框,默认值为true。这只在border==true时才有效。如果border==true且bodyBorder==false,那么将显示1px的inset边框。给予this.el inset的效果。
bodyStyle : String/Object/Function
要应用到this.el上的css class。它的格式需求与Ext.Element.applyStyle一样,默认值为null。
border : Boolean
也是设this.body的边框的,默认值为true,此时,默认情况下边框为2px。当然,它还会被bodyBorder影响。
buttonAlign : String
加入到面板中的按钮的对齐方式,合法值为:'right','left','cente',默认值为'right'。
buttons : Array
Ext.Button的config数组,用于加入按钮到面板的footer中。
cls : String
this.el的class。
collapseFirst : Boolean
当显示title bar时,是否总把收缩、展开按钮放在所有其他按钮的前面。默认值为true。
collapsed : Boolean
在呈现时,是收缩还是展开。为true则收缩,默认值为false。
collapsedCls : String
当面板处于收缩状态时,this.el所对应的class,默认值为'x-panel-collapsed'。
collapsible : Boolean
此面板是否可收缩或者说是否能显示收缩、伸展按钮。真为显示。默认值为false。
contentEl : String
一个已存在的dom的id。作用是用于在afterRender后把它this.body.dom.appendChild掉。默认值为''。
ctCls : String
设this.container的class。
defaultType : String
当在构造函数中用items填加新成员时,如果没有设xType,那么就会以这个默认类型为xType加入组件。默认值为'panel'。
defaults : Object
加入此组件的所有子组件的默认config。如果这些加入的子组件设了config的话就以新设的为准。例如:{bodyStyle:'padding:15px'}。
disabledClass : String
当组件被设成disabled时的css,默认值为:"x-item-disabled"。
draggable : Boolean
是否能被拖动。默认值为false。当然也可以是一个Ext.Panel.DD config。Ext.Panel.DD是一个internal但非公开的类(我没有找到它的源代码),它的作用是移动一个proxy元素 (Element)以代替本应跟随鼠标移动的panel.el。但是它在拖动过程中、放下时不提供任何其他动作,也就是说,如果你不作处理的话,鼠标一松,panel仍然在老地方。它是Ext.dd.DragSource的子类,所以,必须通过实现Ext.dd.DragDrop的方法来产生动作。示例代码如下:
new Ext.Panel({
title: 'Drag me',
x: 100,
y: 100,
renderTo: Ext.getBody(),
floating: true,
frame: true,
width: 400,
height: 200,
draggable: {
// Config option of Ext.Panel.DD class.
// It's a floating Panel, so do not show a placeholder proxy in the original position.
insertProxy: false,
// Called for each mousemove event while dragging the DD object.
onDrag : function(e){
// Record the x,y position of the drag proxy so that we can
// position the Panel at end of drag.
var pel = this.proxy.getEl();
this.x = pel.getLeft(true);
this.y = pel.getTop(true);
// Keep the Shadow aligned if there is one.
var s = this.panel.getEl().shadow;
if (s) {
s.realign(this.x, this.y, pel.getWidth(), pel.getHeight());
}
},
// Called on the mouseup event.
endDrag : function(e){
this.panel.setPosition(this.x, this.y);
}
}
}).show();
elements : String
一个panel有五个部分:header、tbar、body、bbar、footer。elements就是保存当前panel包含了几个部分,例如,一个panel有header、body,那么:element=='body,header',默认值为:'body'。
floating : Boolean
为true的话,它会使panel.el.style.position=absolute。并且,默认情况下带有shimming和shadow。为false则不改变原有显示方式。
注意:把floating设为true会导致panel以offsets大量负偏移的方式隐藏。这个诸 位试一下就晓得了。所以呢,如果设了 floating=true。那么,你render后最好还要setPostion(x,y)一下。当然如果你让面板浮动,也要把width设成一个固定值,不然,它会向右扩展到viewport的边缘。
footer : Boolean
为true则明确地创建footer,为false就不创建,默认情况下,如果对footer没有什么特殊的,那么当一个或多个按钮被加到footer上面时,footer会被自动创建。
frame : Boolean
为true的话呢就就在panel外面加上自定义的圆角边框,为false的话就是1px宽的长方形边框。
header : Boolean
为true时header被创建,反之不被创建,默认情况下,当header不处于特殊情况时,如果title被设置,它会被自动创建,否则不会被创建,如是果title被设置,但是header为false,那么header也不会被创建。
headerAsText : Boolean
为真是在header中显示title,为假时隐藏它。默认值为true.
height : Number
panel的高度,默认为auto。
hideBorders : Boolean
为true时,隐藏panel的所有子组件的边框,为false则尊从子组件原有边框设置。
hideCollapseTool : Boolean
当collapsible=true且hideCollapseTool=true时,则隐藏控制收缩、伸展的那个按钮,为false时就显示它,默认值为false。
hideMode : String
隐藏模式,有三种: "visibility" (css visibility), "offsets" (negative offset position) and "display" (css display) - defaults to "display"。
hideParent : Boolean
用于设置是否隐藏组件的容器,即component.container。
html : String/Object
一个html碎片,或者是满足DomHelper语法的object,它用于设置panel的body部分的内容。默认值为''。
iconCls : String
用于设置header上的图标的class。例如:.my-icon { background: url(../images/my-icon.gif) 0 6px no-repeat !important;}
id : String
一个为component统一分配的id值。默认值为panel.el.id。
items : Mixed
单个成员或一个子组件的数组。每个成员都可以是任何从Ext.Component继承的object。
它的成员可以是component的引用,这样就会马上render,也可以是component的config。这时就会lazy render。当然,在config中,要注意加上xtype。这个东西不用讲了吧。
关于xtype的所有取值情况,请见Ext.Component.xtype的config说明。里面有讲到。关于它的值,其实很多例子上都有,如果传一个成员,则像:items:{……},传多个的话呢,就像:[{……},{……}]。
keys : Object/Array
一个keyMap config object。用于设置快捷键的。默认值为null。
layout : String
设置panel.container的布局。如果没有设置,那么默认为Ext.layout.ContainerLayout,合法的值有:absolute, accordion, anchor, border, card, column, fit, form和table。如果要设置布局的细节,则要用到layoutConfig了。
layoutConfig : Object
用于设置布局细节的,当layout有合法设置时它才有效果。如果要知道关于这个config的设置细节,请见各布局类:
Ext.layout.Absolute
Ext.layout.Accordion
Ext.layout.AnchorLayout
Ext.layout.BorderLayout
Ext.layout.CardLayout
Ext.layout.ColumnLayout
Ext.layout.FitLayout
Ext.layout.FormLayou
Ext.layout.TableLayout
listeners : Object
一个config对象用于包含一个或多个事件handler,它被addListener使用来注册事件。
maskDisabled : Boolean
是否在panel.disabled的时候显示mask。为true显示。反之不显示。
默认情况下,panel哪怕在disabled时,它的子元素也显示得很正常,用户根本不知道这个panel被禁用了,这给用户带来困扰,但是,有了mask,用户就能得到提示,哦,这个panel是不可用的,被禁用了。这给用户带来了新的体验。
minButtonWidth : Number
panel上所有按钮的最小宽度,单位是px。
monitorResize : Boolean
为true时,它自动监控window的resize事件,并且让viewport因此而变化。这个东西的经典应用就是为layout服务,而不用我们手工去调整某些组件的大小来适应窗口大小的变化。
overCls : String
当鼠标放到panel.el上面时的class。最爽的是,当鼠标out时,它会被自动删除,从而产生hover效果。
pageX : Number
组件相对于页面的x坐标
pageY : Number
组件相对于页面的y坐标
plugins : Object/Array
一个对象或对象数组,它为component提供自定义的功能。每个对象都是一个插件的引用,当然,前提是这个插件定义了init方法,在component初始化时,这个init方法将被调用。没用着。不说了。难翻译啊。
renderTo : Mixed
Ext.get(panel.renderTo)就是panel.container。用语言说不清楚,这样直接了当。
shadow : Boolean/String
为true就给panel显示一个阴影,为false不显示。当然,也可设置成为shadow的类型,详情见Ext.Shadow、Ext.Shadow.mode。注意,这个选项只有在floating = true时才发生作用。
shadowOffset : Number
阴影偏移,默认值为4,只有在floating = true时才发生作用。
shim : Boolean
是否为组件创建shim,什么是shim呢?存在这样的情况,用div做的菜单,但是,好死不死有个applet或flash盖在上面的话,那菜单就会被盖在下面。这件事情曾经一度让b/s人员郁闷,ext提供一个通用的解决方案,在要避免这个问题的组件的同一位置创建一个与它大小一样的iframe,且使得这个组件的z-index大于iframe。由于iframe不会被其他东西遮住,所以,z-index在iframe之上的东西也不会被遮,iframe相当于个垫子,把我们要用的东西垫高了,而shim英语里面也是薄垫片的意思。高呼extjs万岁。当然,iframe的src必须为 ''。
stateEvents : Array
事件数组,当这此事件触发时,组件状态被保存。
stateId : String
用于管理组件状态的id,默认值为组件的id.
stateful : Boolean
一个标志,它表示组件在创建时是否从某个地方加载组件状态。哪些属性能作为状态保存呢?只有internal属性可以。
为了让组件状态能保存,组件状态管理器提供者必须实现Ext.state.Provider,也就是要实重写它的set、get方法以保存/重读键/值对,一个内键的提供者是: Ext.state.CookieProvider。
为当前页面设置状态提供者的方法如下:
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
组件试图在stateEvents里面配置了事件时保存状态。你可以自己写点代码进行一处理,如在:beforestaterestore, staterestore, beforestatesave和statesave事件的处理代码中。
style : String
一个应用于panel.el上的样式,语法必须满足Ext.Element.applyStyles的接口。
tabTip : String
当panel是Ext.TabPanel中的一页时,为这个panel设tooltips的。不过,在render之前得先调用Ext.QuickTips.init()初始化一下。
tbar : Object/Array
panel顶部的工具栏,它可以是一个Ext.Toolbar,也可以是一个按钮数组或一个按钮的config。注意:在render之后,这个引用就没用了。如果要处理它请使用getTopToolbar。
title : String
显示在panel的header中的标题,当title被设置时,header就会被创建,除非header被设成false。如果你需要title,但不是在panel创建时,而是在之后的某个时刻,这时你需要为title设置一个非空值(如一个空格)或者是把header设为true。这样,panel在创建时才会创建header,不然,header将不会被创建。
titleCollapse : Boolean
当collapsible = true且titleCollapse=true时,用户点击panel标题栏的任意一处都会产生折叠/伸展效果,否则则只能通过单击那个按钮(上文有讲到)来产生这个效果了。
tools : Array
一个工具栏按钮数组,这个工具栏非同一般哦,不是tbar,也不是bbar,而是header上的标题栏,header上的标题栏是怎样的概念?你看到的panel的关闭按钮这个钮,超爽吧。每个工具栏元素以一个Element引用的方式向开发人员公开,通过
tools.<tool-type>的方式引用。暴爽。
每个工具栏成员的config要包含下面属性:
id:string
必需的,工具栏按钮的类型,可取值如下:
toggle (Created by default when collapsible is true)
close
minimize
maximize
restore
gear
pin
unpin
right
left
up
down
refresh
minus
plus
help
search
save
print
handler : Function
必需,当按钮被单击时被执行。它的参数说明如下:
event:Ext.EventObject
toolel:Ext.Element
Panel : Ext.Panel宿主panel
scope : Object
qtip:String/Object
一个tips字符串或者是tips config,用于Ext.QuickTip.register.
hidden : Boolean
on : Object
自定义事件处理器的config,为addListener所用。
示例如下:
tools:[{
id:'refresh',
qtip: 'Refresh form Data',
// hidden:true,
handler: function(event, toolEl, panel){
// refresh logic
}
}]
注意:除了toggle之外,其他工具栏成员都只是提供一个可视化的图标,没有任何功能,所以,如果你要加入它们,得自己写处理函数。
width : Number
component的宽度,单位用px,默认值为:auto。
x : Number
获得组件的x,相当于panel.el.style.left
xtype : String
这个东西不用说了,见Ext.Component的config里面的xtype。
y : Number
与x同理。
用于设置当前活动的子组件,取值为此子组件的序号或者是id。但是它只能应用于那种一次只能显示一个子组件的布局类,例如:Ext.layout.Accordion, Ext.layout.CardLayout和Ext.layout.FitLayout。
allowDomMove;Boolean
是否可以在组件呈现的过程中移动组件的dom节点。默认值为true。
animCollapse : Boolean
设置是否在面板收缩时起用动画,如果Ext.Fx有效(被包含进来)则默认为true,否则为false。
applyTo:Mixed
x-panel对应的div的id。
autoDestroy : Boolean
如果要把一个子组件从panel中移除且此值为true,则在移除的过程中自动会销毁此组件,返之,则不会,必须要手工销毁,默认值为true。
autoHeight : Boolean
如果为true,把this.el.dom.style.height='auto'。默认值为false。
autoScroll : Boolean
为true时,则把this.body.dom.style.overflow='auto'。默认值为false。
autoShow : Boolean
为true时,检查组件是否被设成隐藏,如果有,则移除这个效果。
autoWidth : Boolean
同autoHeight一样。。
baseCls : String
this.baseCls的class(默认值为'x-panel')
bbar : Object/Array
面板底部的工具栏。它可是一个Ext.Toolbar对象,也可以是一个toolbar的config对象,或者是一个要加入到工具栏的按钮的 config的数组。注意:这个属性在render后就无效了,如果要在render后使用它,请使用 getBottomToolbar获得引用。
bodyBorder : Boolean
如果为true则为this.el对应的元素显示边框,默认值为true。这只在border==true时才有效。如果border==true且bodyBorder==false,那么将显示1px的inset边框。给予this.el inset的效果。
bodyStyle : String/Object/Function
要应用到this.el上的css class。它的格式需求与Ext.Element.applyStyle一样,默认值为null。
border : Boolean
也是设this.body的边框的,默认值为true,此时,默认情况下边框为2px。当然,它还会被bodyBorder影响。
buttonAlign : String
加入到面板中的按钮的对齐方式,合法值为:'right','left','cente',默认值为'right'。
buttons : Array
Ext.Button的config数组,用于加入按钮到面板的footer中。
cls : String
this.el的class。
collapseFirst : Boolean
当显示title bar时,是否总把收缩、展开按钮放在所有其他按钮的前面。默认值为true。
collapsed : Boolean
在呈现时,是收缩还是展开。为true则收缩,默认值为false。
collapsedCls : String
当面板处于收缩状态时,this.el所对应的class,默认值为'x-panel-collapsed'。
collapsible : Boolean
此面板是否可收缩或者说是否能显示收缩、伸展按钮。真为显示。默认值为false。
contentEl : String
一个已存在的dom的id。作用是用于在afterRender后把它this.body.dom.appendChild掉。默认值为''。
ctCls : String
设this.container的class。
defaultType : String
当在构造函数中用items填加新成员时,如果没有设xType,那么就会以这个默认类型为xType加入组件。默认值为'panel'。
defaults : Object
加入此组件的所有子组件的默认config。如果这些加入的子组件设了config的话就以新设的为准。例如:{bodyStyle:'padding:15px'}。
disabledClass : String
当组件被设成disabled时的css,默认值为:"x-item-disabled"。
draggable : Boolean
是否能被拖动。默认值为false。当然也可以是一个Ext.Panel.DD config。Ext.Panel.DD是一个internal但非公开的类(我没有找到它的源代码),它的作用是移动一个proxy元素 (Element)以代替本应跟随鼠标移动的panel.el。但是它在拖动过程中、放下时不提供任何其他动作,也就是说,如果你不作处理的话,鼠标一松,panel仍然在老地方。它是Ext.dd.DragSource的子类,所以,必须通过实现Ext.dd.DragDrop的方法来产生动作。示例代码如下:
new Ext.Panel({
title: 'Drag me',
x: 100,
y: 100,
renderTo: Ext.getBody(),
floating: true,
frame: true,
width: 400,
height: 200,
draggable: {
// Config option of Ext.Panel.DD class.
// It's a floating Panel, so do not show a placeholder proxy in the original position.
insertProxy: false,
// Called for each mousemove event while dragging the DD object.
onDrag : function(e){
// Record the x,y position of the drag proxy so that we can
// position the Panel at end of drag.
var pel = this.proxy.getEl();
this.x = pel.getLeft(true);
this.y = pel.getTop(true);
// Keep the Shadow aligned if there is one.
var s = this.panel.getEl().shadow;
if (s) {
s.realign(this.x, this.y, pel.getWidth(), pel.getHeight());
}
},
// Called on the mouseup event.
endDrag : function(e){
this.panel.setPosition(this.x, this.y);
}
}
}).show();
elements : String
一个panel有五个部分:header、tbar、body、bbar、footer。elements就是保存当前panel包含了几个部分,例如,一个panel有header、body,那么:element=='body,header',默认值为:'body'。
floating : Boolean
为true的话,它会使panel.el.style.position=absolute。并且,默认情况下带有shimming和shadow。为false则不改变原有显示方式。
注意:把floating设为true会导致panel以offsets大量负偏移的方式隐藏。这个诸 位试一下就晓得了。所以呢,如果设了 floating=true。那么,你render后最好还要setPostion(x,y)一下。当然如果你让面板浮动,也要把width设成一个固定值,不然,它会向右扩展到viewport的边缘。
footer : Boolean
为true则明确地创建footer,为false就不创建,默认情况下,如果对footer没有什么特殊的,那么当一个或多个按钮被加到footer上面时,footer会被自动创建。
frame : Boolean
为true的话呢就就在panel外面加上自定义的圆角边框,为false的话就是1px宽的长方形边框。
header : Boolean
为true时header被创建,反之不被创建,默认情况下,当header不处于特殊情况时,如果title被设置,它会被自动创建,否则不会被创建,如是果title被设置,但是header为false,那么header也不会被创建。
headerAsText : Boolean
为真是在header中显示title,为假时隐藏它。默认值为true.
height : Number
panel的高度,默认为auto。
hideBorders : Boolean
为true时,隐藏panel的所有子组件的边框,为false则尊从子组件原有边框设置。
hideCollapseTool : Boolean
当collapsible=true且hideCollapseTool=true时,则隐藏控制收缩、伸展的那个按钮,为false时就显示它,默认值为false。
hideMode : String
隐藏模式,有三种: "visibility" (css visibility), "offsets" (negative offset position) and "display" (css display) - defaults to "display"。
hideParent : Boolean
用于设置是否隐藏组件的容器,即component.container。
html : String/Object
一个html碎片,或者是满足DomHelper语法的object,它用于设置panel的body部分的内容。默认值为''。
iconCls : String
用于设置header上的图标的class。例如:.my-icon { background: url(../images/my-icon.gif) 0 6px no-repeat !important;}
id : String
一个为component统一分配的id值。默认值为panel.el.id。
items : Mixed
单个成员或一个子组件的数组。每个成员都可以是任何从Ext.Component继承的object。
它的成员可以是component的引用,这样就会马上render,也可以是component的config。这时就会lazy render。当然,在config中,要注意加上xtype。这个东西不用讲了吧。
关于xtype的所有取值情况,请见Ext.Component.xtype的config说明。里面有讲到。关于它的值,其实很多例子上都有,如果传一个成员,则像:items:{……},传多个的话呢,就像:[{……},{……}]。
keys : Object/Array
一个keyMap config object。用于设置快捷键的。默认值为null。
layout : String
设置panel.container的布局。如果没有设置,那么默认为Ext.layout.ContainerLayout,合法的值有:absolute, accordion, anchor, border, card, column, fit, form和table。如果要设置布局的细节,则要用到layoutConfig了。
layoutConfig : Object
用于设置布局细节的,当layout有合法设置时它才有效果。如果要知道关于这个config的设置细节,请见各布局类:
Ext.layout.Absolute
Ext.layout.Accordion
Ext.layout.AnchorLayout
Ext.layout.BorderLayout
Ext.layout.CardLayout
Ext.layout.ColumnLayout
Ext.layout.FitLayout
Ext.layout.FormLayou
Ext.layout.TableLayout
listeners : Object
一个config对象用于包含一个或多个事件handler,它被addListener使用来注册事件。
maskDisabled : Boolean
是否在panel.disabled的时候显示mask。为true显示。反之不显示。
默认情况下,panel哪怕在disabled时,它的子元素也显示得很正常,用户根本不知道这个panel被禁用了,这给用户带来困扰,但是,有了mask,用户就能得到提示,哦,这个panel是不可用的,被禁用了。这给用户带来了新的体验。
minButtonWidth : Number
panel上所有按钮的最小宽度,单位是px。
monitorResize : Boolean
为true时,它自动监控window的resize事件,并且让viewport因此而变化。这个东西的经典应用就是为layout服务,而不用我们手工去调整某些组件的大小来适应窗口大小的变化。
overCls : String
当鼠标放到panel.el上面时的class。最爽的是,当鼠标out时,它会被自动删除,从而产生hover效果。
pageX : Number
组件相对于页面的x坐标
pageY : Number
组件相对于页面的y坐标
plugins : Object/Array
一个对象或对象数组,它为component提供自定义的功能。每个对象都是一个插件的引用,当然,前提是这个插件定义了init方法,在component初始化时,这个init方法将被调用。没用着。不说了。难翻译啊。
renderTo : Mixed
Ext.get(panel.renderTo)就是panel.container。用语言说不清楚,这样直接了当。
shadow : Boolean/String
为true就给panel显示一个阴影,为false不显示。当然,也可设置成为shadow的类型,详情见Ext.Shadow、Ext.Shadow.mode。注意,这个选项只有在floating = true时才发生作用。
shadowOffset : Number
阴影偏移,默认值为4,只有在floating = true时才发生作用。
shim : Boolean
是否为组件创建shim,什么是shim呢?存在这样的情况,用div做的菜单,但是,好死不死有个applet或flash盖在上面的话,那菜单就会被盖在下面。这件事情曾经一度让b/s人员郁闷,ext提供一个通用的解决方案,在要避免这个问题的组件的同一位置创建一个与它大小一样的iframe,且使得这个组件的z-index大于iframe。由于iframe不会被其他东西遮住,所以,z-index在iframe之上的东西也不会被遮,iframe相当于个垫子,把我们要用的东西垫高了,而shim英语里面也是薄垫片的意思。高呼extjs万岁。当然,iframe的src必须为 ''。
stateEvents : Array
事件数组,当这此事件触发时,组件状态被保存。
stateId : String
用于管理组件状态的id,默认值为组件的id.
stateful : Boolean
一个标志,它表示组件在创建时是否从某个地方加载组件状态。哪些属性能作为状态保存呢?只有internal属性可以。
为了让组件状态能保存,组件状态管理器提供者必须实现Ext.state.Provider,也就是要实重写它的set、get方法以保存/重读键/值对,一个内键的提供者是: Ext.state.CookieProvider。
为当前页面设置状态提供者的方法如下:
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
组件试图在stateEvents里面配置了事件时保存状态。你可以自己写点代码进行一处理,如在:beforestaterestore, staterestore, beforestatesave和statesave事件的处理代码中。
style : String
一个应用于panel.el上的样式,语法必须满足Ext.Element.applyStyles的接口。
tabTip : String
当panel是Ext.TabPanel中的一页时,为这个panel设tooltips的。不过,在render之前得先调用Ext.QuickTips.init()初始化一下。
tbar : Object/Array
panel顶部的工具栏,它可以是一个Ext.Toolbar,也可以是一个按钮数组或一个按钮的config。注意:在render之后,这个引用就没用了。如果要处理它请使用getTopToolbar。
title : String
显示在panel的header中的标题,当title被设置时,header就会被创建,除非header被设成false。如果你需要title,但不是在panel创建时,而是在之后的某个时刻,这时你需要为title设置一个非空值(如一个空格)或者是把header设为true。这样,panel在创建时才会创建header,不然,header将不会被创建。
titleCollapse : Boolean
当collapsible = true且titleCollapse=true时,用户点击panel标题栏的任意一处都会产生折叠/伸展效果,否则则只能通过单击那个按钮(上文有讲到)来产生这个效果了。
tools : Array
一个工具栏按钮数组,这个工具栏非同一般哦,不是tbar,也不是bbar,而是header上的标题栏,header上的标题栏是怎样的概念?你看到的panel的关闭按钮这个钮,超爽吧。每个工具栏元素以一个Element引用的方式向开发人员公开,通过
tools.<tool-type>的方式引用。暴爽。
每个工具栏成员的config要包含下面属性:
id:string
必需的,工具栏按钮的类型,可取值如下:
toggle (Created by default when collapsible is true)
close
minimize
maximize
restore
gear
pin
unpin
right
left
up
down
refresh
minus
plus
help
search
save
handler : Function
必需,当按钮被单击时被执行。它的参数说明如下:
event:Ext.EventObject
toolel:Ext.Element
Panel : Ext.Panel宿主panel
scope : Object
qtip:String/Object
一个tips字符串或者是tips config,用于Ext.QuickTip.register.
hidden : Boolean
on : Object
自定义事件处理器的config,为addListener所用。
示例如下:
tools:[{
id:'refresh',
qtip: 'Refresh form Data',
// hidden:true,
handler: function(event, toolEl, panel){
// refresh logic
}
}]
注意:除了toggle之外,其他工具栏成员都只是提供一个可视化的图标,没有任何功能,所以,如果你要加入它们,得自己写处理函数。
width : Number
component的宽度,单位用px,默认值为:auto。
x : Number
获得组件的x,相当于panel.el.style.left
xtype : String
这个东西不用说了,见Ext.Component的config里面的xtype。
y : Number
与x同理。
发表评论
-
Extjs3.0的变动记录(转载)
2009-09-24 11:23 2961Release Date: Jul 6, 2009 Curr ... -
Ext中TreePanel控件和TabPanel控件搭配测试
2009-08-25 13:51 1608在实际的项目中,左边树形菜单,提供各种功能点击,右边一个面板, ... -
extJs 2.1学习笔记(Ext.Updater篇二)
2009-08-05 22:02 1592全 称:Ext.Updater 命名 ... -
extJs 2.1学习笔记(Ext.Updater篇一)
2009-08-05 22:00 1225上几篇中老老实实地把E ... -
extJs 2.1 学习笔记(Ext.data.HttpProxy篇)
2009-08-05 21:59 2473关于Ext.data中各个类的 ... -
extJs 2.1学习笔记(Ext.data.JsonReader篇一)
2009-08-05 21:58 2122有个事要说一下:DataProxy的子类呢,都有一个load来 ... -
extJs 2.1学习笔记(Ext.data.JsonReader篇二)
2009-08-05 21:57 1291有了上一篇中所讲内容,一般情况下就可以应付了,不过,Jso ... -
extJs 2.1学习笔记(Ext.TabPanel篇)
2009-08-05 21:56 1433Ext.TabPanel这个东西是最常用的组件之一,它继承 ... -
extJs 2.1学习笔记(Function扩展篇)
2009-08-05 21:55 972ExtJs对JavaScript的内建对象进行了扩展,对什么O ... -
extJs 2.1学习笔记(Ext.data.Store篇)
2009-08-05 21:54 1531Ext.data.Store,这个东西是JavaScript ... -
extJs 2.1学习笔记(Ext.data.Connection篇二)
2009-08-05 21:54 1719上一篇主要是扎扎实实地翻译了一下Ext.data.Connec ... -
extJs 2.1学习笔记(Ext.data.Connection篇一)
2009-08-05 21:52 1389ExtJs之所以能异步请求数据,全依赖于Ext.data. ... -
extJs 2.0学习笔记(Ext.Panel终结篇)
2009-08-05 21:49 1157怪不得我对Ext.Panel穷追猛打,前面已经写过四篇针对它的 ... -
extJs 2.0学习笔记(事件注册总结篇)
2009-08-05 21:48 1157本来,我也没把这档子 ... -
extJs 2.0学习笔记(Ext.Panel篇四)
2009-08-05 21:46 1713我刚才禁不住诱惑去看 ... -
extJs 2.0学习笔记(Ext.Panel篇三)
2009-08-05 21:45 1921上一篇中把panel的config部分的文档翻译了一下,事实 ... -
extJs 2.0学习笔记(Ext.Panel篇一)
2009-08-05 21:42 1224原文链接: http://hi.baidu ... -
EXT 中 类的继承
2009-07-31 09:36 1007深入剖析ExtJS 2.2实现及 ... -
Ext架构分析:render方法
2009-07-16 08:51 5083Ext架构分析(3)--Widget之 ... -
Ext 2 概述
2009-07-16 08:48 822原文链接 http://hi.baidu.com/xcl1 ...
相关推荐
21. extJs 2.0学习笔记(Ext.Panel篇二) 50 22. extJs 2.0学习笔记(Ext.Panel篇三) 59 23. extJs 2.0学习笔记(Ext.Panel篇四) 62 24. extJs 2.0学习笔记(组件总论篇) 66 25. extJs 2.0学习笔记(Ext.Element API总结) ...
15. **extJs 2.0 学习笔记(Ext.Panel终结篇)** Panel是构建UI的基本组件,涵盖了布局、标题、工具栏等多种功能。掌握Panel的使用和配置,能创建复杂而灵活的界面。 16. **extJs 2.0 学习笔记(事件注册总结篇)*...
- **ExtJs2.0学习笔记(Ext.Panel篇一/二/三/四)**:这一系列内容分别讲述了`Ext.Panel`的不同方面,如布局管理、事件处理等。 - **ExtJs2.0学习笔记(组件总论篇)**:这是一个综合性的章节,概括了Ext JS 2.0中各种...
通过本篇学习笔记,我们可以了解到如何使用ExtJs的面板控件,并通过一些简单的例子来展示它们的基本用法。这些基础知识是构建复杂ExtJs应用程序的基石。学习和掌握Ext.Panel、Ext.TabPanel和Ext.Viewport的使用方法...
### ExtJS面板学习笔记 #### 一、基础:弹出框 在ExtJS中,`Ext.MessageBox`提供了创建各种模态对话框的功能,包括提示、确认、输入等。以下是几个基本示例: 1. **简单警告对话框**: ```javascript Ext....
### ExtJS 学习笔记概览 #### 一、ExtJS 入门 **1.1 ExtJS 构成及如何引用** ExtJS 是一款基于 JavaScript 的开源框架,专为 Web 应用程序的前端界面设计。其核心优势在于提供了一套丰富的 UI 组件和强大的数据...
EXT 4.0 是一款流行的JavaScript库,专门用于构建富...EXT 4.0提供了丰富的API文档,允许开发者深入学习并自定义更多功能,如分页、筛选、编辑等。对于初学者来说,了解和实践这些基本概念是掌握EXT 4.0的第一步。
11. **数据源(Ext.grid.Panel)**:`store`是EXTJS中数据的容器,`columnLines`控制是否显示列分割线,`columns`定义了列的结构。`viewConfig`允许自定义网格视图的属性,如`stripeRows`用于开启斑马线效果,`...
在Extjs中,给Panel设置布局的方法是设置Panel的Layout配置项,Extjs3.1.0版本提供了17种布局方式,这里会挑选一些常用的进行介绍: 1. AbsoluteLayout(绝对布局) 绝对布局是最直接的布局方式,每个组件的位置...
根据给定的文件信息,我们可以深入探讨两个关键的Extjs组件——Tab Panel(标签页控件)和Grid(表格控件)。这两个控件是Extjs框架中非常实用且功能丰富的部分,广泛应用于Web应用程序的界面设计与交互逻辑构建。 ...
1. **EXTJS Form Panel**: 批量上传通常会用到EXTJS的Form Panel组件,它允许我们创建表单并处理表单数据。在批量上传中,表单通常包含一个或多个文件输入字段,用于选择待上传的文件。 2. **File Input Field**: ...