Desenvolvimento - ActionScript

ActionScript: Conhecendo a class MovieClipLoader

Aprenda como criar ações para preloader de arquivos externos e como agilizar o processo de criação com a class MovieClipLoader.

por Rafael Costa


Aprenda como criar ações para preloader de arquivos externos e como agilizar o processo de criação com a class MovieClipLoader.

Quando estamos começando a programar em AS (ActionScript), logo começam a surgir alguns pequenos problemas, porém bem intrigantes. Um deles (acho que muitos passaram por isso) é uma class para nos facilitar, e muito, a usar um loader para arquivos externos (swf, jpg, gif e png).

E é exatamente para isso que existe a class MovieClipLoader. Com ela você poderá monitorar MUITO mais facilmente o carregamento de seus arquivos externos. Mas chega de teoria e vamos à prática.

Vou listar abaixo alguns eventos e métodos da class e sua devida explicação:

Eventos

onLoadInit() - É chamado quando o primeiro frame do arquivo carregado for executado.

onLoadStart() – É chamado quando iniciar o carregamento.

onLoadProgress(destino, bytesLoaded, bytesTotal) – Chamado enquanto o carregamento é feito

onLoadError(destino, errorCode, httpStatus) – Caso haja erro no download, chama-se este evento.

onLoadComplete(destino) – Ao carregar o arquivo completamente.

Métodos

addListerner() – Adiciona a class em um objeto.

getProgress() – Retorna o número de bytes carregados do arquivo.

loadClip(“arquivo”, destino) – Indica o arquivo a ser carregado.

removeListener() – Remove a class do objeto.

unloadClip() – Remove o arquivo carregado por loadClip().

Estas são as informações básicas para usar a class MovieClipLoader().

Agora que vimos seus eventos e métodos, vamos aprender como utilizá-la.

Obs: Cada linha de código terá sua explicação. Nós usaremos sempre o object para criarmos os eventos.

Crie um novo arquivo (ctrl + N). Abra o painel de Actions (F9) e digite o seguinte:

this.createEmptyMovieClip("clipe", 0); // criar um clipe de filme vazio

clipe._x = clipe._y = 0; // _x e _y do clipe igual a 0;

var mcl:MovieClipLoader = new MovieClipLoader(); // criar a class MovieClipLoader

var objeto:Object = new Object(); // criar o object

mcl.addListener(objeto); // Atribuir um listener para o MovieClipLoader

mcl.loadClip("http://www.brunocortez.com.br/img/base.jpg", clipe); // carrega a imagem no destino(clipe)

Explicando o código, criamos um clipe de filme vazio pelo método createEmptyMovieClip, depois o posicionamos em posição 0. Criamos a class MovieClipLoader e atribuímos um object à ela. Carregamos a foto no clipe criado anteriormente.

Agora precisamos criar um preloader, uma mensagem de sucesso e uma mensagem de erro, caso ocorra. Para isso vamos usar: onLoadInit, onLoadComplete, onLoadError e onLoadProgress.

Crie uma barra e um campo de texto dinâmico. O campo deverá ter a variável de pct e a barra deverá ter o ponto de registro no canto esquero para dar a impressão de que ela está aumentando. Instancie a barra de “barra” (sem aspas).

Agora abra o painel de ações e adicione o seguinte código ao anterior:

/* Criando o preloader */

objeto.onLoadProgress = function(clipe:MovieClip, bytesLoaded:Number, bytesTotal:Number) {

//criamos o evento responsável pelo preloader e definimos 3 elementos para a função funcionar(clipe onde foi carregado, bytes carregados e bytes totais)

lido = Math.floor((bytesLoaded/bytesTotal)*100); // Criamos uma variável que calcula a porcentagem carregada. obs:Math.floor() arredonda o valor.

pct = lido + "%"; // Atribui a porcentagem ao campo de texto dinâmico

barra._xscale = lido; // Altera a scale da barra de acordo com a porcentagem.

}

Criaremos agora mais dois eventos. Um para erro e um para carregamento completo.

Caso o arquivo não seja carregado, exibiremos na caixa de output (famoso trace) o código do erro e o status.

/* Ação para erro */

objeto.onLoadError = function(clipe:MovieClip, errorCode:String, httpStatus:Number) {

trace("O arquivo: "+clipe+" não pôde ser lido.\nErro:"+errorCode + " ===== " + httpStatus);

}

Se for carregado com sucesso...

/* Ação para leitura completa */

objeto.onLoadComplete = function(clipe:MovieClip) {

trace("Arquivo "+clipe+" carregado com sucesso");

}


Baixe o arquivo FLA.
Rafael Costa

Rafael Costa - Programador Actionscript há 2 anos. Participante do fórum FlashMasters, maior comunidade Flash do Brasil.
Além de Actionscript, possui conhecimentos em outras linguagens como: JavaScript, CSS, XHTML, PHP e MySQL.
Para saber mais sobre o autor, visite seu site: http://www.rafaelcosta.com.