horizontally - javascript appear on scroll

ExtJs 4-Fade In view viewport

Question

Intento crear un efecto simple para mi aplicación, que consiste en fundirlo desde blanco durante un período de 1 a 2 segundos para que el usuario no tenga que verlo ensamblado.

Casi lo tengo funcionando, pero hay algunos parpadeos de los que parece que no puedo deshacerme. Básicamente, ExtJS está renderizando mi UI y luego escondiéndola para que se desvanezca.

Aquí está mi aplicación:

Ext.application({
name : ''MyApp'', // Application level namespace
appFolder : ''js/myapp'', // Directory path to app
autoCreateViewport : true,
launch : function() {
// fade in the viewport
var form = Ext.ComponentQuery.query("viewport")[0];
form.getEl().fadeIn({
from : {
opacity : 0
},
duration : 1000
});
}
});

¿Qué puedo hacer para deshacerme del sorteo inicial antes del FadeIn?

Answer 1

Supuse que podía establecer la opacidad de la ventana gráfica en 0 por defecto y funcionó:

Ext.define(''MyApp.view.Viewport'', {
extend : ''Ext.container.Viewport'',
style: ''opacity: 0;'',
items : [ {
xtype : ''someview''
} ]
});