PDA

View Full Version : Scaling (resizing) the height of a window (or panel) does not work



mvdbergh
14 Dec 2010, 11:38 PM
Ext version tested:


Ext 3.3.0
Ext 3.3.1


Adapter used:


ext


css used:


only default ext-all.css


Browser versions tested against:


FF 3.6.13 (firebug 1.6.0 installed)
Chromium 8.0.552.215


Operating System:


Ubuntu 10.10


Description:


When trying to scale a window (or panel) component using the 'scale' method the height does not seem to change or animate. When using the 'setHeight' method, the height is adjusted correctly but without the animation 'scale' provides.


Test Case:




<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title id='title'>Title</title>

<!-- ** CSS ** -->
<!-- base library -->
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />

<!-- overrides to base library -->


<!-- ** Javascript ** -->
<!-- base library -->
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../ext-all-debug.js"></script>


<!-- overrides to base library -->

<!-- extensions -->

<!-- page specific -->

<script type="text/javascript">
Ext.BLANK_IMAGE_URL = '../../resources/images/default/s.gif';

Ext.onReady(function(){

var myWindow = new Ext.Window();
myWindow.width = 80;
myWindow.height = 80;
var myButton = new Ext.Button({
text: 'Clickme',
handler: function(button, event){
myWindow.el.scale(400, 400);
//myWindow.setHeight(400);
}
});
myWindow.add(myButton);
myWindow.show();

}); //end onReady
</script>

</head>
<body>
</body>
</html>Steps to reproduce the problem:


Run the example and press the button.


The result that was expected:


The window to resize in both width and height.



The result that occurs instead:


The window only resized the width, not the height.


Debugging already done:


none


Workaround:


Resize using 'setHeight', you loose the animation though.

Animal
15 Dec 2010, 12:22 AM
There is no scale method in the Window class.

You are programatically scaling the Window's Element without the Window's knowledge.

If you do a search you will see that there have been posted solutions for adding a scale method to the Window class.

mvdbergh
15 Dec 2010, 12:56 AM
Thanks for your quick reply, what riddled me was that the width does nicely scale.

Did some searching on Google for this problem but didn't find a good solution, searching within the forum does indeed give good results.

http://www.sencha.com/forum/showthread.php?65176-Window-scale()-override-problem&p=314861 (http://www.sencha.com/forum/showthread.php?65176-Window-scale%28%29-override-problem&p=314861)

Animal
15 Dec 2010, 1:27 AM
This will become easy in Ext4.

The Animation API works on either an Element or a Component.