Skip to content
WebBuilder 文档

Ext.panel.Panel

xtype 为 panel 的 Ext JS 原生组件参考。

Updated View as Markdown

源码定义：ext-all-debug.js:56720。分类：容器、面板与窗口。

创建示例

var component = Ext.create("Ext.panel.Panel", {
  xtype: "panel",
  addTools: Ext.emptyFn,
  animCollapse: Ext.enableFx,
  border: false,
  closable: false,
  renderTo: Ext.getBody()
});

属性

属性 类型 默认值 说明 配置示例
addTools Mixed Ext.emptyFn 配置组件的 addTools 选项。 addTools: Ext.emptyFn
animCollapse Mixed Ext.enableFx 配置组件的 animCollapse 选项。 animCollapse: Ext.enableFx
border Boolean false 控制是否显示组件边框。 border: false
closable Boolean false 控制组件是否显示关闭操作。 closable: false
closeAction String 'destroy' 配置组件的 closeAction 选项。 closeAction: 'destroy'
collapsed Boolean false 控制面板初始是否处于收起状态。 collapsed: false
collapsedCls String 'collapsed' 配置 collapsedCls 对应的 CSS 类名。 collapsedCls: 'collapsed'
collapseFirst Boolean true 控制是否启用 collapseFirst 行为。 collapseFirst: true
collapsible Mixed undefined 控制面板是否允许展开和收起。 collapsible: undefined
constrain Boolean false 控制是否启用 constrain 行为。 constrain: false
constrainHeader Boolean false 控制是否启用 constrainHeader 行为。 constrainHeader: false
floatable Boolean true 控制是否启用 floatable 行为。 floatable: true
frame Boolean false 控制是否启用 frame 行为。 frame: false
frameHeader Boolean true 控制是否启用 frameHeader 行为。 frameHeader: true
header Mixed undefined 配置组件的 header 选项。 header: undefined
headerPosition String 'top' 配置组件的 headerPosition 选项。 headerPosition: 'top'
hideCollapseTool Boolean false 控制是否隐藏 collapseTool。 hideCollapseTool: false
manageHeight Boolean true 控制是否启用 manageHeight 行为。 manageHeight: true
maskElement String 'el' 配置组件的 maskElement 选项。 maskElement: 'el'
minButtonWidth Number 75 配置 minButtonWidth 限制值。 minButtonWidth: 75
placeholderCollapseHideMode Mixed Ext.Element.VISIBILITY 配置组件的 placeholderCollapseHideMode 选项。 placeholderCollapseHideMode: Ext.Element.VISIBILITY
preventHeader Boolean false 控制是否启用 preventHeader 行为。 preventHeader: false
titleCollapse Mixed undefined 配置组件的 titleCollapse 选项。 titleCollapse: undefined

方法

方法 参数 说明 调用示例
initComponent `` 初始化组件及其子项。 执行时会保留父类默认行为、更新 collapseDirection、hiddenOnCollapse 状态。源码涉及 addEvents()、addStateEvents()、setUI()、bridgeToolbars()。 component.initComponent()
beforeDestroy `` 在 destroy 前执行预处理。 执行时会保留父类默认行为。源码涉及 callParent()。 component.beforeDestroy()
getFocusEl `` 读取并返回 focusEl。 component.getFocusEl()
getHeader `` 读取并返回 header。 component.getHeader()
setTitle newTitle 设置 title。 执行时会派发 titlechange 事件、更新 title 状态。源码涉及 updateHeader()、fireEvent()。 component.setTitle(...)
setIconCls newIconCls 设置 iconCls。 执行时会派发 iconclschange 事件、更新 iconCls 状态。源码涉及 updateHeader()、fireEvent()。 component.setIconCls(...)
setIcon newIcon 设置 icon。 执行时会派发 iconchange 事件、更新 icon 状态。源码涉及 updateHeader()、fireEvent()。 component.setIcon(...)
setGlyph newGlyph 设置 glyph。 执行时会派发 glyphchange 事件、更新 glyph 状态。源码涉及 updateHeader()、fireEvent()。 component.setGlyph(...)
bridgeToolbars `` 处理 bridgeToolbars 操作。 执行时会更新 tbar、bbar 状态。 component.bridgeToolbars()
isPlaceHolderCollapse `` 判断 placeHolderCollapse 状态。 component.isPlaceHolderCollapse()
onBoxReady `` 处理 boxReady 回调。 执行时会保留父类默认行为。源码涉及 callParent()、setHiddenDocked()。 component.onBoxReady()
beforeRender `` 生成 before 的渲染结果。 执行时会保留父类默认行为、更新 preventCollapseFire、collapsed 状态。源码涉及 callParent()、initTools()、updateHeader()、isPlaceHolderCollapse()。 component.beforeRender()
initTools `` 初始化 tools。 执行时会更新 tools、collapseDirection 状态。源码涉及 updateCollapseTool()、addTools()、addClsWithUI()、addTool()。 component.initTools()
updateCollapseTool `` 更新 collapseTool。源码涉及 isPlaceHolderCollapse()、getOppositeDirection()。 component.updateCollapseTool()
close `` 处理 close 操作。 执行时会派发 beforeclose 事件。源码涉及 fireEvent()、doClose()。 component.close()
doClose `` 执行 close 操作。 执行时会派发 close 事件。源码涉及 fireEvent()。 component.doClose()
updateHeader force 更新 header。 执行时会更新 header 状态。源码涉及 addDocked()。 component.updateHeader(...)
setUI ui 设置 uI。 执行时会保留父类默认行为。源码涉及 callParent()。 component.setUI(...)
getDefaultContentTarget `` 读取并返回 defaultContentTarget。 component.getDefaultContentTarget()
getTargetEl `` 读取并返回 targetEl。 component.getTargetEl()
isVisible deep 判断 visible 状态。 执行时会保留父类默认行为。源码涉及 callParent()。 component.isVisible(...)
onHide `` 处理 hide 回调。 执行时会保留父类默认行为。源码涉及 slideOutFloatedPanel()、callParent()。 component.onHide()
onShow `` 处理 show 回调。 执行时会保留父类默认行为。源码涉及 isPlaceHolderCollapse()、setHiddenState()、placeholderCollapse()、callParent()。 component.onShow()
onRemoved destroying 处理 removed 回调。 执行时会保留父类默认行为。源码涉及 callParent()。 component.onRemoved(...)
addTool tools 添加 tool。源码涉及 updateHeader()。 component.addTool(...)
getOppositeDirection d 读取并返回 oppositeDirection。 component.getOppositeDirection(...)
getWidthAuthority `` 读取并返回 widthAuthority。 执行时会保留父类默认行为。源码涉及 collapsedHorizontal()、callParent()。 component.getWidthAuthority()
getHeightAuthority `` 读取并返回 heightAuthority。 执行时会保留父类默认行为。源码涉及 collapsedVertical()、callParent()。 component.getHeightAuthority()
collapsedHorizontal `` 收起 dHorizontal。源码涉及 getCollapsed()。 component.collapsedHorizontal()
collapsedVertical `` 收起 dVertical。源码涉及 getCollapsed()。 component.collapsedVertical()
restoreDimension `` 还原 dimension。 component.restoreDimension()
getCollapsed `` 读取并返回 collapsed。 component.getCollapsed()
focusTabIndex selector, prev 将焦点移动到 tabIndex。源码涉及 query()。 component.focusTabIndex(...)
onEnterRoot k, e 处理 enterRoot 回调。源码涉及 focusTabIndex()、onEnter()。 component.onEnterRoot(...)
getState `` 读取并返回 state。 执行时会保留父类默认行为。源码涉及 callParent()、addPropertyToState()、collapsedVertical()。 component.getState()
findReExpander direction 查找 reExpander。 component.findReExpander(...)
getReExpander direction 读取并返回 reExpander。 执行时会更新 expandDirection、reExpander 状态。源码涉及 findReExpander()、getOppositeDirection()、createReExpander()。 component.getReExpander(...)
createReExpander direction, defaults 创建 reExpander。源码涉及 isPlaceHolderCollapse()、getOppositeDirection()、getHeaderCollapsedClasses()。 component.createReExpander(...)
getHeaderCollapsedClasses header 读取并返回 headerCollapsedClasses。 component.getHeaderCollapsedClasses(...)
beginCollapse `` 处理 beginCollapse 操作。 执行时会更新 collapseMemento、width 状态。源码涉及 getSizeModel()、restoreDimension()、collapsedVertical()、getWidth()。 component.beginCollapse()
beginExpand `` 处理 beginExpand 操作。源码涉及 restoreDimension()、isPlaceHolderCollapse()、getReExpander()、getHeaderCollapsedClasses()。 component.beginExpand()
collapse direction, animate 收起组件。 执行时会派发 beforecollapse 事件、更新 collapsed 状态。源码涉及 fireEvent()、isPlaceHolderCollapse()、placeholderCollapse()、beginCollapse()。 component.collapse(...)
doCollapseExpand flags, animate 执行 collapseExpand 操作。 执行时会刷新界面或布局、更新 animCollapse、isCollapsingOrExpanding 状态。源码涉及 addCls()、updateLayout()。 component.doCollapseExpand(...)
afterCollapse animated 在 collapse 后执行后处理。 执行时会派发 collapse 事件、更新 isCollapsingOrExpanding 状态。源码涉及 updateCollapseTool()、removeCls()、setHiddenDocked()、fireEvent()。 component.afterCollapse(...)
setHiddenDocked `` 设置 hiddenDocked。源码涉及 getDockedItems()、getReExpander()。 component.setHiddenDocked()
restoreHiddenDocked `` 还原 hiddenDocked。 component.restoreHiddenDocked()
getPlaceholder direction 读取并返回 placeholder。 执行时会更新 placeholder 状态。源码涉及 createReExpander()、lookupComponent()。 component.getPlaceholder(...)
placeholderCollapse direction, animate 处理 placeholderCollapse 操作。 执行时会派发 collapse、collapse、collapse 事件、更新 isCollapsingOrExpanding、collapsed 状态。源码涉及 getPlaceholder()、setHiddenState()、convertCollapseDir()、fireEvent()。 component.placeholderCollapse(...)
floatCollapsedPanel `` 处理 floatCollapsedPanel 操作。 执行时会派发 float 事件、更新 isSliding、collapsed 状态。源码涉及 slideOutFloatedPanel()、setHiddenState()、getBox()、setLocalXY()。 component.floatCollapsedPanel()
onMouseLeaveFloated e 处理 mouseLeaveFloated 回调。 component.onMouseLeaveFloated(...)
onMouseEnterFloated e 处理 mouseEnterFloated 回调。 component.onMouseEnterFloated(...)
isLayoutRoot `` 判断 layoutRoot 状态。 执行时会保留父类默认行为。源码涉及 callParent()。 component.isLayoutRoot()
slideOutFloatedPanel preventAnimate 执行滑动 outFloatedPanel。 执行时会更新 isSliding、floated 状态。源码涉及 slideOutFloatedPanelBegin()、convertCollapseDir()、slideOutFloatedPanelEnd()。 component.slideOutFloatedPanel(...)
slideOutFloatedPanelBegin `` 执行滑动 outFloatedPanelBegin。 执行时会更新 collapsed、floatedFromCollapse 状态。源码涉及 setHiddenState()。 component.slideOutFloatedPanelBegin()
slideOutFloatedPanelEnd suppressEvents 执行滑动 outFloatedPanelEnd。 执行时会派发 unfloat 事件、更新 isSliding 状态。源码涉及 fireEvent()。 component.slideOutFloatedPanelEnd(...)
expand animate 展开组件。 执行时会派发 beforeexpand 事件、更新 collapsed 状态。源码涉及 fireEvent()、getHierarchyState()、isPlaceHolderCollapse()、placeholderExpand()。 component.expand(...)
placeholderExpand animate 处理 placeholderExpand 操作。 执行时会派发 expand、expand、expand 事件、刷新界面或布局、更新 floated、collapsed 状态。源码涉及 getPosition()、slideOutFloatedPanelBegin()、slideOutFloatedPanelEnd()、setHiddenState()。 component.placeholderExpand(...)
afterExpand animated 在 expand 后执行后处理。 执行时会派发 expand 事件、更新 isCollapsingOrExpanding 状态。源码涉及 updateCollapseTool()、removeCls()、fireEvent()、fireHierarchyEvent()。 component.afterExpand(...)
setBorder border, targetEl 设置 border。 执行时会刷新界面或布局、更新 border 状态。源码涉及 unitizeBox()、updateLayout()。 component.setBorder(...)
toggleCollapse `` 切换 collapse。源码涉及 expand()、collapse()。 component.toggleCollapse()
getKeyMap `` 读取并返回 keyMap。 执行时会更新 keyMap 状态。 component.getKeyMap()
initDraggable `` 初始化 draggable。 执行时会更新 dd 状态。源码涉及 initSimpleDraggable()。 component.initDraggable()
initSimpleDraggable `` 初始化 simpleDraggable。 执行时会更新 dd 状态。源码涉及 updateHeader()、relayEvents()。 component.initSimpleDraggable()
ghostTools `` 处理 ghostTools 操作。 component.ghostTools()
ghost cls 处理 ghost 操作。 执行时会更新 ghostPanel 状态。源码涉及 getBox()、createGhost()、ghostTools()。 component.ghost(...)
createGhost cls 创建 ghost。源码涉及 getRefOwner()。 component.createGhost(...)
unghost show, matchPosition 取消幽灵状态当前组件。源码涉及 setPagePosition()。 component.unghost(...)
beginDrag `` 处理 beginDrag 操作。 component.beginDrag()
endDrag `` 处理 endDrag 操作。 component.endDrag()
initResizable `` 初始化 resizable。 执行时会保留父类默认行为。源码涉及 callParent()。 component.initResizable()
convertCollapseDir collapseDir 处理 convertCollapseDir 操作。 component.convertCollapseDir(...)
getAnimationProps `` 读取并返回 animationProps。 执行时会保留父类默认行为。源码涉及 callParent()。 component.getAnimationProps()

事件

事件 说明 监听示例
beforeclose 组件关闭前触发；监听器返回 false 可取消关闭。 源码在 close() 中通过 fireEvent() 触发。 listeners: { beforeclose: function () {} }
beforecollapse 组件收起前触发；监听器返回 false 可取消收起。 源码在 collapse() 中通过 fireEvent() 触发。 listeners: { beforecollapse: function () {} }
beforeexpand 组件展开前触发；监听器返回 false 可取消展开。 源码在 expand() 中通过 fireEvent() 触发。 listeners: { beforeexpand: function () {} }
close 组件关闭完成后触发。 源码在 doClose() 中通过 fireEvent() 触发。 listeners: { close: function () {} }
collapse 可折叠组件收起后触发。 源码在 afterCollapse()、placeholderCollapse() 中通过 fireEvent() 触发。 listeners: { collapse: function () {} }
expand 可展开组件展开后触发。 源码在 placeholderExpand()、afterExpand() 中通过 fireEvent() 触发。 listeners: { expand: function () {} }
float 折叠面板以浮动方式显示后触发。 源码在 floatCollapsedPanel() 中通过 fireEvent() 触发。 listeners: { float: function () {} }
glyphchange 组件字形图标改变后触发。 源码在 setGlyph() 中通过 fireEvent() 触发。 listeners: { glyphchange: function () {} }
iconchange 组件图标改变后触发。 源码在 setIcon() 中通过 fireEvent() 触发。 listeners: { iconchange: function () {} }
iconclschange 组件图标样式类改变后触发。 源码在 setIconCls() 中通过 fireEvent() 触发。 listeners: { iconclschange: function () {} }
titlechange 组件标题改变后触发。 源码在 setTitle() 中通过 fireEvent() 触发。 listeners: { titlechange: function () {} }
unfloat 浮动面板退出浮动状态后触发。 源码在 slideOutFloatedPanelEnd() 中通过 fireEvent() 触发。 listeners: { unfloat: function () {} }
Navigation

Type to search…

↑↓ navigate↵ selectEsc close