我想知道用淡入淡出效果交换屏幕上两个面板的最佳方法是什么?
我有两个面板,我使用 CSS 将它们放置在彼此之上。 panelOne 可见,panelTwo 隐藏。
单击另一个按钮(不在任何一个面板上)时,我希望 panelOne 淡出,而 panelTwo 淡入。
我目前使用下面的代码可以正常工作,但我发现它在我们这里用于测试的某些 Android 设备上非常滞后。有没有比我目前使用的更好的方法?我怎样才能改进这个动画?
此代码在点击按钮时执行:
Ext.Anim.run(panelOne, 'fade', {
duration: 100,
after: function() {
panelOne.hide();
}
});
Ext.Anim.run(panelTwo, 'fade', {
out: false,
duration: 100,
before: function() {
panelTwo.show();
}
});
非常感谢任何帮助。
谢谢。
最佳答案
没必要用这么久的Ext.Anim
。
例如,您的应用有一个 Ext.Container
,其中包含 panelOne
和 panelTwo
,分别作为第一个和第二个项目。
然后,如果您想使用 fade
动画从 panelOne
导航到 panelTwo
,只需简单地使用:
Ext.getCmp('your_container_id').animateActiveItem(1,'fade')
或者您可以这样做:
- 将
showAnimation: 'fadeIn'
添加到您的 panelTwo 的配置中 - 将
hideAnimation: 'fadeOut'
添加到您的 panelOne 的配置中
希望对您有所帮助。
关于android - Sencha 触摸 2 : switch between two panels with a "fade" animation?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10827674/