A specialized panel intended for use as an application window. Windows are floated, resizable, and draggable by default. Windows can be maximized to fill the viewport, restored to their prior size, and can be minimized.
Windows can also be linked to a Ext.window.WindowGroup or managed by the Ext.window.WindowMgr to provide grouping, activation, to front, to back and other application-specific behavior.
By default, Windows will be rendered to document.body. To constrain a Window to another element specify renderTo.
true
to animate the transition when the panel is collapsed, false
to skip the
animation (defaults to true
if the Ext.Fx class is available, otherwise false
).
May also be specified as the animation duration in milliseconds.True to display the 'close' tool button and allow the user to close the window, false to
hide the button and disallow closing the window (defaults to true
).
By default, when close is requested by either clicking the close button in the header or pressing ESC when the Window has focus, the close method will be called. This will destroy the Window and its content meaning that it may not be reused.
To make closing a Window hide the Window so that it may be reused, set closeAction to 'hide'.
The action to take when the close header tool is clicked:
Note: This behavior has changed! setting *does* affect the close method which will invoke the approriate closeAction.
The direction to collapse the Panel when the toggle button is clicked.
Defaults to the headerPosition
Important: This config is ignored for collapsible Panels which are direct child items of a border layout.
Specify as 'top'
, 'bottom'
, 'left'
or 'right'
.
true
to make sure the collapse/expand toggle button always renders first (to the left of)
any other tools in the panel's title bar, false
to render it last (defaults to true
).Important: this config is only effective for collapsible Panels which are direct child items of a border layout.
When not a direct child item of a border layout, then the Panel's header remains visible, and the body is collapsed to zero dimensions. If the Panel has no header, then a new header (orientated correctly depending on the collapseDirection) will be inserted to show a the title and a re-expand tool.
When a child item of a border layout, this config has two options:
alt
: Default.header
: collapsed
config and the window
will always be expanded when shown.'x-panel-collapsed'
).'x-panel-collapsed'
).True to make the panel collapsible and have an expand/collapse toggle Tool added into the header tool button area. False to keep the panel sized either statically, or by an owning layout manager, with no toggle Tool (defaults to false).
See collapseMode and collapseDirectionSpecifies a Component to receive focus when this Window is focused.
This may be one of:
var panel = new Ext.Panel({
fullscreen: true,
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
items: [{
text: 'Docked to the bottom'
}]
}]
});
True to allow the window to be dragged by the header bar, false to disable dragging (defaults to true). Note that by default the window will be centered in the viewport, so if dragging is disabled the window may need to be positioned programmatically after render (e.g., myWindow.setPosition(100, 100);).
Important: This config is only effective for collapsible Panels which are direct child items of a border layout.
true to allow clicking a collapsed Panel's placeHolder to display the Panel floated above the layout, false to force the user to fully expand a collapsed region by clicking the expand button to see it again (defaults to true).'top'
, 'bottom'
, 'left'
or 'right'
. Defaults to 'top'
.'top'
, 'bottom'
, 'left'
or 'right'
. Defaults to 'top'
.true
to hide the expand/collapse toggle button when collapsible == true
,
false
to display it (defaults to false
).true
to hide the expand/collapse toggle button when collapsible == true
,
false
to display it (defaults to false
).Important: This config is only effective for collapsible Panels which are direct child items of a border layout
when using the default 'alt'
collapseMode.
b>Optional. A Component (or config object for a Component) to show in place of this Panel when this Panel is collapsed by a border layout. Defaults to a generated Header containing a Tool to re-expand the Panel.
Specify as true
to allow user resizing at each edge and corner of the window, false to disable resizing (defaults to true).
This may also be specified as a config object to
true
to allow expanding and collapsing the panel (when collapsible = true
)
by clicking anywhere in the header bar, false
) to allow it only by clicking to tool button
(defaults to false
)).If this Window is configured draggable, this property will contain an instance of Ext.util.ComponentDragger (A subclass of DragTracker) which handles dragging the Window's DOM Element, and constraining according to the constrain and constrainHeader .
This has implementations of onBeforeStart
, onDrag
and onEnd
which perform the dragging action. If extra logic is needed at these points, use
createInterceptor or createSequence to
augment the existing implementations.
Closes the Panel. By default, this method, removes it from the DOM, destroys the Panel object and all its descendant Components. The beforeclose event is fired before the close happens and will cancel the close action if it returns false.
Note: This method is not affected by the closeAction setting which only affects the action triggered when clicking the 'close' tool in the header. To hide the Panel without destroying it, call hide.
this
reference) in which the callback is executed. Defaults to this Window.