如何设置 ExtJS 窗口显示/隐藏动画？

Question

这是我的源代码：

Ext.create('Ext.window.Window', { id:'edit_segtype_win', 标题：'味精'， 布局：'适合'， html：数据， 模态：真， 可调整大小：假， 约束：真 }).show(未定义,bind_ajax_success);

当我调用 show(...) 时，窗口将显示没有任何动画。 我想添加一些动画，例如淡入/淡出/滑入/滑出。 有人可以帮助我吗？谢谢！

Answer 1

您可以使用 Anim 对象 http://docs.sencha.com/extjs/4.2.0/#!/api/Ext.fx.Anim 在您的窗口组件中使用，如下所示：

var myWindow = Ext.create('Ext.window.Window', {
    html:"hello world",
});

Ext.create('Ext.fx.Anim', {
    target: myWindow,
    duration: 1000,
    from: {
        width: 400, //starting width 400
        opacity: 0,       // Transparent
        color: '#ffffff', // White
        left: 0
    },
    to: {
        width: 300, //end width 300
        height: 300 // end height 300
    }
});

然后，当您调用

时添加该动画

window.show();