View Full Version : [4.0.1] Ext.window.Window dimensions are not enforced until state is generated

20 May 2011, 12:48 PM
Ext.window.Window.minWidth and minHeight properties are not enforced until a state has been generated for the window. Since stateful windows do not intially have a state, the applyState() method is not called until the window is re-opened. For windows configured with stateful: false, minimum dimensions are never enforced.

Additionally, Internet Explorer sets window width = width of parent container.

OS: Windows 7 Professional SP1 x64
ExtJS: 4.0.1
Google Chrome 11.0.696.68
Firefox 4.0.1
Internet Explorer 9.0.8112.16421
Safari 5.0.5 (7533.21.1)
Opera 11.11 (Build 2109)

Steps to reproduce:

Run the code below.

var config = {
id: 'win1',
renderTo: Ext.getBody().createChild(),
title: 'window 1'

var showWin = Ext.create('Ext.button.Button', {
renderTo: Ext.getBody().createChild(),
text: 'show window'

var closeWin = Ext.create('Ext.button.Button', {
renderTo: Ext.getBody().createChild(),
text: 'close window'

showWin.on('click', function() {
var window = Ext.WindowMgr.get('win1');
if (!window) {
window = Ext.create('Ext.window.Window', config);
}, this);

closeWin.on('click', function() {
var window = Ext.WindowMgr.get('win1');
if (window) {
}, this);

Click "show window". Note the window does not enforce minimum dimensions.
Click "close window".
Click "show window" again. Now minimum dimensions are enforced.

Enforce minimum and maximum dimensions regardless of state. Stateful windows can then override the settings once a state exists.

Append the following to Ext.window.Window.initComponent():

if (isNaN(me.width) || me.width < me.minWidth) {
me.width = me.minWidth;
} else if (me.width > me.maxWidth) {
me.width = me.maxWidth;
if (isNaN(me.height) || me.height < me.minHeight) {
me.height = me.minHeight;
} else if (me.height > me.maxHeight) {
me.height = me.maxHeight;

8 Jan 2012, 7:26 PM
This still seems to be happening in 4.0.7. No love?

I noticed that when attempting to resize the Window, manually or programmatically, then minWidth and minHeight immediately take effect. Thus another workaround is to place
this.setSize(1, 1); inside initComponent().

It also seems that minWidth and minHeight are ignored for components rendered inside Windows, for example:

Ext.define('CO.view.file.Edit', {
extend: 'Ext.window.Window',
alias : 'widget.fileedit',

title: 'Edit',
autoShow: true,
closable: false,
items: [{
xtype: 'panel',
html: 'Hello world.',
minHeight: 200,
minWidth: 400

The Panel inside the Window is sized just big enough to contain the "Hello World" string, rather than to 400x200 pixels.