Português:Preloader

Introdução ao Preloader do Gaia
O preloader do Gaia é um multi-loader inteligente, e um template de preloader chamado preload.fla é criado para você na pasta src - o Gaia carrega o preload.swf por padrão.

O preloader usa duas maneiras diferentes de rastrear o progresso do carregamento de múltiplos arquivos.

Divisão de Porcentagem
Gaia divide o valor de 1 pelo número de arquivos que serão carregados, e exibe o progresso individual como uma porcentagem dessa divisão. Por exemplo, se existem quatro arquivos a serem carregados, cada arquivo corresponde a 0.25 do progresso total, e cada um dos seus progressos de 0 a 1 poderia ser de 0 a 0.25.

Precisão de Bytes
Se você definir a propriedade bytes para as páginas e assets no site.xml, isso será usado para determinar o tamanho total do carregamento e a porcentagem real do que está sendo carregado. Então, se você está carregando dois arquivos, com um deles tendo 900k e o outro 100k, 90% da barra será destinada ao aruqivo de 900k, e 10% da barra ao arquivo de 100k. Usando a Divisão de Porcentagem, ambos os arquivos (900k e 100k) correspondem a 50% da barra. Como resultado, a barra andaria lentamente até os primeiros 50% e então pularia rapidamente para 100%. O Painel Gaia tem um botão que define a propriedade bytes para você.



Classes de Preloader
A classe do documento preload.fla é a classe do scaffold chamada Preloader. Preloader herda a classe AbstractPreloader e implementa a interface IPreloader. Como Páginas, o Preloader precisa ter os quatro métodos de transição requeridos. Adicionalmente, há um outro método: onProgress.

onProgress(event:AssetEvent)



AssetEvent
AssetEvent é o evento utilizado para acompanhar o carregamento de um asset até que o processo esteja completo. Possui as seguintes propriedades:

perc
perc:Number perc é a porcentagem geral do carregamento de todo o branch, sendo um floating point number entre 0 e 1.

asset
asset:AbstractAsset asset é uma referência ao Asset (páginas são um tipo de asset) que está carregando atualmente. No template padrão, esta informação é usada pelo preloader para mostrar o carregamento do asset atual e o progresso individual de cada um.

bytes
bytes:Boolean Se o total de bytes de todos os arquivos está definido no xml, este flag permite que você saiba que as propriedades loaded e total são em bytes.

loaded
loaded:Number Se bytes estiver definido como true, este é o número de bytes carregados. Caso contrário, esta é a contagem da página atual ou asset no branch que está carregando.

total
total:Number Se bytes estiver definido como true, este é o número total de bytes de todos os arquivos carregando. Senão, este é o número total de páginas e/ou assets no branch que está carregando.



onProgress
O método onProgress não precisa que nada seja feito. Se você quer apenas mostrar uma animação que não tem nada específico relacionado ao progresso do carregamento, fica a seu gosto.

Se você tem algum behavior personalizado para o seu preloader swf que precisa acessar qualquer lugar do seu site, você pode usar como target o preloader MovieClipAsset pelo método Gaia API getPreloader. Você pode usar isso para posicionar o preloader, definir sua transparência, etc.



Preloader Depth
Você pode definir o depth do preloader no site.xml, usando o atributo do site node "preloaderDepth". Você pode definir como "middle" ou "bottom". Isso irá posicioná-lo em relação ao container da página que você utilizar como target. Utilizar "middle" posiciona sobre o container do meio e abaixo do container do topo, "bottom" está sobre container de baixo e abaixo do container do meio. Por padrão, Gaia posiciona o preloader acima de todos os containers da página.



Ignorando o Preloader Durante a Execução
Se você quer ignorar o preloader durante a execução (runtime), use o método API setPreloader.

setPreloader(asset:MovieClipAsset) Você pode mudar o MovieClipAsset que o preloader usa durante a execução. Tenha certeza de que o MovieClipAsset já está carregado (de preferência dentro do depth "PRELOADER", veja a documentação Site XML) e que isso implementa a interface IPreloader. Leia mais sobre essa funcionalidade na documentação de API. Se o clipe que você associou ao preloader descarrega ou é removido por alguma razão, Gaia irá automaticamente reverter ao preloader padrão.



Asset Loader
A classe AssetLoader, usada por assets on-demand, usa a princípio o preloader default. Se você quer usar um carregador personalizado para mostrar progresso de assets on-demand, passe um MovieClipAsset já carregado para o método API setAssetPreloader(asset). O carregador personalizado precisa ser configurado como qualquer preloader Gaia. Deve ser um MovieClipAsset carregado que implementa IPreloader. Leia mais sobre esta funcionalidade na documentação de API.

Diferente do Branch loader, que carrega um único arquivo de cada vez, o AssetLoader carrega e monitora múltiplos assets de uma única vez. Isso dispara um AssetEvent, com uma importante diferença.

O asset que ele passa é o asset com o maior percentual carregado e que não está completamente carregado. Isso é importante apenas se você monitora o percentual e o nome de cada arquivo carregado, que é exatamente o que faz o Preloader padrão (do processo de Scaffold do Gaia).

Tenha em mente que, por padrão, o número máximo de HTTP requests simultâneos em mesmo domínio é 2, então serão carregados apenas dois assets de cada vez até que o processo se complete. Se você está carregando mais que dois assets, irá perceber que o terceiro asset não começa a carregar até que um dos dois primeiros esteja carregado.



PreloaderScaffold
O template de Preloader do Flash contém um MovieClip linkado à classe PreloaderScaffold. Este MovieClip e sua class estão simplesmente como exemplo e você está livre para modificá-los ou substituí-los.

O PreloaderScaffold tem seus próprios métodos transitionIn e transitionOut que usam TweenLite para o fade in e out. Isso também centraliza o MovieClip no palco.

Dê uma olhada na classe PreloaderScaffold que é criada durante o Scaffolding. Seu onProgress event handler tem exemplos e comentários sobre como tirar proveito dos dados que vem do AssetEvent.

Nota: O MovieClip dentro do arquivo preload.fla que é criado pelo Gaia está com o Blend Mode "Invert", para que fique sempre visível em qualquer cor de fundo. Você provavelmente vai querer mudar o blending para Normal quando for colocar seus próprios gráficos dentro do MovieClip.



Ignorar Preloader
Se você quer usar um preloader leve para o carregamento inicial, e então ter um preloader mais robusto para o resto do site, uma técnica comum é fazer um asset node dentro do node da página index para seu preloader principal, e então transitionIn é chamado na página index, e define o preloader para aquele MovieClipAsset.

Veja a documentação API para mais informações sobre ignorar o Preloader default e o Asset Preloader.



Informação Relacionada
Usando um nome de arquivo diferente para o preloader padrão

Mostrar o preloader quando usar assets on-demand