我有一个按钮,可以删除当前视图以显示下面的内容。它工作正常,除了我想动画它。这可能吗?
有效的删除代码:
Ext.Viewport.remove(Ext.Viewport.getActiveItem(), true);
使用动画调用另一个视图的示例:
var c = Ext.getCmp('NextView');
if(c === undefined) c = Ext.create('MyApp.view.NextView');
Ext.Viewport.animateActiveItem(Ext.getCmp('NextView'), {type: 'slide', direction: 'left'});
我已经尝试了以下但没有成功:
Ext.Viewport.remove(Ext.Viewport.getActiveItem(), true, {type: 'slide', direction: 'left'});
同时:
Ext.Viewport.remove(Ext.Viewport.getActiveItem(), {type: 'slide', direction: 'left'});
注意,我需要移除屏幕(而不仅仅是调用另一个),因为该组件在整个应用程序中都已链接。
答案 0 :(得分:5)
首先:感谢sencha这个极好的谜题。
在阅读Container#remove()
的实施后,我发现有可能使用activeitemchange
事件:
back: function() {
var items,
current,
previous;
items = Ext.Viewport.getItems();
current = items.get(items.length - 1);
previous = items.get(items.length - 2);
Ext.Viewport.on({
activeitemchange: 'onAfterAnimate',
scope: this,
single: true,
order: 'after',
args: [current]
});
Ext.Viewport.animateActiveItem(previous, {type: 'slide', direction: 'right'});
},
onAfterAnimate: function(itemToDestroy) {
itemToDestroy.destroy();
}
请注意,我使用this
作为scope
。 scope
用于方法查找。