Designer de games Prof Alexandre P Silva

1


Vamos nesta aula vetorizar um mapa do Brasil por regies e fazer com que quando o mouse passar
por cima de uma determinada regio, seja exibida uma descrio daquela regio, neste exemplo vou mostrar
a lista dos estados de cada regio.

1. Copie a imagem abaixo para seu micro.



2. Abra o Flash e crie um novo arquivo com 550 pixels de largura e 400 pixels de altura.

3. Importe o arquivo do mapa para o palco e centralize-o no palco.

4. Agora vamos vetorizar o mapa. Selecione o mapa e clique em Modify/Bitmap/trace bitmap.



5. Na caixa de dilogo que se segue, aceite os valores padro clicando em OK.

Designer de games Prof Alexandre P Silva

2


6. D alguns cliques no mapa para testar, voc ir perceber que o mapa ficou com a aparncia de um
desenho feito no prprio Flash, ele se transformou numa Forma.

7. Agora devemos transformar cada regio num nico Movie clip, vamos usar a regio Sudeste como
exemplo, clique no Rio de Janeiro, pressione a tecla SHIFT e v clique em So Paulo, Minas Gerais e
Esprito Santo. Quando voc tiver os quatro estados selecionados, pressione a tecla F8 e converta em
smbolo grfico.



8. Repita o processo para as quatro outras regies, at que tenhamos 5 Movie clips.

9. D um clique na regio Sudeste, que agora um nico movie clip e d o nome de sudeste a
instncia.



10. D o nome da regio a cada um dos outros movie clips (nordeste, centro, norte e sul).

11. D um clique duplo na no movie clip da regio sudeste, fazendo isto voc ir entrar no modo de
edio do movie clip.

Designer de games Prof Alexandre P Silva

3


12. D um clique no primeiro quadro da linha de tempo e insira uma action stop();

13. Pressione F6 para criar um quadro-chave no segundo quadro e escreva ao lado da regio algumas
informaes sobre ela, neste exemplo vou colocar o nome dos estados. Aproveite e troque as cores dos
estados tambm.



14. Coloque uma action stop(); no segundo quadro tambm.

15. Retorne a Scene 1.



Vamos fazer a mesma coisa com as quatro outras regies.
Designer de games Prof Alexandre P Silva

4

16. Clique duas vezes na regio Sul para entrar no modo de edio do movie clip.

17. Insira uma action stop(); no primeiro quadro da linha de tempo.

18. Pressione F6 para criar um quadro-chave no segundo quadro.

19. Insira uma action stop(); no segundo quadro.

20. Ainda no segundo quadro, altere a cor da regio e insira as informaes sobre os estados.



21. Clique duas vezes na regio Nordeste para entrar no modo de edio do movie clip.

22. Insira uma action stop(); no primeiro quadro da linha de tempo.

23. Pressione F6 para criar um quadro-chave no segundo quadro.

24. Insira uma action stop(); no segundo quadro.

25. Ainda no segundo quadro, altere a cor da regio e insira as informaes sobre os estados.

26. Retorne a Scene 1.



27. Clique duas vezes na regio Norte para entrar no modo de edio do movie clip.

28. Insira uma action stop(); no primeiro quadro da linha de tempo.

29. Pressione F6 para criar um quadro-chave no segundo quadro.

30. Insira uma action stop(); no segundo quadro.

31. Ainda no segundo quadro, altere a cor da regio e insira as informaes sobre os estados.

Designer de games Prof Alexandre P Silva

5


32. Retorne a Scene 1.

33. Clique duas vezes na regio Centro-oeste para entrar no modo de edio do movie clip.

34. Insira uma action stop(); no primeiro quadro da linha de tempo.

35. Pressione F6 para criar um quadro-chave no segundo quadro.

36. Insira uma action stop(); no segundo quadro.

37. Ainda no segundo quadro, altere a cor da regio e insira as informaes sobre os estados.



38. Retorne a Scene 1.

39. D um clique na regio Sudeste e insira a action abaixo:

on (rollOver)
{
gotoAndStop(2);
}
on (rollOut)
{
gotoAndStop(1);
}

Designer de games Prof Alexandre P Silva

6
40. D um clique na regio Nordeste e insira a action abaixo:

on (rollOver)
{
gotoAndStop(2);
}
on (rollOut)
{
gotoAndStop(1);
}

41. D um clique na regio Sul e insira a action abaixo:

on (rollOver)
{
gotoAndStop(2);
}
on (rollOut)
{
gotoAndStop(1);
}

42. D um clique na regio Norte e insira a action abaixo:

on (rollOver)
{
gotoAndStop(2);
}
on (rollOut)
{
gotoAndStop(1);
}

43. D um clique na regio Centro-oeste e insira a action abaixo:

on (rollOver)
{
gotoAndStop(2);
}
on (rollOut)
{
gotoAndStop(1);
}

Vamos testar nosso projeto agora. Esta aula tem como inteno prepara-lo para possveis aes
como a que aprendemos.