Tutorial efeito chuva no Adobe Flash

Olá a todos. Já faz algum tempo que quero postar aqui no blog um tutorial do Adobe Flash, pois acho fantastico o programa, não sou expert no Flash, mas possuo algum conhecimento no programa.A versão que usei para este tutorial é o Adobe Flash CS3, mas creio eu que pode ser feito em qualquer versão do programa. Tipo o MX, o flash 8 e outras verões anteriores ou superiores ao CS3. Tempos atrás eu criei o mesmo tutorial no Flash 8, só que não pude postar aqui no blog. Criei no CS3 por ser a minha versão preferida.

Abaixo o video do efeito:

Imagem original:

Resolvi criar aqui mesmo o tutorial, sem usar uma paginá especifica, pois o meu blog já atingiu o limite de paginas. Então vamos lá:

Em primeiro lugar escolha uma imagem, na web ou em algum outro lugar que melhor se adapte ao efeito e salve em seu computador. Abra o Flash. Escolha action script 2.0, ja na interface do programa, clique em file, import, import to stage, como mostra a imagem abaixo:

No meu caso depois já com a imagem no palco do programa, eu tive que dar um flip horizontal na imagem. Para isso cliquei em modify, transform, flip horizontal.

Clique no primeiro frame da imagem, como mostra a elipse abaixo:

Tecle f9 para abrir o menu actions:

No editor de actions insira o seguinte código:

function chuva(qtd_pingo, vel_chuva){

_root.duplicador = qtd_pingo

for(i=0; i<=_root.duplicador;i++){

_root.createEmptyMovieClip("pingo" + i , i)

_root["pingo"+ i].moveTo(20,20)

_root["pingo"+ i].lineStyle(1,"0xcccccc", random(100))

_root["pingo"+ i].lineTo(20,3)

_root["pingo"+ i]._x = random(Stage.width)

_root["pingo"+ i]._y = random(Stage.height)

_root["pingo"+ i]._rotation = 135

}

onEnterFrame = function(){

    for(i=0; i<=_root.duplicador;i++){

       

        if(_root["pingo"+ i]._y>Stage.height){

            _root["pingo"+ i]._x = random(Stage.width)

            _root["pingo"+ i]._y = random(Stage.height)

        }

        else{

            _root["pingo"+ i]._y += vel_chuva

            _root["pingo"+ i]._x += vel_chuva

            }

       

    }

   

   

    }

}

chuva(200,20)

Creio eu que você sabe que é só preciso copiar o código aqui da pagina e colar no editor. Feche o editor clicando em f9.

Teste o movie clip teclando ctrl+ enter.

Pronto o efeito esta criado. No caso de você usar outra versão do  

Flash, você terá que converter a imagem num movie clip e impota-la para o palco do Flash, aconselho você a usar o CS3 ou uma versão superior que você não terá problema em criar o efeito.

Mudando os parametros do efeito:

Se você aterar a linha:

_root["pingo"+ i].moveTo(20,20)

só o (20,20) por (40,40) os pingos aumentaram, como mostra 

a imagem abaixo:

Se você diminuir o valor os pingos ficarão menores.

Em:

_root["pingo"+ i].lineStyle(1,"0xcccccc", random(100))

, se você aumentar o valor de random o Flash vai adicionar mais pingos na imagem, caso o valor seja menor, tera menos pingos na imagem.

em:

_root["pingo"+ i]._rotation = 135

em rotation o flash define o angulo em que os pingos cairam na imagem, se você alterar o valor, estará alterando o angulo em que os pingos cairão na cena.

Com o valor = 35,

ficará igual a imagem abaixo:

Se você quiser alterar a velocidade dos pingos é só alterar

a linha:

chuva(200,20)

Diminuindo o valor 20, você reduz a velocidade dos pingos do efeito.

Você pode também converter o arquivo em avi. E edita-lo no Movie Marker e incluir um som de chuva no arquivo oque ficaria bem legal. Enfim é só usar a criativaidade.

Bom gente é isso. Espero que gostem do tutorial e quem sabe em breve teremos mais tutoriais aqui do Adobe Flash. Um abraço á todos.