Neste artigo explicarei como criar um preloader com a barra de progresso, para isso é necessário que você tenha em mãos os arquivos do artigo anterior: Seqüencial Preloader – Porcentagem.

Vamos direto a prática

1) Abra o arquivo Principal.fla.

2) Abra o Movie Clip Preloader. Crie a camada Contorno e Barra. Na camada barra desenhe um retângulo de 100px por 20px, depois recorte seu contorno e coloque na camada Contorno. Clique na Barra, sem o contorno, e precione a tecla F8. Digite no campo Name: Barra, escolha o radiobutton Movie Clip e escolha o primeiro Registration da segunda linha. Pressione OK.

var preloader:MovieClip;
// Nosso MovieClip
var numero:Number = new Number(0);
// Variável numero iniciada com o valor 0
function Init() {
// Função Init
_root.stop();
// Para o filme
onEnterFrame = function () {
// Ao entrar no quadro executar a função
var bl:Number = _root.getBytesLoaded();
// bl recebe os bytes carregados
var bt:Number = _root.getBytesTotal();
// bt recebe os bytes totais
if (bl>4 && bt>4 && bl>=bt) {
// Se os bytes carregados forem maior que 4 e os bytes totais forem maior que 4 e bytes carregados forem maior que bytes totais
delete onEnterFrame;
// Destrói o evento EnterFrame
_root.nextFrame();
// Vá para o próximo quadro
preloader.unloadMovie();
// Destrói o MovieClip preloader da memória
} else {
// Senão
numero = Math.floor(bl/bt*100);
// A variável numero vai receber o arredondamento dos bytes carregados divididos pelos bytes total multiplicados por 100
preloader.pct = numero+’%';
// O campo dinâmico vai receber a variável numero mais o caracter %
preloader.barra._width = numero;
// O tamanho da barra será o valor da variável número
}
};
}
Init();
// Chamamos a função Init

Até o próximo artigo deste seqüencial!

Clique aqui para baixar os fontes deste artigo!

Caso tenha alguma dúvida utilize o fórum.
Abraços, Renan Fretta – renan@mxstudio.com.br