Artur Guitelar WebGamescomAS3

Games em ActionScript 3.
0
1

Web Games
Aprendendo a criar seus jogos para web.

Objetivo 1:
Um jogo de nave simples.

Games em ActionScript 3.0
2

Introduo:
O Objetivo dessa apostila indicar os primeiros passos para aspirantes a criador de jogos.
Tentei colocar aqui as bases necessrias para criao de um jogo simples, que pode ser feito
com apenas alguns dias de trabalho, mas que contm as principais coisas necessrias, como
movimentao via teclado, criao de vrios inimigos, coliso e sons.
De maneira alguma tenho expertise no assunto, sou apenas um entusiasta apaixonado por
jogos que quer ajudar outros entusiastas a seguirem um caminho. Estou apenas auxiliando no
aprendizado de uma ferramenta onde os criadores podero ver seus projetos se
movimentando pela tela.

Espero que essa apostila lhe ajude tanto quanto me ajudou t-la criado e que voc se divirta
tanto quanto eu.

Artur Guitelar - Killdragon
3

Ok, porque ActionScript 3.0?
Explicando de forma rpida e fcil, o ActionScript uma linguagem de programao script
desenvolvida pela Adobe e que pode ser encontrada no Flash ou no Flex, softwares da mesma
empresa.
Embora o software tenha um forte apelo para sites e animaes web, o cdigo robusto e
conciso o suficiente para permitir que sejam programados bons jogos, que podem tanto ser
jogados online quanto no computador, principalmente se sua inteno for desenvolver jogos
de pequeno e mdio porte. Mas nada impede que um programador experiente possa
desenvolver jogos de grande porte. Deixo como exemplo uma imagem do MMO Dofus
(http://www.dofus.com/pt), para que os mais curiosos procurem informaes sobre ele no site
da Ankama e entendam do que eu estou falando.

Existe uma srie de softwares para criao de games gratuitos pela web, como o RPG Maker, o
The Games Factory e o Game Maker. E at mesmo Engines poderosssimas como a Unreal e a
Unity 3D.
Mas, a meu ver, enquanto os primeiros exemplos limitam um pouco o aprendizado real de
programao por serem softwares um pouco mais limitados, os dois ltimos citados so
direcionados a quem j tem certa experincia na rea.
Para mim o ActionScript 3.0 est entre estes dois estilos de software. Se for usado em conjunto
com o Flash o aprendizado se torna uma experincia visual gratificante, pois os primeiros
4

passos acontecem muito rapidamente, e logo possvel comear a programar jogos simples,
desde que se entendam os conceitos corretamente.
A linguagem tambm muito popular na Web, e no nada difcil encontrar bom material de
estudo em livrarias e pela internet afora.
A questo aqui que a maioria do material voltado para jogos est disponvel em ingls. Essa
apostila visa clarear um pouco a mente de todos tambm neste sentido, pois preciso mais
material sobre o assunto em portugus.

E porque WebGames?
Em sua maioria os WebGames possuem caractersticas nicas que ajudam muito a quem est
iniciando no mundo do desenvolvimento de jogos.
Fcil distribuio: No muito difcil encontrar sites gratuitos que hospedem seu jogo
ou, se voc j tiver experincia com sites, hospedar um WebGame em flash em seu
prprio servidor;
Feedback rpido: Aproveitando o poder de comunicao que a internet possui
possvel obter rpidas respostas positivas ou negativas sobre o seu game;
H muito material de inspirao na Internet: Uma rpida olhadela em sites como o
http://www.kongregate.com/ ou o http://armorgames.com/ e j possvel encontrar
centenas de games disposio para inspirao.

5

Agora entendi. Vamos comear?
Vamos com calma. Antes de comearmos a produzir nossos jogos preciso entender alguns
conceitos por trs da programao.
Primeiramente vamos dar uma olhada na interface do Adobe Flash CS5:

Provavelmente essa a primeira janela que o Flash ir apresentar quando for iniciado. bom
lembrar que o objetivo desta apostila no ensinar sobre o software em si, e sim sobre a
linguagem ActionScript 3.0 voltada para jogos, e algumas formas de usar o programa em prol
disso. Mas fique tranquilo, mesmo que no tenha tido experincias antigas com o Flash, basta
seguir os exerccios atenciosamente e tudo estar bem.
Claro que conhecer o programa previamente ir facilitar um pouco as coisas, mas no
extremamente necessrio domin-lo por completo.
De qualquer forma o site oficial da Adobe (http://www.adobe.com/pt/ ) possui diversos
tutoriais e o prprio help do programa bem amigvel. Livrarias e Internet tambm possuem
materiais de qualidade sobre o software.
Para comear, basicamente iremos precisar clicar em ActionScript 3.0, que se encontra na
coluna Criar novo. Isso ir abrir um documento novo j preparado para aceitar a linguagem.
Duas coisas superimportantes:
6

Este tipo de arquivo no Flash recebe a extenso .fla quando salvo, e o principal
documento do seu projeto;
No possvel unir de forma consistentes projetos que possuam cdigos em
ActionScript 2.0 e ActionScript 3.0. A linguagem ActionScript 2.0 est descontinuada
pela Adobe, mas ainda possuem programadores que preferem utiliz-la.
Com o documento aberto iremos precisar basicamente de duas janelas (que no esto
habilitadas por padro) para iniciarmos os exerccios: Aes (F9) e Sada (F2).

Arraste a nova janela Aes que se abriu para a faixa de baixo onde est o painel Linha do
tempo e, quando a cor da faixa estiver azul, solte.
7

Deve ficar desta forma:

Existem outras formas de organizar as janelas, mas no iremos nos preocupar com isso agora.

8

Salvando Arquivos
interessante sempre salvar os arquivos, mesmo antes de terminar de editar um documento.
Isso impede que sejamos pegos de surpresa caso acabe a luz, ou algum evento estranho
desligue o computador no meio daquele cdigo complicado que acabamos de criar.
Para salvar arquivos no Flash, basta clicarmos no menu Arquivo e escolhermos a opo Salvar.

Na primeira vez que salvamos, o programa nos d a opo de escolhermos o local, o nome e o
tipo do arquivo que iremos salvar.

Depois disso, basta ir clicando em salvar periodicamente, depois de fazer alteraes. O arquivo
sempre ser salvo no mesmo lugar, com o mesmo nome.
O nome do arquivo agora aparece na aba da parte superior da cena.
9

Como j foi dito, o Flash salva os arquivos no disco com a extenso .fla.
Caso queira salvar em outro local, ou com nomes diferentes, basta selecionar no menu
arquivo, a opo Salvar como...
A tecla de atalho para salvar ctrl + s, lembre-se sempre de usar o ctrl + s periodicamente.
A tecla de atalho para salvar como... ctrl + shift + s.
No ser sugerido o nome do arquivo at a hora que seja necessrio. Mas interessante salvar
os exerccios em arquivos separados para uma melhor organizao.

10

Escrevendo as primeiras linhas de cdigo
O painel de Aes contm do lado esquerdo uma srie de atalhos para os comandos e
bibliotecas e do lado direito uma rea em branco de entrada de texto, onde escreveremos
(digitaremos) algum cdigo. Toda vez que precisarmos testar o cdigo, iremos utilizar o atalho
Ctrl+Enter para visualizar o resultado.
O primeiro comando que iremos conhecer o trace. Ele imprime resultados no painel de sada
de acordo com a solicitao do usurio.
Digite no painel de Aes:
trace(Ol! Essa a sua primeira linha de cdigo.);
Agora utilize as teclas de atalho Ctrl+Enter e observe o resultado.

Note que a janela est em branco, mas o resultado do trace est no painel de Sada.
Feche a nova janela que se abriu e clique no painel de Aes. Vamos observar como funciona o
cdigo:
trace(Ol! Essa a sua primeira linha de cdigo.);
Tudo o que estiver entre os parnteses do comando trace ser exibido no painel de
sada;
O que est entre aspas considerado como texto no compilador do Flash;
A cor azul indica que trace uma palavra reservada do ActionScript 3.0. No utilize
palavras reservadas para outras funes que no sejam prprias para elas.
11

A cor verde indica que tudo que est entre aspas texto.
Para uma melhor organizao e compreenso, interessante terminar as linhas de
cdigo com ;. O ActionScript 3.0 aceita linhas sem ; mas coloc-lo no final uma
boa prtica de programao e ir prepar-lo para linguagens futuras.
Vamos exercitar isso mais um pouco. Apague a antiga linha de cdigo e digite estas:
trace(COMEOU A LUTA!);
trace(Os competidores na arena so poderosssimos! A luta ser
emocionante!);
trace(Jogador 1 d um soco.);
trace(100-30);
trace(Jogador 2 d um chute.);
trace(100-40);
trace(Jogador 1 aplica um golpe especial.);
trace(70-50);
trace(Jogador 2 aplica um golpe especial de nvel 2!);
trace(60-60);
trace(Jogador 1 cai derrotado.);
trace(FIM DA LUTA.);
Observe o resultado.

Observe que tudo o que estava escrito entre aspas foi duplicado no painel, mas os nmeros
foram calculados. Essa a diferena bsica entre dados do tipo String e dados do tipo
Number. O interpretador faz os clculos dos nmeros se eles no estiverem entre as aspas.
Experimente digitar:
trace(10+10);
trace(10+10);
Voc perceber que a primeira linha mostrar o resultado e a segunda apenas repetir o que
est entre aspas.
O padro de leitura do cdigo pelo interpretador da esquerda para a direita e de cima para
baixo, assim como lemos os livros e revistas.

12

Fundamentos bsicos da linguagem
A luta passada foi bem emocionante, mas escrever uma luta mais extensa pode se tornar bem
cansativo.
Isso porque utilizamos um estilo Sequencial na linguagem, ou seja, escrevemos os comandos
linha a linha e o interpretador vai lendo uma por uma e executando passo a passo at o fim.
importante entender que este tipo de programao no vivel quando se trata de games,
pois torna o cdigo muito extenso. Uma forma de contornar isso utilizando variveis,
condicionais e funes.

Vamos comear com as variveis
Variveis so espaos alocados na memria separados pelo programa para armazenar
determinados dados. De uma forma mais simplista como se fossem contineres que podem
ser preenchidos com informaes que sero usadas depois.
As variveis no cdigo precisam ser declaradas e recebem um nome. Boas prticas de
programao sugerem algumas regras para a nomeao das variveis.
No utilize nomes de variveis do ActionScript (se o nome ficar azul ento mude o
nome da varivel), elas so palavras-chave de scripts da linguagem;
Procure comear com letras minsculas. Nmeros e caracteres s so aceitos em
conjunto com letras e aps a primeira letra do nome;
No devem comear com nmeros ou caracteres especiais;
Se a varivel tiver um nome composto, no deve ter espao entre as palavras. Uma
boa prtica utilizar um _ ou uma letra maiscula para referenciar as palavras. Ex.:
primeira_variavel ou primeiraVariavel;
No utilize nomes repetidos em variveis globais em um mesmo cdigo;
Utilize nomes curtos (ou abreviados), de fcil reconhecimento e que indiquem o que a
varivel faz.
Experimente digitar isso:
var testando = "testando";
trace(testando);

13

O resultado:

A palavra var serve pra indicar que estamos comeando uma varivel, o nome da varivel
testando e ela tem como valor o texto (String) testando;
Significa que toda vez que utilizarmos a varivel testando ela ir trazer este resultado. Como
ela est entre aspas fcil identificar que a varivel do tipo String (texto), mas por boa
prtica melhor declar-la desta forma:
var testando:String = testando;
Utilize o trace e o resultado ser o mesmo.
Eis uma tabela com os tipos de dados disponveis:
Tipo de Varivel Exemplo Descrio
Number 15.5 Qualquer nmero, incluindo decimais
int -20 Qualquer nmero inteiro
uint 3 Qualquer nmero inteiro sem sinal ou no-negativo
String Ol! Texto ou uma sequncia de caracteres
Boolean true Verdadeiro ou falso
Array [1,2,3] Mais de um valor em uma nica varivel
Object umObjeto Estrutura bsica de toda a estrutura do ActionScript,
utilizada para armazenar vrios valores como um
Array

Vamos a um exemplo prtico. Vamos criar duas variveis para armazenar a quantidade de
energia de um personagem, depois simulamos que ele levou uma pancada e perdeu uma
quantia dessa energia.
var energiaPersonagem:Number = 100;
var pancada:Number = 50;
trace(energiaPersonagem - pancada);
Se o resultado for 50, est correto.

14

As Condicionais
Muitas vezes enfrentaremos situaes em que preciso fazer comparaes. Por exemplo, um
personagem ganhar um item especial aps ganhar um level, ou mesmo dizer que um inimigo
foi derrotado aps sua energia estar abaixo de 0.
Para estes casos existem as condicionais, que so estruturas de cdigo que comparam os
termos e trazem um resultado. como se fizssemos um teste e se a condio no atendida
nenhuma ao realizada.

O if
Essa a forma mais comum de condio. Praticamente todas as linguagens utilizam o if de
alguma forma. If em portugus significa se, e basicamente compara condies verdadeiras e
falsas.
Vamos prtica:
if(energiaPersonagem < pancada){
trace("Personagem Morreu!");
}
O resultado:

Parece confuso agora? Vamos destrinchar um pouco este script.
Essas so as variveis da pancada e da energia do personagem:
Ento pedimos o resultado com esta linha:
E depois fizemos uma comparao: Se a energia do personagem for menor do que a pancada,
ento vai aparecer a frase Personagem Morreu! no painel de sada.
if(energiaPersonagem < pancada){
trace("Personagem Morreu!");
15

}
Iniciamos o comando if, entre parnteses fazemos as comparaes e entre as chaves
colocamos o cdigo a executar caso a comparao d certo.
Experimente trocar o valor da pancada de 110 para 90 e veja o que acontece!
Se no aconteceu nada, est correto. No h condio para caso a energia seja maior do que a
pancada. Neste caso, experimente adicionar ao script a linha abaixo:
if(energiaPersonagem > pancada){
trace("Personagem continua vivo.");
}
Acredito que voc j tenha entendido.

O Switch
O switch (escolha) uma condicional de escolhas. Damos opes para serem escolhidas
dentro do switch. Basicamente como se fosse um if, com uma estrutura mais simples, pois
ele tambm testa condies verdadeiras e falsas.
Vamos a um exemplo prtico:
var soco:String = "Soco";
var chute:String = "Chute";
var especial:String = "Golpe Especial";
var botaoApertado:String = "a";
switch(botaoApertado){
case "a":
trace(soco);
break;
case "b":
trace(chute);
break;
case "c":
trace(especial);
break;
default:
trace("nenhum golpe");
break;
}
Destrinchando o cdigo.
Temos agora 4 variveis, todas do tipo String:
16

O switch inicia levando em considerao a varivel botaoApertado e ir usar este valor para
conferir o que verdadeiro. Case, significa caso em portugus, ento ele ir verificar caso a
caso, at encontrar o valor do botaoApertado (que a). Quando o valor for encontrado, a
prxima linha depois dos : (dois pontos) ser executada, at a hora em que encontrar um
comando break (quebrar). Ento o switch retorna os resultados.

Experimente trocar o valor da varivel botaoApertado por b e veja que o resultado ser
Chute, e assim por diante.
Um pequeno detalhe:
default:
break;
Este trecho indica que, se nenhum dos case (caso) funcionar, o valor default (padro) ser a
frase nenhum golpe. Experimente colocar qualquer valor que no seja a, b ou c na
varivel e veja o resultado.
Isso tambm seria possvel de fazer com o if. Vejamos como o cdigo ficaria:
if(botaoApertado == "a"){
trace(soco);
}else if(botaoApertado == "b"){
trace(chute);
}else if(botaoApertado == "c"){
trace(especial);
}else{
}
O resultado o mesmo.
Voc poderia escolher qualquer um dos dois neste caso, mas se tivssemos 50 verificaes, o
cdigo if j seria de difcil leitura. O if tambm reservado para casos de comparaes mais
difceis, como ifs dentro de ifs (veremos isso mais adiante). Tambm pode ser utilizado um if
dentro de um switch e vice-versa.
A novidade neste cdigo fica por conta do else if (se no, se) e do else (seno).
17

Utilizamos else if em um bloco de cdigo que tem condies para serem checadas que so
dependentes umas das outras.
E este else no final teria o mesmo valor do default no switch, ou seja: estamos dizendo que se
no for nenhuma das opes, utilize esta que est neste ltimo else..

Loops
Antes de qualquer coisa preciso saber que Loops (Ciclos, para este caso) so trechos de
cdigo condicional que sero repetidos at que consigam alcanar um determinado critrio.
Para que fique mais simples, vamos a um exemplo prtico, comeando pelo loop for:
var soco:Number = 10;
for(var i=0; i<3;i++){
trace(soco);
}
O resultado ser este:

Agora vamos entender o que est acontecendo. O primeiro trecho do cdigo bem
conhecido:
var soco:Number = 10;
Declaramos uma varivel, demos o nome a ela de soco e ela ser do tipo Number, contendo o
valor 10.
Agora o loop:
trace(soco);
}
Em um loop for (para), estamos especificando que, para cada vez que o cdigo entre
parnteses for verdadeiro, tudo o que est entre as chaves deve ser executado.
Ns criamos outra varivel com o nome de i dentro dos parnteses. Voc poderia dar qualquer
nome a ela, se desejasse. Por exemplo:
18

for(var batata=0; batata<3;batata++){
trace(soco);
}
O resultado seria o mesmo. uma boa prtica utilizar o i em um loop for para indicar que
vamos incrementar essa varivel. Este um costume bem antigo, que acompanha os
programadores at hoje.
Vamos destrinchar o que est dentro do parntese:
var i=0; Aqui indica que a varivel i comea valendo 0.
i<3; Enquanto a varivel i valer menos que 3...
i++; ... o cdigo ir acrescentar mais 1 ao valor da varivel. Nesse caso, a varivel i, que
antes valia 0, comear a fazer uma contagem e ter o valor aumentado para 1 e quando
chegar no 2 ela ir parar, porque 2 menor que 3.
OPA! Mas os resultados foram 3 nmeros 10! Como isso possvel?
No comeo a varivel valia 0, e isso tambm contado como valor de ndice. Na verdade
como se o lao contasse: 0=1, 1=2, 2=3.
Algo como isso:
ndice 0 1 2
Ordem do ndice 1 2 3

Para ficar mais simples ainda, faa o exerccio desta forma:
trace(soco);
}
E o resultado ser o mesmo. Mas a grande maioria dos programadores preferem utilizar todos
os ndices, ento comeam do 0.
No comeo um pouco confuso, mas logo voc pega a prtica e ver como isso faz sentido
durante a programao.
Para finalizar: na prtica basicamente estamos pedindo ao cdigo para repetir tudo o que
estiver entre as chaves at 3 vezes.
{
trace(soco);
}
A varivel soco vale 10, ento o comando trace ir repetir o valor 10 at 3 vezes. Experimente
trocar o 3 por 4, 20, 30, 50, e veja o que acontece.
Existem mais alguns tipos de variveis, condicionais e loops, mas estes so os mais utilizados.
Outros tipos sero explicados no decorrer dos exerccios.

19

As Funes
Funes (ou mtodos, ou procedimentos) so blocos de cdigo que podem ser reaproveitados
posteriormente. Isso evita que muitos trechos de cdigo sejam repetidos e o ajuda para que o
cdigo no fique muito extenso. No Actionscript 3.0 todas as funes devem comear com a
palavra function e precisam ter um nome, assim como as variveis. Aps o nome elas recebem
() (parnteses), que podem, ou no, conter os parmetros necessrios para a reutilizao de
variveis. Tudo o que precisa ser executado colocado entre {} (chaves). No muito
diferente do que j vimos nas condicionais.
Confuso? Vamos prtica:
function comportamentoInimigo(){
trace("Inimigo sempre persegue o player.");
trace("Inimigo foge quando sua energia est abaixo de ",
30);
trace("Os tiros do inimigo sempre tiram ", 10, " da energia
do oponente.");
}
comportamentoInimigo();
Resultado:

Agora, sempre que precisarmos escrever novamente essas trs linhas no painel de sada, basta
chamar a funo desta forma: comportamentoInimigo();
Experimente acrescentar este trecho logo abaixo do cdigo:
trace("O Player est andando pela tela e encontra um inimigo.");
trace("O Player se desvia dos tiros e mata o inimigo com uma
magia poderosa!");
trace("O Player continua sua caminha e encontra outro
inimigo!");
trace("Novamente o Player lana uma magia poderosa e vence a
batalha!");

O resultado:
20

Acredito que agora esteja clara a funo da Funo (trocadilho infame).

E os tais dos parmetros?
Outra grande vantagem da funo poder modificar algo dentro delas atravs dos
parmetros. Os parmetros nada mais so do que variveis que so colocadas dentro dos
parnteses de uma funo. como se adicionssemos propriedades modificveis s nossas
funes.
Exemplo:
function mudaNome(nome:String){
trace("O nome do personagem ser: ", nome);
}
mudaNome("Marssupilami");
mudaNome("Ryu");
mudaNome("Chapeleiro Louco");
Resultado:

Alm de reutilizarmos a funo mudaNome, ainda modificamos os nomes atravs da varivel
nome, que est dentro da funo e foi acessada como um parmetro.
Regras bsicas de funes com parmetros simples:
A quantidade de parmetros dentro dos parnteses e dentro das chaves deve ser a
mesma sempre;
21

Se a funo pede dois parmetros, quando ela for reutilizada, precisar de dados que
preencham os dois parmetros. Ex. mudaNome(nome:String,
sobrenome:String){...}, e quando for reutilizar: mudaNome(Yori,
Yagami);
Sempre especifique o tipo da varivel que est sendo utilizada entre os parnteses. Ex.
capacete(nomeDoCapacete:String, resistencia:Number){...};
As variveis dentro dos parnteses devem ser separadas com vrgula;
No inicie nomes de funes com nmeros ou caracteres especiais;
Procure colocar nomes curtos, fceis de entender e que lembrem o que ela faz.

Instanciando os primeiros sprites
Em um game 2D, sprites so elementos que se movimentam na tela. Eles podem ser
personagens, montanhas, partes do cenrio, poderes mgicos... Basta se movimentarem (ou
terem animaes) e serem instanciados com algum cdigo. O cdigo dar propriedades a estes
sprites e ir trata-los como um objeto.
Mas o que so Objetos?
ActionScript 3.0 uma linguagem que trabalha massivamente com objetos. Um objeto pode
possuir propriedades (que definem sua, altura, largura, cor...) e tambm pode possuir
mtodos (que definem seu comportamento, o que ele faz).
Na prtica um objeto no cdigo uma instncia de cdigo que possui propriedades como um
objeto real. Por exemplo:
var aeronave:Object = new Object();
aeronave.width = 350;
aeronave.rotation = 30;
aeronave.height = 60;
trace(aeronave.width);
trace(aeronave.rotation);
trace(aeronave.height);
Resultado:

Neste pequeno trecho definimos que nossa aeronave uma varivel do tipo Object. A classe
Object um mtodo pronto dentro do ActionScript 3.0 e, para no termos de modificar o
cdigo original, utilizamos uma nova instncia com o cdigo new Object() . Dessa forma temos
22

acesso parte do cdigo escrito na classe Object, que a classe principal do ActionScript. No
se preocupe com classes agora, veremos isso mais adiante.
Basicamente reutilizamos a classe Object() e adicionamos propriedades em nossa aeronave.
Agora ela possui largura (width), rotao (rotation) e altura (height). Atrelamos essas
propriedades atravs do nome do objeto (no caso, aeronave), o ponto (.) e a propriedade que
definimos. como se dissssemos que agora a propriedade width faz parte de nossa aeronave.
Como utilizar isso em um Sprite?
No decorrer do curso, os alunos receberam um arquivo .fla que continha este projeto:

No nada muito complicado. Na verdade simulei grama, montanhas e cu na camada de
baixo e bloqueei-a para que no atrapalhasse. Na camada de cima ficou apenas a nave.
Os pormenores de edio de objetos e camadas no sero apresentados aqui. Sugiro que
busque tutoriais e apostilas de exemplo na internet. O prprio Flash tem alguns modelos de
exemplo e um manual bem explicado.
23

Certifique-se que neste exerccio nosso cdigo seja inserido no quadro 1 da camada da nave
(veja figura). Assim que for inserido algum cdigo, a letra a minscula aparecer no quadro,
indicando que ali h um cdigo ActionScript.
A nave que temos na tela ser nosso Sprite, que pode ser uma imagem importada de sua
preferncia, ou at mesmo uma bolinha criada com as ferramentas do Flash se voc assim
preferir. Todos os desenhos iro passar pelo mesmo processo.
Selecionamos a nave, e iremos iniciar o processo de transform-la em um Movie Clip (Clipe de
Filme) apertando a tecla F8 (ou clicando no menu Modificar -> Converter em smbolo...).

Para o exerccio, iremos colocar o nome de nave e o ponto de registro no meio. O nome no
importa neste momento, voc pode nomear a nave com o nome que quiser. Aps isso s
apertar OK.
24

Desta forma, agora temos a nave em nossa biblioteca. Acesse o painel de Propriedade e na
caixa <Nome da Ocorrncia>, digite o nome que dar acesso a essa nave no cdigo. No caso,
colocaremos nave tambm. Este nome voc usar durante o cdigo, portanto guarde-o bem.

No necessrio que a ocorrncia tenha o mesmo nome da nave, mas necessrio que este
nome siga as mesmas regras dos nomes das variveis, pois por este nome que iremos
identificar a nave no cdigo.
Lembre-se: para este exerccio o cdigo deve ser digitado no quadro 1 da camada da nave.
Certifique-se que este o quadro que est selecionado no painel Linha do tempo, e abra o
painel Aes.
Vamos brincar um pouco com as propriedades da nossa nave.
nave.x =100;
nave.y = 100;
25

Resultado:

Como agora o cdigo reconhece que a nave faz parte do cdigo, pudemos acrescentar
propriedades a ela. Neste caso, setamos a posio em que ela apareceria na tela. Veja que a
posio inicial diferente, mesmo assim, o interpretador publicou a posio que estava no
cdigo, ento nossa nave foi movida no eixo x e y.
Mas, se estamos falando de x e y, como um grfico cartesiano! A nave no deveria estar l
embaixo?
Na verdade, quando se trata de programao, o eixo y invertido. Vejamos a comparao:
26

Outra considerao importante, que o centro do eixo comea no lado superior esquerdo da
tela (salvo, se alguma coisa na programao mudar isso). O que seria algo neste estilo:

Por causa disso, a nave ficou perto do canto superior esquerdo. Experimente trocar os valores
de x e y e veja o que acontece.
27

Abaixo uma tabela de propriedades bsicas de um Movie Clip. Teste-as uma a uma e veja as
modificaes. Depois troque os nmeros e faa mais alguns testes para dominar essas
propriedades.
Descrio Propriedade Sintaxe Tipo de Unidade
Posio x, y (minsculos) nave.x = 100;
nave.y = 100;
pixels
Escala scaleX, scaleY nave.scaleX = 0.5;
nave.scaleY = 0.8;
porcentagem
Tamanho width, height nave.width = 50;
nave.height = 50;
pixels
Rotao rotation nave.rotation = 90; graus (de 0 a 360)
Transparncia alpha nave.alpha = 0.3; porcentagem (de 0 a 1)
Visibilidade visible nave.visible = false; booleana (true ou false)

Qual a diferena entre visible = false e alpha = 0?
Basicamente, setando visible o objeto guardado na memria, mas no pode mais ser clicado
ou receber uma coliso com outro objeto. como se exclussemos o objeto, mas mesmo assim
ele ainda est l ocupando espao no processamento e pode ser tornado visible = true a
qualquer momento. A propriedade alpha = 0 torna o objeto invisvel visualmente, mas ele
continua ocupando a mesma posio, e pode receber testes de coliso.

Comentando linhas
J foi dito que o programa entende o cdigo nesta ordem: da esquerda para a direita e de cima
para baixo. Ele tambm ignora os espaos em branco. Este um dos motivos do por que
aplicar a prtica de terminar as linhas com ponto-e-vrgula (;), assim indicamos que aquela
linha terminou.
Na prtica, o programa l e compila todo o cdigo como um bloco s, e considera fins e
comeos de blocos e linhas de cdigo por causa dos pontos-e-vrgulas, parnteses, colchetes e
parte da lgica do cdigo. E as linhas brancas, ele ignora. interessante separar os blocos de
cdigo que fazem a mesma funo para no nos confundirmos visualmente.
Muitas vezes necessrio comentarmos o cdigo, principalmente aqueles complicados e
cheios de frmulas. Uma boa prtica comentar no comeo de cada bloco de cdigo, mas isso
vai a critrio de cada um. As linhas comentadas, tambm so consideradas como linhas
vazias, e so ignoradas pelo programa.
Para comentar uma linha, utilize duas barras no incio da linha. Ex.:
//setando as propriedades da nave isso um comentrio
nave.x =100;
nave.y = 100;

Para comentar parte de uma linha, utilize as duas barras, mas lembre-se de que o comentrio
s ser considerado at a hora em que voc pular uma linha E aps o ponto e vrgula. Ex.:
28

//setando as propriedades da nave
nave.x =100;//propriedade no eixo x
nave.y = 100;//propriedade no eixo y
Esta tambm uma prtica bem comum.
Acredito que ficou claro: tudo o que estiver aps as duas barras naquela linha ser ignorado
pelo interpretador.
Algumas vezes se faz necessrio comentar blocos de texto inteiros, e neste caso no vivel
fazer o comentrio linha-a-linha, mais prtico utilizar o mtodo desta forma: /* bloco de texto
a ser ignorado pelo programa.*/
Tudo o que estiver entre /* e */ ser ignorado.
Sendo assim, comente todas as linhas de cdigo que fez at agora no arquivo nave.

Eventos
Eis aqui um recurso de extrema facilidade e importncia no Actionscript 3.0: Os Eventos.
Eles so responsveis pelas configuraes dos scripts e definem parmetros, fazendo com que
eles sejam executados. Eventos de teclado (KeyboardEvent), podem adicionar propriedades s
teclas do teclado, eventos de mouse (MouseEvent), podem acionar botes na tela, caixa de
textos e at mesmo chamar funes personalizadas.
Existem inmeros eventos, alguns deles so disparados quando se assiste a um vdeo, se
trabalha com textos, se aciona um boto no teclado, quando uma animao precisa acontecer,
ou at mesmo quando uma pgina aberta.
E eles ficam melhor ainda quando utilizados em conjunto com os Listeners.

Ouvintes de evento
Os ouvintes de evento (Listeners) so um poderoso recurso do Actionscript 3.0, que permite
ao programador atrelar eventos diretamente a objetos instanciados no cdigo.
Vamos utilizar a nossa nave como exemplo.
nave.addEventListener(MouseEvent.MOUSE_UP, naveRodaParaDireita);
function naveRodaParaDireita(event:MouseEvent):void{
nave.rotation += 30;
}
Feito isso, clique na nave vrias vezes. Clique fora da nave, e veja o que acontece.
Com este script, toda vez que clicamos na nave, ela rotaciona 30 para o lado direito, mas nada
acontece se clicarmos nas montanhas, por exemplo.
29

Vamos destrinchar um pouco mais o cdigo:
nave.addEventListener(MouseEvent.MOUSE_UP, naveRodaParaDireita);
nesta linha, atravs do comando addEventListener, estamos definindo que a funo s ir
acontecer se o evento estiver relacionado nave. Entre os parnteses, definimos que o evento
acionado pelo mouse atravs do comando MouseEvent e que algo acontecer quando a tecla
do mouse for solta (MOUSE_UP). Depois dizemos qual funo poder ser acionada quando isso
acontecer, no caso, naveRodandoParaDireita.
No comeo parece um pouco complicado, mas com a prtica voc ver que muito simples:
basta lembrar a ordem em que as coisas precisam ser descritas e tudo ocorrer bem.
function naveRodaParaDireita(event:MouseEvent):void{ aqui criamos
uma funo chamada naveRodandoParaDireita e, entre parnteses, definimos que a varivel
event ter o valor de um MouseEvent (Evento de mouse). Qual o tipo de evento (MOUSE_UP,
MOUSE_DOWN, CLICK...) j foi definido quando criamos o listener. E definimos que a funo
ser do tipo void, que significa que ir retornar um valor vazio, pois no precisamos disso
definido para acess-la.
nave.rotation += 30; Definimos que a propriedade rotation da nave recebe +30
de valor cada vez que a funo chamada, ou seja, a cada vez que o boto do mouse solto..
} a funo termina aqui.
Na prtica, criamos uma funo dentro do objeto nave, que acionada toda vez que clicamos
em cima dela e soltamos o boto do mouse. Como um evento MOUSE_UP, nada acontece se
voc deixar o mouse pressionado em cima da nave. Experimente.
30

Encontrando as teclas do teclado no cdigo.
Muitos dos jogos utilizam o teclado para movimentar os Sprites na tela. Cada tecla possui um
nmero no cdigo. Para encontrar este nmero iremos criar um script que retorna o nmero
da tecla na caixa de Sada toda vez que ela pressionada.
Apague todo o cdigo anterior (ou salve em outro arquivo e depois apague) e digite este:
stage.addEventListener(KeyboardEvent.KEY_DOWN, achaTecla);
function achaTecla(event:KeyboardEvent):void{
trace("O cdigo da tecla : ", event.keyCode);
}
Num primeiro momento nada acontece. Mas ao apertar algumas teclas poderemos ver seu
cdigo no painel de sada.

Localize os cdigos das teclas que vai utilizar e anote. Geralmente utilizamos as teclas:
esquerda, baixo, cima, direita, w, a, s, d, z, x e barra de espao, cada conjunto para um tipo de
jogo. Voc definir isso em seus projetos.
Algumas vezes o flash pode precisar importar algumas bibliotecas para o cdigo. Algo como
isto:
import flash.events.KeyboardEvent;
import flash.events.Event;
No se preocupe em apagar estas linhas, neste caso no h diferena se elas so importadas
ou no, elas sero explicadas no futuro.

37
38
39
40
31

Mova-se nave!
Para este exerccio, iremos apagar todo o cdigo e salvar o arquivo como
NaveSeMovendoPeloTeclado.fla.
A primeira coisa que devemos pensar em como acontecero os eventos. O que sabemos
que, ao apertar as teclas, a nave se mover na direo que queremos, mas para chegar a isso
precisaremos de 3 eventos:
KeyboardEvent.KEY_DOWN;
KeyboardEvent.KEY_UP;
Event.KEY_FRAME.
Os dois primeiros eventos so de fcil entendimento: O primeiro se refere quando
apertarmos a tecla e o segundo ao que acontece quando soltarmos a tecla.
O ltimo evento se refere ao que acontece a cada atualizao de tela.
Para entender isso melhor, pense nos desenhos animados, que nada mais so do que imagens
paradas sendo atualizadas a uma quantidade X por segundo.
Como possvel ver no painel de Propriedades, o Flash CS 5 Professional tem uma taxa de
24FPS (frames per second quadros por segundo), o que significa que 24 imagens so trocadas
a cada segundo no Flash. Essa taxa pode ser mudada, claro, mas como estamos
desenvolvendo para web, melhor trabalhar com esta configurao.

32

Iremos precisar tambm de algumas variveis. Para no confundir muito, no comeo iremos
utilizar apenas duas, depois ajustamos as configuraes necessrias.
Digite o cdigo:
var movimento:Number = 5;
var checarTecla:Boolean = false;

stage.addEventListener(KeyboardEvent.KEY_DOWN, teclaPress);
function teclaPress(event:KeyboardEvent):void{
if(event.keyCode == 37){
checarTecla = true;
}
}

stage.addEventListener(KeyboardEvent.KEY_UP, teclaSolta);
function teclaSolta(event:KeyboardEvent):void{
checarTecla = false;
}
}

stage.addEventListener(Event.ENTER_FRAME, movNave);
function movNave(event:Event):void{
if(checarTecla == true){
nave.x += -movimento;
}
}
Agora que voc j tem as bases de como funcionam as funes e os listeners, no to difcil
entender, no mesmo?
A varivel movimento tem o valor 5 e garante que a nave se mova 5 pixels.
A varivel checarTecla tem valor false, porque ele checa quando o jogador ir apertar a tecla
necessria para a nave se movimentar. Como no incio do jogo no h movimento, ela inicia
com o valor false (falso).
Depois temos 3 listeners e 3 funes. Note que, dessa vez, os eventos esto atrelados ao stage
(palco do flash), e no so dependentes da nave, embora influenciem o movimento dela.
O primeiro bloco checa se a tecla est apertada, atravs do keyCode (cdigo da tecla). Se
estiver, o valor de checarTecla true.
Note aqui que, quando utilizamos == (igual duas vezes), significa que estamos checando
alguma condio, ou seja, estamos comparando os valores. Para que o checarTecla seja true,
precisamos verificar se a tecla apertada a 37.
Quando utilizamos apenas = (um sinal de igual), significa que estamos atribuindo um novo
valor varivel. A partir de agora a varivel passa a ter o valor true, e no mais false.

33

checarTecla = true;
}
}
A mesma lgica se aplica ao bloco dois, s que invertemos o valor de checarTecla para false
novamente. Se isso no for feito, a nave ir se movimentar indefinidamente na tela, pois o
cdigo no sabe que soltamos a tecla.
Alis, experimente comentar este bloco de cdigo desta forma e veja o resultado.
/*stage.addEventListener(KeyboardEvent.KEY_DOWN, teclaPress);
checarTecla = true;
}
}*/
No se esquea de descomentar.
Agora vamos ao ultimo bloco:
if(checarTecla == true){
}
}
Os dois primeiros blocos eram eventos estticos, que dependiam da interao do jogador. Este
ltimo precisa ser atualizado sozinho, por isso utilizamos o Event.ENTER_FRAME.
A funo movNave simplesmente garante que, quando o valor da tecla apertada for true, a
nave ir se movimentar no eixo definido. No caso, eixo x para a esquerda. Isso acontece
porque colocamos o valor da varivel como negativo (nave.x += -movimento;) mesmo ela
iniciando com valor positivo. E este valor checado a cada frame e atualizado a cada apertar
de tecla.
Na prtica, cada vez que a tecla esquerda do teclado (37) receber o valor true, subtrado 5 da
posio x da nave e ela se movimenta para a esquerda.
Seguindo esta lgica, precisaremos de uma varivel booleana para cada tecla que apertamos.
Neste caso iremos mudar ligeiramente o cdigo. Compare:

var checarTeclaEsq:Boolean = false;

checarTeclaEsq = true;
34

}
}

checarTeclaEsq = false;
}
}

if(checarTeclaEsq == true){
}
}
Agora nossa varivel pertence tecla esquerda, e no a qualquer outra. Precisamos ento
criar variveis para as outras teclas e fazer com que elas funcionem. Com os ajustes, o cdigo
completo ficar dessa forma:

var checarTeclaCima:Boolean = false;
var checarTeclaDir:Boolean = false;
var checarTeclaBaixo:Boolean = false;

}else if(event.keyCode == 38){
checarTeclaCima = true;
checarTeclaDir = true;
checarTeclaBaixo = true;
}
}

checarTeclaCima = false;
checarTeclaDir = false;
checarTeclaBaixo = false;
}
}
35

}else if(checarTeclaCima == true){
nave.y += -movimento;
}else if(checarTeclaDir == true){
nave.x += movimento;
}else if(checarTeclaBaixo == true){
nave.y += movimento;
}
}
O movimento da nave est pronto, agora precisamos faz-la atirar. Mas antes precisamos
entender mais algumas coisas...

Adicionando MovieClips dinamicamente na tela
Pensemos dessa forma:
Teremos de ter um objeto que ser o tiro da nave, que no caso iremos nomear laser.
Para isso criamos uma bolinha simples no Flash, transformamos em Movie Clip (clipe de filme),
da mesma forma que fizemos com nossa nave e damos o nome laser.
O nico empecilho que a bolinha continua no palco o tempo todo, e precisaremos de mais
destes laseres para atirar. Ou seja, precisamos que eles sejam enviados diretamente da
biblioteca para o palco, e depois de utilizados eles retornem para a biblioteca.
Para isso utilizaremos o mtodo addChild(), que adiciona elementos no palco (ou dentro de
outros objetos) de acordo com nossas especificaes.
Aps termos criado a bolinha e feito o processo para que ela seja um Movie Clip, podemos
delet-la, pois agora ela um objeto no painel Biblioteca.
36

Para adicion-la no palco dinamicamente, precisamos que ela se torne parte do cdigo. Ela
ser ento lincada a uma classe para poder ser reutilizada.
Para isso clique com o boto direito no objeto da biblioteca e escolha a opo Propriedades.
37

Feito isso, teremos novamente a tela onde podemos escolher o tipo de objeto. O que
precisamos na verdade, clicar na opo Avanado, e selecionar a opo Exportar para
ActionScript.
38

Note que ele indica que o nome da classe ser laserClasse. este nome que iremos utilizar
para instanciarmos o tiro no cdigo. Aps isso clique em OK. Aparecer a seguinte mensagem:

Isso significa que o Flash ir considerar laser como uma classe a partir de agora. Clique em OK.
Para que entenda melhor, no painel de Aes, abaixo de todo o cdigo j escrito, adicione este
cdigo:
39

var laserNave:MovieClip = new laserClasse();
laserNave.x = 100;
laserNave.y = 100;
addChild(laserNave);
Resultado: nosso laser est no palco novamente!

Destrinchando o cdigo:
var laserNave:MovieClip = new laserClasse (); Aqui definimos que o
valor da varivel laserNave um MovieClip (que uma classe do ActionScript que lida com os
objetos deste tipo) e dizemos que queremos uma nova instncia da classe laser com o
parmetro new.
laserNave.x = 100; Posio x em que o laser ir aparecer.
laserNave.y = 100; Posio y em que o laser ir aparecer.
addChild(laserNave); Adicionando o laser no palco.
Note que adicionamos o laser no palco depois de setarmos as posies.
Algo a se considerar que o nome da varivel nunca pode ser o nome da classe. possvel
reutilizar a classe laser vrias vezes com nomes e atributos diferentes.
Vejamos um exemplo:
var laserNave:MovieClip = new laserClasse ();
40

laserNave.x = 100;
laserNave.y = 100;
addChild(laserNave);

var laserNave02:MovieClip = new laserClasse ();
laserNave02.x = 150;
laserNave02.y = 150;
laserNave02.width = 30;
laserNave02.height = 30;
addChild(laserNave02);

var laserNave03:MovieClip = new laserClasse ();
laserNave03.x = 200;
laserNave03.y = 200;
laserNave03.alpha = 0.5;
addChild(laserNave03);
Resultado:

Agora, apague ou comente essas linhas de cdigo. Iremos colocar a nave dinamicamente no
cdigo tambm.
O processo o mesmo, procurar o objeto nave na biblioteca, export-lo para ActionScript e
adicion-lo com o mtodo addChild na tela.
41

J temos um bom pedao de cdigo com o nome nave sendo instanciado. Para maior
comodismo iremos colocar o nome da classe da nave como naveClasse, assim no preciso
reescrever o cdigo.

Eis o cdigo para adicion-la:
var nave:MovieClip = new naveClasse();
nave.x = stage.stageWidth / 2;
nave.y = stage.stageHeight - 100;
addChild(nave);
Resultado:
42

var nave:MovieClip = new naveClasse(); Adicionamos a nova nave
nave.x = stage.stageWidth / 2; Definimos que a posio x da nave ser
metade da tela com a propriedade stageWidth (largura da tela), desta forma se
posteriormente precisarmos aumentar ou diminuir a largura da tela, o cdigo se encarregar
de deixa-la no meio dinamicamente.
nave.y = stage.stageHeight - 100; Definimos que a posio y da nave ser
sempre a stageHeitght (altura da tela) subtrada de 100. Isso faz com que a nave sempre inicie
com uma distncia de 100 pixels da borda inferior da tela, no importando o tamanho da
mesma.
addChild(nave); Adicionamos a nave no palco.

Organizando as coisas
Iremos dar uma reorganizada no cdigo. uma boa prtica colocar as variveis globais (que
podem ser usadas em todo o cdigo) em um mesmo bloco, os listeners em outro e no final as
funes. Seguindo isso, o cdigo ficaria assim:
//variveis globais
43

var checarTeclaCima:Boolean = false;
var checarTeclaDir:Boolean = false;
var checarTeclaBaixo:Boolean = false;
var nave:MovieClip = new naveClasse();

//adicionando elementos
nave.x = stage.stageWidth / 2;
nave.y = stage.stageHeight - 100;
addChild(nave);

//ouvintes de eventos

//funo de tecla pressionada
}
}

//funo de tecla solta
}
}

//funo de movimento da nave
}
}
44

A partir de agora, todas as varveis globais novas devero ser colocadas no grupo das
variveis, todos os listeners globais no grupo de ouvintes e assim por diante. Isso ajuda a
visualizar melhor o cdigo.

Criando e trabalhando com classes
Uma das grandes vantagens da Programao Orientada a Objetos so as Classes. Imagine que
o laser precise ser repetido muitas vezes no cdigo, ento teramos de fazer uma funo para
isso. Mas, e se quisssemos usar a mesma funo em outro jogo?
Podemos colocar tudo dentro de classes, e depois reutilizar o cdigo apenas instanciando-as
em outro trecho, assim como fizemos com o laser e a nave. Para isso devemos salvar nosso
cdigo em um documento .as no Flash.
Ns trabalhamos com classes bsicas do ActionScript at agora. Mas precisamos aprender a
criar nossas prprias classes.
Como exemplo, vamos criar uma classe para os laseres, assim podemos aproveitar este cdigo
para outros jogos.
Para comear, clique no menu Arquivo > Novo... Desta vez iremos escolher a opo Classe do
ActionScript 3.0.

Ento o Flash ir perguntar o nome da classe. Iremos colocar o nome de laserClasse, assim
como colocamos na biblioteca.
45

Assim teremos algo como isto:

Temos mais de um documento aberto ao mesmo tempo. A nova aba demonstra isso. Quando
um dos documentos no estiver salvo um asterisco indicar isso.

Salve o arquivo com o nome laserClasse. O arquivo deve ser salvo na mesma pasta onde est o
projeto do jogo.

46

Estrutura do documento da classe
Agora que criamos nossa classe, devemos aprender um pouco sobre sua estrutura bsica.
Vejamos o cdigo:
package {

public class laserClasse {

public function laserClasse() {
// constructor code
}

}

}
Todas as classes no ActionScript comeam com a palavra reservada package (pacote). Isso
indica os pacotes de cdigo que sero instanciados.
O nome do arquivo precisa ser o mesmo da classe, e toda classe possui uma funo
construtora de mesmo nome.
Uma classe tambm pode se estender de outra classe, herdando suas propriedades. Com isso
possvel reaproveitar muitos trechos de cdigo, inclusive os complicados clculos
matemticos que j esto prontos dentro do ActionScript.
Faa essas alteraes no cdigo:
package
{
//importando bibliotecas necessrias
import flash.display.Sprite;

public class laserClasse extends Sprite
{

//variveis globais da classe
var larguraTela:Number;
var alturaTela:Number;
const direcao:int = 10;
const foraDaTela:int = -10;

//funo construtora da classe
public function laserClasse():void
{
// constructor code
addEventListener(Event.ADDED_TO_STAGE, quandoAdicionado);
}

//funo que verifica quando objeto est adicionado na tela
private function quandoAdicionado(event:Event):void
{
47

larguraTela = stage.stageWidth;
alturaTela = stage.stageHeight;
addEventListener(Event.ENTER_FRAME, recarregar);
}

//funo que recarrega o tiro
private function recarregar(event:Event):void
{
if (y < foraDaTela)
{
removeEventListener(Event.ENTER_FRAME, recarregar);
parent.removeChild(this);
}
y += - direcao;

}

}

}

Provavelmente, ainda no haver alteraes na hora de testar o projeto. Acalme-se.
package iniciando o pacote.
{
//importando bibliotecas necessrias
import flash.events.Event; biblioteca de eventos.
import flash.display.Sprite; biblioteca responsvel pela classe Sprite.

public class laserClasse extends Sprite indicamos que a classe
laserClasse (ela mesma) est estendendo (reutilizando) propriedades que j existem na classe
Sprite. OBRIGATRIO que tenha o mesmo nome da classe.
{

//variveis globais da classe
var larguraTela:Number; no indicamos o valor da varivel, pois
isso ser indicado posteriormente. Ento automaticamente a varivel recebe um valor vazio.
var alturaTela:Number; idem ao anterior.
const direcao:int = 10; uma const (constante) um valor que
no varia. Se j temos certeza de que este valor nunca ir variar durante o cdigo, o indicamos
como constante. Isso garante menos processamento na hora de rodar o jogo.
48

const foraDaTela:int = -10; Lembre-se, nmeros inteiros (int)
no possuem ponto flutuante (ex.: 4.5, 10.3, 4,5, 10,3). Isso consome menos processamento,
embora limite um pouco os clculos do cdigo. Utilize nmeros inteiros se tem certeza de que
no precisar de nmeros flutuantes.

//funo construtora da classe
public function laserClasse():void funo principal da
classe. OBRIGATRIO que tenha o mesmo nome da classe.
{
// constructor code
aqui temos um novo ouvinte (ADDED_TO_STAGE), que cuida de um evento relacionado
quando algo estiver adicionado no palco. No caso, a funo quandoAdicionado ir servir para
adicionarmos os laseres.
} fim da funo laserClasse().

//funo que verifica quando objeto est adicionado na tela
private function quandoAdicionado(event:Event):void
{
larguraTela = stage.stageWidth; O valor que
larguraTela receber ser o valor de stage.stageWidth. Significa que isso ser dinmico ao
tamanho da tela. Este tipo de recurso consome um pouco mais de processamento, mas como
a idia aqui poder reutiliza-lo, este cdigo ir se habituar a qualquer tamanho de tela.
alturaTela = stage.stageHeight; idem ao anterior
adicionado o ouvinte da funo recarregar.
} fim da funo quandoAdicionado().

//funo que recarrega o tiro
{
if (y < foraDaTela) se a posio y desta classe for menor
do que o valor da varivel foraDaTela...
{
49

remove o ouvinte do evento desta funo. Isso funciona como um coletor de lixo, pois, j
que o laser estar fora da tela, no ser preciso que ele fique ocupando espao na memria.
Assim no h acmulo de tiros no topo da tela e isso evita que o processamento fique lento.
parent.removeChild(this); Aqui temos trs
novidades:
parent - iremos usar um container para os laseres, como se fosse o canho que os
dispara. O parent serve para indicar que h uma hierarquia antes da classe. No caso
definiremos isso mais adiante.
removeChild obviamente, para remover a classe do palco, economizando assim,
memria e processamento.
this toda vez que utilizamos this (este/isto), se refere ao prprio objeto, no caso a
classe laserClasse. Para que a classe possa ser reutilizada posteriormente, no
podemos ficar presos nomes de variveis que existam no jogo, ento parmetros
como o this auxiliam neste sentido. como dizer: Estou me referindo a ESTE cara,
mesmo sem saber quem ele .
}
y += - direcao; a posio y do objeto ser sempre
acrescentada no sentido da direo.

} fim da funo recarregar().

} fim da classe pblica laserClasse.

} fim do pacote de cdigos.

Dica: caso voc esteja digitando e os espaamentos fiquem um pouco bagunados, assim que
voc terminar o cdigo, o boto Formato Automtico pode ajeitar as coisas pra voc. Mas
lembre-se: ele s poder ajustar o cdigo se este estiver fechado devidamente com todas as
regras.
50

Agora, precisamos instanciar essa nova classe no cdigo da Linha do tempo.
Retorne para o documento anterior (neste caso, o naveAtirando). Iremos adicionar mais
algumas linhas ao nosso script que est no quadro 1.
Precisaremos de mais duas variveis globais. Ento no grupo que separamos para variveis
globais acrescente:
var checarTeclaBarra:Boolean = false;
var atirar:Sprite = new Sprite();
addChild(atirar);
Primeiramente, criamos uma varivel booleana que ir checar o estado da tecla
(checarTeclaBarra). A segunda varivel (atirar) ser o continer que utilizaremos para os
laseres no palco. Na prtica criamos este objeto que ir servir para guardar os laseres dentro
e ir atirando-os conforme apertamos a barra de espao.
A linha addChild(atirar); adiciona o continer no palco. Mesmo que no possamos v-lo, ele
estar l.
Mas porque criamos esta varivel?
Simplesmente porque, a partir da hora quem que apertarmos a barra, o objeto que ser o
laser, no ir mais obedecer esta funo. E precisamos checar um anova posio de onde
saiam outros laseres, no mesmo? Acontece que esta posio tambm varia de lugar, j que
a nave no ir ficar parada. Ento preciso ter este canho que guarda o lugar para os
laseres, e que ir acompanhar atualizar a posio dos tiros.
Agora, precisamos adicionar as checagens da barra de espao. Imagino que voc j tenha
adivinhado que teremos de revisitar as funes teclaPress e teclaSolta. No final, o cdigo
deve se parecer com isto:
//funo de tecla pressionada
51

checarTeclaBarra = true;
}
}

//funo de tecla solta
checarTeclaBarra = false;
}

}

Colocamos 32 como valor, pois este o cdigo da tecla. A prxima funo a ser revistada ser
a funo movNave. Poderamos criar uma funo somente para o que vamos fazer agora, mas
iremos reaproveitar a funo movNave, que j um evento ENTER_FRAME.

Faa as seguintes alteraes.

} if(checarTeclaBarra == true){
var laser:Sprite = new laserClasse();
laser.x = nave.x;
laser.y = nave.y;
atirar.addChild(laser);
}
}
Agora nossa nave est atirando...
52

... mas se pressionarmos (sem soltar) a barra de espao, ela continuar atirando
ininterruptamente!

Precisamos resolver isto.

Eventos de tempo
Nossa nave continua dando tiros ininterruptos porque no h um limite de tempo entre cada
um dos tiros. possvel ajustar isso usando eventos do tipo TimerEvent.
Este tipo de evento deve ser usado com cautela, pois consome certa parte do processamento,
portanto utilize-o com cautela.
Para incio, no grupo de variveis, precisamos adicionar mais algumas linhas:
53

var tempoDoTiro:Timer = new Timer(300, 1);
var podeAtirar:Boolean = true;
Basicamente, a varivel tempoDoTiro ser do tipo Timer (algo como temporizador), e ir trazer
uma nova instncia do mtodo Timer (assim como fizemos com o mtodo Sprite).
Este mtodo pede dois parmetros de configurao.
O primeiro (onde colocamos 300), o tempo de delay (retardamento, por assim dizer) em
milissegundos entre um tiro e outro. Ou seja, 0.3 segundos (cada 1000 milissegundos
equivalem a 1 segundo). Se quiser mais espao entre os tiros, experimente mexer neste
parmetro.
O segundo indica a quantidade de vezes que o tiro ir se repetir durante este espao de
tempo. um parmetro bem interessante. Ajuste- o ao seu gosto.
A seguir, temos uma varivel booleana chamada podeAtirar que contm o valor true. Como o
prprio nome diz essa varivel ir controlar quando o laser poder (ou no) ser disparado.
Na rea onde separamos os listeners, iremos adicionar um listener dentro da varivel
tempoDoTiro, que ter como objetivo chamar a funo controlaTempo.
tempoDoTiro.addEventListener(TimerEvent.TIMER, controlaTempo);
Veja que, controlaTempo um TimerEvent.
Agora iremos revisitar a funo movNave, para acrescentar algumas novas mudanas:
} if(checarTeclaBarra == true && podeAtirar == true){
laser.x = nave.x;
laser.y = nave.y;
podeAtirar = false;
tempoDoTiro.start();
}
}
E abaixo, finalmente iremos acrescentar a funo controlaTempo.
//funo que controla o tempo do tiro
function controlaTempo(event:TimerEvent):void{
podeAtirar = true;
}

54

Agora a nave atira espaadamente!

Uma das novidades aqui fica por conta de colocarmos duas comparaes ao mesmo tempo no
if:
if(checarTeclaBarra == true && podeAtirar == true){
Significa que estamos comparando se a barra de espao est sendo pressionada E se a varivel
podeAtirar igual a true. Nesse caso, a varivel true, pois j definimos isso na criao da
varivel.
Os smbolos && juntos, significam E. Este um operador de avaliao. Eis uma tabela com os
mais famosos:
&& AND (e) Se esse E aquele...
|| OR (ou) Se esse OU aquele...
! NOT (no) Se NO FOR este...

Logo aps fazer essa checagem, nossa varivel podeAtirar receber o valor false
(podeAtirar = false;) at que a varivel tempoDoTiro verifique quanto tempo se
passou (tempoDoTiro.start();).

Lembre-se: tempoDoTiro est diretamente ligada ao evento que aciona o Timer. O mtodo
start() inicia a contagem do tempo.
55

Depois disso o valor de podeAtirar volta a ser true, e assim poderemos atirar novamente!
Mas, atirar em quem?

Frames de Animao

At agora os objetos (nave, tiro...) que utilizamos no projeto so, de certa forma, estticos.
Movem-se apenas porque demos a eles essa propriedade. Mas um game repleto de Sprites
que possuem animao.

Tambm utilizamos at agora desenhos vetoriais criados com as ferramentas do Flash. Eles
possuem a vantagem de poderem ser escalonados (mudar o tamanho) sem que se perca a
qualidade da imagem. So desenhos pseudo-vetoriais, uma espcie de desenho vetorial
apropriado do Flash, e no perdem qualidade justamente porque so criados por clculos
matemticos.

Mas, muitas vezes, voc ter a necessidade de trabalhar com imagens (.jpg, .png, .bmp), e
dever seguir uma ordem de animao estipulada pelo designer.

Para este projeto, os alunos receberam imagens de uma nave que ser usada como inimiga,
mas nada impede que voc crie suas prprias imagens.

A idia que a nave inimiga siga esta ordem de animao: 01.png, 02.png, 03.png, 04.png,
01.png, 02.png, 05.png, 06.png.

Primeiramente precisamos importar estas imagens para o Flash. Para isso clique no menu
Arquivo Importar Importar para a biblioteca.

56

Ele abrir a janela de importao, direcione para onde esto salvas as imagens, selecione-as (
possvel selecionar vrias imagens em uma mesma pasta) e clique no boto Abrir.

Ento as novas imagens iro ser exportadas para a Biblioteca.

57

Agora preciso criar um MovieClip que servir de continer para essas imagens e far a
animao atravs dos quadros. Para isso basta clicar com o boto direito em uma parte vazia
da biblioteca e escolher a opo Novo smbolo...

A partir daqui, o processo j conhecido. Faremos as seguintes configuraes:

58

Ser criado um palco em branco. No se confunda: este um palco que est localizado dentro
do clipe de filme que acabamos de criar, e no tem relao com o palco anterior, onde se
encontra nossa nave e todo o restante.

59

Clique no painel Linha do tempo, veja que estaremos trabalhando no quadro 1. Arraste a
imagem 01.png para a cruz no centro do palco.

Note que, aps arrastar a imagem, o quadro 1 que antes continha uma bolinha branca, agora
possui uma bolinha preta, indicando que ali naquele quadro existe algum contedo.
Agora, vamos criar um novo quadro. Clique com o boto direito no quadro em branco que est
na frente do quadro 1 e selecione a opo Inserir quadro-chave em branco.
Linha do tempo
Quadro 1
Arraste a imagem para c.
60

Um novo quadro com bolinha branca est esperando que voc arraste a imagem 02.png para o
centro do palco!

61

Repita o processo na ordem sugerida anteriormente (caso seja a mesma nave) at ter colocado
todos os quadros de imagens da animao. Aps isso basta apertar a tecla ENTER para ter uma
prvia da animao no palco.

Dica: Voc pode ajustar o tempo da animao de cada quadro. A primeira vez que voc clicar
em um quadro, ir selecion-lo. Basta clicar novamente neste quadro e arrast-lo para o lado
para mov-lo. Pense nos espaos da Linha de tempo como nos espaos de tempo em que o
quadro da animao ficar exposto. Lembre-se, a taxa de atualizao do Flash est configurada
a 24fps, logo, a cada 24 destes quadros se passar 1 segundo de animao.

Organizando em pastas

Existe um recurso de organizao bem interessante no ActionScript 3.0, que o fato de
podermos organizar arquivos em pastas dentro da pasta do projeto e depois referenci-la em
uma classe. Em um projeto pequeno como este no faz muita diferena, mas digamos que
voc esteja trabalhando em um projeto grande, quando tiver criado umas 50 classes isso far
sentido.

Dentro da pasta do projeto, iremos criar uma pasta chamada: inimigos, onde deveremos salvar
todas as classes referentes aos inimigos.

Precisamos referenciar essa pasta nas propriedades da classe inimigoClasse, para isso devemos
editar essas propriedades com o caminho correto.

62

como uma hierarquia de pastas do Windows, onde inimigos.inimigoClasse indica que a
classe que criaremos se encontra em uma pasta chamada inimigos dentro da pasta do nosso
projeto.

Lembre-se: o ActionScript 3.0 case sensitive, caso tenha criado o nome de sua pasta como
Inimigos, ento a referncia correta : Inimigos.inimigoClasse.

Adicionando inimigos no palco

Temos aqui um problema: Temos uma nave inimiga que devemos destruir, porm um jogo
com um inimigo s seria no mnimo entediante, no acha?

63

Criar vrias imagens para inimigos na tela e adicion-las uma a uma com addChild() no parece
ser uma opo muito vivel, j que isso pesaria bastante no cdigo e precisaramos de muito
mais tempo para criar todos esses inimigos diferentes. Um recurso interessante que muitos
games utilizam o de reaproveitar os inimigos, duplicando-os.

O que precisamos de uma classe que duplique essa quantidade de inimigos na tela de forma
dinmica e randmica, assim cada vez que o jogador executar o game, enfrentar inimigos que
partem de posies diferentes. Neste caso iremos reaproveitar a classe inimigoClasse, que foi
criada quando fizemos a animao da nave.

Este script que iremos adicionar na classe inimigoClasse.

package inimigos {

import flash.display.MovieClip;

public class inimigoClasse extends Sprite {

private var nucleo:Object;
private var vely:Number = 2;

public function inimigoClasse() {
// constructor code
}

private function quandoAdicionado(event:Event):void{
nucleo = MovieClip(root);
}

private function recarregar(event:Event):void{
y += vely;

for(var i = 0; i < nucleo.atirar.numChildren;
i++){
var atingido:Sprite = nucleo.atirar.getChildAt(i);
if(hitTestObject(atingido)){

nucleo.atirar.getChildAt(i).removeListeners();
nucleo.atirar.removeChild(atingido);

nucleo.removeChild(this);
}
}
}

public function removeListeners():void{
removeEventListener(Event.ENTER_FRAME,
recarregar);
64

}
}

}

package inimigos { Desta vez referenciamos no pacote o nome da pasta que
criamos, indicando que este cdigo deve ser procurado nesta pasta quando for utilizado.
import flash.display.MovieClip; importando da biblioteca.
import flash.display.Sprite; importando da biblioteca.
import flash.events.Event; importando da biblioteca.

public class inimigoClasse extends MovieClip { Note que
desta vez estamos extendendo direto da classe MovieClip. Poderamos utilizar a classe Sprite
aqui, mas esta no aceita animaes quadro a quadro. Ns precisamos da nave animada,
certo?
private var nucleo:Object; Criamos uma varivel do tipo
Object, que servir de ncleo-base para remover e adicionar as naves e os tiros.
private var vely:Number = 2; Velocidade que as naves
descero na tela.
public function inimigoClasse() { Incio da funo pblica
inimigoClasse.
// constructor code comentrio
addEventListener(Event.ADDED_TO_STAGE,
quandoAdicionado); Este evento se encarregar de chamar a funo
quandoAdicionado assim que a classe for usada.
} fim da funo inimigoClasse.

Incio da funo quandoAdicionado.
nucleo = MovieClip(root); setamos que o valor da
varivel ncleo um Clipe de Filme (MovieClip) que leva como parmetro a varivel root.
Basicamente, root tem propriedades semelhantes ao mtodo stage, identifica que estamos
nos dirigindo ao quadro principal da linha do tempo. Alguns programadores preferem no
mais utilizar este mtodo, pois caiu em desuso, mas interessante termos ele aqui para fins de
estudo.
Chamamos recarregar aqui.
65

} Fim da funo quandoAdicionado.

private function recarregar(event:Event):void{ Incio
da funo recarregar.
y += vely; Aqui onde a velocidade em y incrementada,
adicionando +1 ao valor da varivel a cada atualizao e fazendo a nave descer.
i++){ Iniciamos um loop For. A novidade aqui que temos numChildren, que se refere ao
nmero de ndice da nave que criada.
Criamos uma varivel que guarda o valor da nave atingida. O getChildAt pega o nmero de
ndice que criado para cada nave e guarda na memria. No caso, guardado o nmero da
varivel i.
if(hitTestObject(atingido)){ If checando se a
nave foi atingida. O mtodo hitTestObject utilizado quando queremos fazer testes de coliso
entre dois ou mais objetos. Neste caso, preciso que a nave seja atingida, ou seja, o tiro ir
colidir com a nave. O conceito simples, mas muitos programadores experientes ainda no
dominam bem o mtodo e criam extensas linhas de cdigo para fazer a mesma coisa.

nucleo.atirar.getChildAt(i).removeListeners(); Agora sim a
funo pblica removeListeners acionada nas duas classes, removendo a nave inimiga e o tiro
do palco.
Aqui remove-se o ndice da nave para uma nova contagem.
A funo remove o evento que a escuta.
nucleo.removeChild(this); Remove o
que estiver dentro de nucleo, no importando o que seja.
} Fim do If.
} Fim do loop For.
} Fim da funo recarregar.

public function removeListeners():void{ Incio da funo
removeListeners, note que esta funo pblica, e acessada na classe dos tiros tambm.
recarregar); Remove-se a escuta da funo recarregar.
66

} Fim da funo removeListeners.
} Fim da classe pblica inimigoClasse.
} Fim do package.
A classe pode ser um pouco difcil de entender a princpio, mas com a prtica em classes deste
tipo as coisas vo ficando mais claras.

Agora precisamos instanciar a classe no cdigo da nossa linha do tempo (quadro 1). Na parte
que separamos para a varivel, colocaremos esta nova varivel:

var tempoDaNave:Timer = new Timer(1500);

bem semelhante varivel Time do tiro, ento dispensa apresentaes. Agora
adicionaremos mais uma linha aos ouvintes:

tempoDaNave.addEventListener(TimerEvent.TIMER, criaInimigo);

E adicionaremos estas linhas ao final do cdigo:

tempoDaNave.start();
function criaInimigo(event:Event){
var novoInimigo:MovieClip = new inimigoClasse();
novoInimigo.x = Math.random() * stage.stageWidth;
addChild(novoInimigo);
}

Vamos ento entender esta ltima funo.
tempoDaNave.start(); Estamos utilizando um mtodo pronto do ActionScript 3.0
que ir iniciar a contagem do tempo.
function criaInimigo(event:Event){ Incio da funo criaInimigo.
var novoInimigo:MovieClip = new inimigoClasse(); Criamos
uma varivel para utilizarmos a classe do inimigo. Note que agora a instanciamos como
MovieClip, pois definimos isso no arquivo da classe.
novoInimigo.x = Math.random() * stage.stageWidth; A posio
x de cada novo inimigo calculada pelo mtodo Math.random, que serve para fazer clculos
matemticos aleatrios complexos. Neste caso o Math.random calcula que as naves devem
ser criadas no espao do stage.stageWidth, ou seja, leva em considerao a largura do palco,
no importando qual ela seja. Fizemos isso para que o cdigo fique dinmico, mas nada
impede que voc coloque um valor fixo. Experimento trocar stage.stageWidth por 100 e veja o
que acontece.
addChild(novoInimigo); Adicionamos o novo inimigo.
} Fim da funo criaInimigo.

67

Resultado:

J temos nossas naves inimigas invadindo a Terra e sendo desintegradas por nossos tiros
pulverizadores! Mas seria interessante um pouco de barulho e algum tipo de exploso, no
acha?

Explodindo os inimigos!
Agora que nossos inimigos esto desaparecendo, iremos precisar de outros elementos para
complementar nossa exploso: uma animao de exploso e barulho.
Como o objetivo aqui no ensinar como criar animaes, voc dever criar a sua. Mas no
muito diferente do que foi feito com a nave inimiga. Basta ter um pouco de imaginao e
entender como funciona o processo e no ser um caminho muito difcil.
O som pode ser baixado de sites que disponibilizam bibliotecas de som gratuitas. Para nosso
exemplo eu usei os sons explosion.mp3 e laser_blast.mp3 do site http://www.freesfx.co.uk/.
Sempre procure efeitos sonoros gratuitos para o seu jogo, ok?
Importe os sons para a biblioteca da mesma forma que foi feito com as naves.
A animao da exploso deve estar com estas propriedades:
68

69

Estas so as propriedades do som de exploso:

70

E estas so as propriedades do som do tiro laser:

Colocamos a sigla sfx na frente do nome da classe apenas por conveno. Assim indicamos que
esta classe se refere a um som de efeito (sound effects - de onde vem a sfx), mas possvel
nome-la de outra forma. Lembre-se sempre de seguir as regras de criao de nomes para
variveis e classes. Se quiser uma melhor organizao, renomeie os sons para
sfx_nome_do_arquivo tambm.
Feito isso, vamos editar a classe explosaoClasse, que est vinculada s propriedades da
exploso.

71

Na verdade, o contedo da classe bem simples:
package {

import flash.media.Sound;

public class explosaoClasse extends MovieClip {

private var explodir:Sound = new sfx_explosao();

public function explosaoClasse() {
// constructor code
addEventListener(Event.ENTER_FRAME,
inimigoMorto);
explodir.play();
}

private function inimigoMorto(event:Event):void{
if (currentFrame == framesLoaded){
inimigoMorto);
parent.removeChild(this);
}
}
}

}

package { Incio do pacote.

import flash.display.MovieClip; importando MovieClip.
import flash.events.Event; importando Event.
import flash.media.Sound; aqui uma biblioteca nova: Sound. Ela ser
necessria apenas para que possamos controlar as propriedades do nosso sfx.
public class explosaoClasse extends MovieClip { Incio da
classe pblica explosaoClasse.
private var explodir:Sound = new sfx_explosao();
essa a varivel que ter o valor do som da exploso. Veja que buscamos aqui o som da
exploso pelo nome da classe e no do arquivo, por isso importante que os objetos estejam
vinculados a uma classe.
public function explosaoClasse() { Incio da funo
explosaoClasse.
72

// constructor code
addEventListener(Event.ENTER_FRAME,
inimigoMorto); adicionamos uma escuta para a classe inimigoMorto.
explodir.play(); E damos play no som da exploso.
} Fim da funo explosaoClasse.
private function inimigoMorto(event:Event):void{
Incio da funo privada inimigoMorto.
if (currentFrame == framesLoaded){ Se o quadro atual
for igual ao ltimo quadro da animao que foi carregado...
inimigoMorto); remove-se a escuta para a funo inimigoMorto...
parent.removeChild(this); e remove-se o
objeto dessa classe da tela, no importando quem seja ele.
} Fim do If.
} Fim da funo inimigoMorto.
} Fim da classe explosaoClasse.
} Fim do pacote.

Utilizamos o mtodo currentFrame quando queremos nos referir ao quadro atual de uma
animao (a traduo literal seria quadro corrente, mas isso feio que di!).
O mtodo framesLoaded vai tratar de verificar se todos os quadros daquela linha de tempo j
foram usados ou carregados, ou seja, se a animao j foi toda rodada.
Agora devemos editar a classe inimigoClasse. No nada muito complicado, apenas iremos
adicionar algumas linhas na verificao da coliso.
As linhas em negrito demonstram o que deve ser adicionado:
package inimigos {


public class inimigoClasse extends MovieClip {

private var nucleo:Object;
private var vely:Number = 2;
73

public function inimigoClasse() {
// constructor code
addEventListener(Event.ADDED_TO_STAGE,
quandoAdicionado);
}

nucleo = MovieClip(root);
}

private function recarregar(event:Event):void{
y += vely;

i++){
var atingido:Sprite =
nucleo.atirar.getChildAt(i);
if(hitTestObject(atingido)){


var explodir:MovieClip = new explosaoClasse();
explodir.x = x;
explodir.y = y;
stage.addChild(explodir);

}
}
}

public function removeListeners():void{
recarregar);
}
}
}

E j temos nossa exploso com som!
Devemos adicionar o som dos tiros. O raciocnio semelhante, mas iremos utilizar o cdigo
que est no Quadro 1 da linha de tempo agora.
No espao que separamos para as variveis adicionamos esta:
var somDoTiro:Sound = new sfx_laser();

74

E na funo onde tratamos a ao da barra de espao, adicionamos:
}if(checarTeclaBarra == true && podeAtirar == true){
laser.x = nave.x;
laser.y = nave.y;
podeAtirar = false;
tempoDoTiro.start();
somDoTiro.play();

}
}

E agora temos nossa nave atirando com som!

Prximo passo: Pontuao - Score.
75

Ganhando alguns pontos.
Bem, agora que j conseguimos realizar uma verdadeira batalha contra nossos inimigos
precisamos ganhar alguns pontos por cada nave abatida. Primeiramente precisamos de um
placar. Para este exerccio foi criado um shape simples no Flash CS5 e depois este shape foi
convertido em Clipe de filme (MovieClip). O nome do objeto na converso no ir importar
neste caso, pois o placar ficar fixo na tela.

Neste caso, nomeamos a ocorrncia do objeto como score.

Aps isso basta dar dois cliques no Clipe de Filme para edit-lo, pois precisaremos de algum
texto.
O texto ser colocado em uma camada acima do shape.
A palavra Score do quadro apenas ilustrativa e no ter nenhuma interao com o jogo.
Vamos nos focar nos nmeros.
76

O importante saber que so dois campos de texto separados.

No importa muito a quantidade de nmeros que for digitada aqui, isso apenas uma
marcao para sabermos qual o tamanho que os nmeros iro ocupar. Isso ser substitudo
depois no cdigo.
Nas propriedades do texto (os nmeros) iremos selecionar as opes Texto clssico e Texto
dinmico.
Dica: Basicamente utilizamos no Flash CS5, Texto esttico para textos que no tero interao
com o usurio, Texto dinmico para interao com o cdigo e Texto editvel para textos que
podem ser editados pelo usurio.

77

Nomeamos a ocorrncia do texto para scoreTxt.
Ateno: A ocorrncia scoreTxt do texto diferente da ocorrncia score do MovieClip.

E agora, nosso texto precisa ser incorporado ao projeto para que funcione corretamente. Para
isso basta clicar em Incorporar...

Marcaremos apenas a opo Numerais [0..9], pois s sero utilizados nmeros neste campo,
ento o Flash no ir incorporar a fonte toda no cdigo.
78

Com isso temos o texto configurado. Agora vamos ao cdigo.
Primeiro, no nosso famoso Quadro 1, criamos uma varivel para armazenar o valor numrico
dos pontos.
var scoreInicial:Number = 0;

No final do cdigo criaremos uma funo para contar os inimigos mortos.
score.scoreTxt.text = String(0);
function inimigoMorto(pontos)
{
scoreInicial += pontos;
score.scoreTxt.text = String(scoreInicial);
}

79

score.scoreTxt.text = String(0); definimos fora da funo que o valor
padro que aparecer no texto numrico ser 0. Este valor ir substituir qualquer valor que
tenhamos colocado anteriormente no placar. Note que a hierarquia segue como temos no
MovieClip: scoreTxt est dentro de score, ento assim que o acessamos: score.scoreTxt.
Depois acessamos a propriedade de texto usando o mtodo text, que j reservado do
cdigo, e a tudo isso definido que 0 agora uma String (String(0)).
function inimigoMorto(pontos) Incio da funo inimigoMorto. Note o
parmetro pontos que criamos. Essa ser a varivel que ir trazer para dentro da funo o
nmero do inimigo abatido.
{
scoreInicial += pontos; Aqui o scoreInicial comea a recebe o valor da
varivel pontos.
score.scoreTxt.text = String(scoreInicial); E este valor depois
repassado para o campo de texto, sendo convertido em String.
}
Agora precisamos capturar a quantidade de inimigos mortos. Para isso iremos revisitar a classe
inimigoClasse, mais precisamente a funo recarregar.
Basta adicionarmos uma linha na funo recarregar:
{
y += vely;

for (var i = 0; i < nucleo.atirar.numChildren;
i++)
{
if (hitTestObject(atingido))
{


var explodir:MovieClip = new explosaoClasse();
explodir.x = x;
explodir.y = y;
stage.addChild(explodir);


nucleo.inimigoMorto(1);

80

}

}

}

Com ncleo.inimigoMorto(1) estamos aproveitando a funo de coliso para adicionarmos 1
ao valor dos pontos, ento toda vez que o laser colidir com a nave inimiga a funo recarregar
ir passar se parmetro para a funo inimigoMorto que est no Quadro 1, aumentando assim
o valor do score. Nada complicado.
Dica: Definimos como valor da morte do inimigo o nmero 1, mas poderamos fazer a conta de
10 em 10, por exemplo, neste caso o valor seria 10. A vantagem de fazer dessa forma o fato
de podermos atribuir valores diferentes a inimigos diferentes.

E agora j ganhamos alguns pontos!

81

Primeiro jogo finalizado!

Como dito, o objetivo dessa apostila indicar os primeiros passos para aspirantes a
desenvolvedores de jogos com uma linguagem que oferece tudo o que necessrio para se
criar um jogo satisfatrio.
Obviamente programadores bem mais experientes poderiam encontrar solues mais viveis
dos que as que apliquei aqui, mas visei buscar bases slidas nos fundamentos para a
construo de futuros jogos.
Por isso tentei abordar toda a parte bsica de entendimento de lgica para a criao de um
jogo simples. At aqui voc aprendeu um pouco sobre variveis, constantes, funes, classes,
propriedades, interaes com mouse e teclado, colises e etc., e j tem uma certa bagagem
para comear a usar a imaginao e tenta criar seus prprios jogos.
A idia que esta seja apenas a primeira de uma srie de apostilas. Nas prximas edies
pretendo abordar outros assuntos um pouco mais complexos e oferecer outros exemplos de
jogos, possivelmente, outras ferramentas e linguagens.
Agradeo a todos os que me apoiaram at aqui e espero realmente que essa apostila tenha lhe
auxiliado em seus primeiros passos rumo ao desenvolvimento de webgames.
Caso queira enviar sugestes (e talvez alguns milhezinhos) fique vontade para enviar emails
para: artur.guitelar@gmail.com

At o prximo jogo!

Artur Guitelar - Killdragon.

82

Referncias bibliogrficas:
Livro:
Aprendendo ActionScript 3.0 Guia para iniciantes Editora Artmed /Bookman
Autores: Rich Shupe e Zevan Rosser.
Sites:
http://asgamer.com/
http://www.youtube.com/user/oppcell
http://www.emanueleferonato.com/

Artur Guitelar WebGamescomAS3

Enviado por

Dados do documento

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Artur Guitelar WebGamescomAS3

Enviado por

Direitos autorais:

Formatos disponíveis

Games em ActionScript 3.

Você também pode gostar