24 de jul. de 2012

Preloader em flash e AS3

Neste tutorial de actionscript vamos aprender a criar um preloader flash profissional. Você pode usar este preloader em qualquer site.
Vamos começar.

Exemplo



Passo 1

Crie um novo documento Flash. Pressione a tecla Ctrl + J (Document Properties) para definir a largura do documento para 400 pixels e a altura para 300 pixels. Selecione a cor # 161616 como cor de fundo. Ajuste a taxa do seu filme flash (frame rate) para 34 e clique em OK.

Passo 2

Nomeie a primeira camada como preloader (dê um duplo clique sobre o nome padrão (Camada 1) para mudar isso). Pressione Enter após ter digitado o novo nome!

Passo 3

Selecione a ferramenta Texto (A) e vá para o Painel de Propriedades (Ctrl + F3) abaixo do estágio. Em seguida, escolha as seguintes opções:

1. Selecione um campo Static Text,
2. Selecione o tipo de fonte que quiser (escolhi o tipo Amaze).
3. Escolher o tamanho da fonte (escolhi o tamanho 78).
4. Selecione branco como cor de fonte,
5. Como a opção de renderização, selecione Usar Anti-alias for readability.



Veja a imagem abaixo como irá ficar.



Passo 4

Enquanto o texto ainda está selecionada, pressione F8 (Converter em símbolo) para convertê-la em um Movie Clip Symbol.



Passo 5

Dê um duplo clique sobre o movie clip no palco com a ferramenta Selection (V). Agora você deve estar dentro do clipe de filme.

Passo 6

Dê um nome à camada actual (frame). dê um duplo clique sobre o nome padrão (camada 1) para mudar. Pressione Enter após digitar o nome!

Passo 7

Clique agora no frame 100 da layer de texto e tecle F5.

Passo 8

Crie uma nova camada acima da camada de texto e nomeia de "por cento"

Passo 9

Selecione a camada por cento, takle a Ferramenta de Texto (A) e vá para o Painel Properties novamente (Ctrl + F3) abaixo do estágio. Em seguida, selecione as seguintes opções:

a) Selecione um campo de texto dinâmico.
b) Selecione uma Times New Roman CE como tipo de fonte.
c) Escolha o tamanho da fonte 26 e negrito-lo.
d) Escolha a cor # C00F02.
e) Como a opção de renderização, selecione Anti - alias para facilitar a leitura.
f) para o tipo var percent12



Em seguida, desenhe uma forma de retângulo na parte inferior do lado esquerdo do texto de carregamento. Depois deste tipo, em que o retângulo de 99%! Veja a foto em baixo!


Passo 10

Volte à cena principal (Scene 1).

Passo 11

Selecione a ferramenta Selection (V) e clique uma vez sobre o preloader para selecioná-lo. Então, vá ao painel de AS (F9) e digite este código dentro do painel de ações:



Passo 12

Selecione agora a primeira imagem e vá novamente para o painel de AS (F9). Em seguida, insira o código dentro do painel de ações:

stop();

Estamos a fazer agora o preloader. Para ver como isso funciona, crie uma nova camada acima da camada preloader e chame-o filme. Depois disso, clique no frame 2 da camada de filme e tecle F6. Enquanto você ainda está na frame 2, importe algum filme ou imagem para o estágio flash.
Está pronto.

Teste a animação, divirta-se.

Espero que tenham gostado.

♥Ϡ₡ღ♥r♥o♥s♥a♥ღϠ₡ღ♥