Preloader em ActionScript 3.0

No post anterior trabalhamos com o carregamento de uma imagem externa, agora vamos fazer um preloader para o carregamento de uma imagem. Se você não fez o exercício anterior, arrume uma foto do tipo JPG , GIF ou PNG e coloque na mesma pasta do seu arquivo swf. no meu caso eu vou utilizar essa imagem :

Blog fellyph cintra - foto

Primeiro vamos preparar o terreno. crie um movieclip como o nome barra e o seu resgistration no canto esquerdo ao centro como na imagem abaixo.

Blog fellyph cintra - tela preloader 1

Coloque o nome de instância da barra “barra_mc”, selecione o frame para inserir o nosso código e vamos programar:

var str:String = "foto.jpg";
var carregador:Loader = new Loader();
var requisicao:URLRequest = new URLRequest(str);
// criei as variáveis necessárias para efetuar o carregamento , o Loader e URLRequest

carregador.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onProgresso);
carregador.contentLoaderInfo.addEventListener(Event.COMPLETE, onCompleto);
// Adicionei os Eventos para o carregamento

carregador.load(requisicao);
//Mandei carregar o arquivo

// A função que vai ser chamada quando carregar o aquivo.
function onCompleto(e:Event):void{
    var foto:Bitmap;
    foto = e.target.content;
    //criei uma variável para receber a imagem que vai ser carregada
    addChild(foto);
    //adiciono a imagem no stage
}

// A função que vai chamada no progresso do carregamento
function onProgresso(e:ProgressEvent):void{

        var total:Number = e.bytesTotal;
	// pego o total de bytes que eu vou carregar
        var lidos:Number = e.bytesLoaded;
        // pego a quantidade de bytes que eu já carreguei
	var pc:Number = lidos/total;
        // pego o percentual dividindo lidos por total
        barra_mc.scaleX = pc;
}

Vou comentar a ultima função a onProgress ela é disparada no Evento ProgressEvent.PROGRESS ela é chamada durante o progresso do meu download. No evento que a função recebe ProgressEvent tem as propriedades bytesTotal que possui a quantidade total de bytes que serão carregados pelo swf e bytesLoaded que possui a quantidade que foi carregada até o momento. E para extrairmos o percentual basta dividir a quantidade de bytes lido até o momento pelo total.

Por Fim atribuímos o percentual ao scaleX da barra. O exercício é simples mas qualquer dúvida podem comentar. Também aceito sugestões de tutoriais.

Por enquanto é só pessoal. depois eu coloco o fonte para download.

Até Breve


Publicado

em

por

Comentários

2 respostas para “Preloader em ActionScript 3.0”

  1. Avatar de André Barbosa
    André Barbosa

    Muito massa seu tutorial, parabéns!
    Mas como faço para que depois de carregado a imagem a barra suma?

    Abraço

  2. Avatar de Fellyph

    Olá André na função onCompleto adiciona : barra_mc.visible = false

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *