我正在使用Ext JS classic 6.2,并创建了以下动画:
我现在要做的是使窗口从右到左逐渐增大。有可能吗?
我的代码:
listeners: {
afterrender: 'afterrender',
close: () => MCLM.DrawHelper.finish(),
show: (win) => {
var painelEsquerdo = Ext.getCmp('painelesquerdo');
var painelCentral = Ext.getCmp('painelCentral');
var drawBtn = Ext.getCmp('drawBtn');
win.setMinWidth(0);
win.setX(painelEsquerdo.getWidth() + painelCentral.getWidth() - win.getWidth());
win.setY(drawBtn.getY());
win.setMinHeight(drawBtn.getHeight());
win.setHeight(drawBtn.getHeight());
var oldSize = win.getWidth();
win.setWidth(0);
win.animate({
duration: 300,
to: {width: oldSize}
});
}
}
答案 0 :(得分:0)
已解决。代码:
listeners: {
show: (win) => {
var painelEsquerdo = Ext.getCmp('painelesquerdo');
var painelCentral = Ext.getCmp('painelCentral');
var drawBtn = Ext.getCmp('drawBtn');
// Efeito de expansão partindo do tamanho zero
win.setMinWidth(0);
var oldSize = win.getWidth();
// Por alguma razão, a janela aparece uma vez antes da animação começar onde X estiver setado
// por isso, o width é zerado e o X é jogado para fora da tela
win.setWidth(0);
win.setX(-9999);
// Alinhamento com o botão do menu
win.setMinHeight(drawBtn.getHeight());
win.setHeight(drawBtn.getHeight());
win.setY(drawBtn.getY());
// Em 150 milissegundos, diminui o X para a esquerda e aumenta o width para a direita
win.animate({
duration: 150,
from: {
width: 0,
x: painelEsquerdo.getWidth() + painelCentral.getWidth()
},
to: {
width: oldSize,
x: painelEsquerdo.getWidth() + painelCentral.getWidth() - oldSize
}
});
}
}
我需要做的是减小X并将窗口宽度从0增加,以便每次迭代都将X移到左侧(减小其值)并将窗口的宽度增加到右侧。