Javascript 在ExtJS中缩放（调整）窗口或面板的高度不会'；不动

我有下面的代码来调整窗口的大小，但似乎窗口/面板的缩放只适用于宽度

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

---

如果我取消对“setHeight”行的注释，则调整大小是有效的，但随后调整大小的动画消失了。有什么想法吗？

显然窗口不能像那样缩放

窗口类中没有scale方法。 您正在以编程方式缩放窗口的元素，而窗口不知道

解决方案是替代长方体构件的缩放方法：

Ext.override(Ext.BoxComponent, {
    scale: function(w, h, duration, easing) {
        var a = Ext.lib.Anim.motion(this.el, {
            height: {to: h},
            width: {to: w}
        }, duration || 0.35, easing || 'easeOut', function(){
            a.onTween.clearListeners();
        });
        a.onTween.addListener(function(){
            if (this.fixedCenter) {
                this.center();
            }
            this.syncSize();
            this.syncShadow();
        }, this);
        a.animate();
    }
});

Ext.onReady(function(){

    var scale = function () {
        win.scale(500, 400);
    }
    var win = new Ext.Window({
        fixedCenter: true,
        html: "test",
        width: 200,
        height: 200,
        buttons: [{
            text: "scale",
            handler: scale
        }]
    }).show();
});

---

在

上找到的解决方案显然无法像那样缩放窗口

窗口类中没有scale方法。 您正在以编程方式缩放窗口的元素，而窗口不知道

解决方案是替代长方体构件的缩放方法：

Ext.override(Ext.BoxComponent, {
    scale: function(w, h, duration, easing) {
        var a = Ext.lib.Anim.motion(this.el, {
            height: {to: h},
            width: {to: w}
        }, duration || 0.35, easing || 'easeOut', function(){
            a.onTween.clearListeners();
        });
        a.onTween.addListener(function(){
            if (this.fixedCenter) {
                this.center();
            }
            this.syncSize();
            this.syncShadow();
        }, this);
        a.animate();
    }
});

Ext.onReady(function(){

    var scale = function () {
        win.scale(500, 400);
    }
    var win = new Ext.Window({
        fixedCenter: true,
        html: "test",
        width: 200,
        height: 200,
        buttons: [{
            text: "scale",
            handler: scale
        }]
    }).show();
});

在中找到解决方案