Você está na página 1de 12

Tutorial de ActionScript 3

Joo Guilherme Brant

Esse tutorial dever para um leitor dar uma vaga ideia de como comear a
desenvolver aplicativos no Flash usando ActionScript. Esse tutorial foi
elaborado para rpida leitura e, para conhecimento aprofundado, assim como
para aplicaes especficas, novas pesquisas devero ser realizadas. O prprio
flash tem um grande base da dados de ajuda, que pode ser utilizada ao lado
desse tutorial.

Lembrando que o conhecimento de ingls ajuda e muito na hora de


programar alguma coisa.

Esse tutorial foi pensado para pessoas de nvel bsico. Caso voc j programa,
pule as partes de Sintaxe, Variveis e Operadores e Funes.

O que Actionscript

Fonte: Wikipedia

ActionScript uma linguagem de programao orientada a objetos baseada


em ECMAScript, utilizada principalmente para construo de aplicaes RIA (do
ingls RIA: Rich Internet Applications (Aplicaes Ricas de Internet)).
executada em uma mquina virtual (AVM - "ActionScript Virtual Machine",
atualmente na verso 3 que est disponvel no Adobe Flash Player (plug-
inencontrvel em navegadores Web) e tambm no ambiente Adobe AIR.

Sintaxe

Para todo tipo de linguagem de programao existem regras para as quais


devem ser seguidas para que o computador entenda o que deve ser feito.

O cdigo lido pelo computador linha a linha. Para maior entendimento (mas
no necessrio), usual ao final de cada linha colocar o ponto-e-vrgula(;).
O ponto-e-vrgula tambm pode ser usado para terminar uma instruo no
meio de uma linha, pra colocar outra na mesma linha.

Cada linha aqui, uma instruo. Instruo pode ser a declarao de uma
varivel, a manipulao de variveis de dados, uma chamada de uma funo.
(Veremos tudo adiante). Enfim, saiba que o computador lida com o cdigo
instruo aps instruo, uma a uma.

Veja:

//Comentrio
instruo1;
instruo2;
instruo3; instruo4; instruo5;
//...

Aqui, primeiro o computador l a instruo1, depois a instruo2, e por a vai.


Esse carinha que vai lendo instruo aps instruo o chamado fluxo de
execuo. possvel fazer o fluxo de execuo pular pra frente ou ainda
voltando pra trs. Veremos adiante como isso funciona.

Lembrando outra coisa: comentrios. Tudo seguido de duas barras (//) ou


entre os smbolos /* e */ chama-se comentrio. Comentrio algo que no
considerado pelo computador. Comentrios servem para indicar alguma coisa
para voc, programador.

Use e abuse de comentrios, uma boa prtica. Sempre indique o que vai
fazer em um prximo trecho de comentrio. Fica mais fcil de lembrar o que
esse cdigo faz para voc, e fica mais fcil pra todo mundo que abrir para ler o
seu cdigo entender o que voc fez.

Alm de tudo isso, o Actionscript (assim como a gigantesca maioria das


linguagens de programao) permite voc dar nome s coisas. Mas existem
algumas palavras j pr-estabelecidas pelo actionscript que definem qual
instruo ser realizada, ou seja, o que o computador dever fazer, que no
podem ser usadas livremente. Essas palavras so chamadas de palavras
reservadas. Veremos muitas delas adiante. Por exemplo, var define que ser
declarado uma varivel, while define que ali ter um loop. medida que se vai
programando, essas palavras ficam cada vez mais fceis de serem lembradas
(muitas linguagens de programao tem as mesmas palavras para as mesmas
coisas).

Cada vez que voc testa sua aplicao (CTRL+ENTER) o cdigo que voc
escreveu nos frames e nas classes importadas so compiladas. Ou seja, elas
so transformadas de cdigo entendvel por voc, ser humano, para cdigo
que pode ser entendido pelo computador. Aps isso, o cdigo pronto (que
chamamos de binrio) executado. As duas coisas ocorrem rapidamente, uma
aps a outra.

Variveis e Operadores

Quando programamos, guardamos e manipulamos vrios dados basicamente.


O espao no computador reservado para um dado que pode ser depois
manipulado denominado varivel. Para se declarar uma varivel em
Actionscript deve-se escrever:

var nome_da_varivel:Tipo;

Onde nome_da_varivel pode ser o nome que quiser (a, b, banana, bla). S
no pode ser uma palavra reservada da linguagem (var, class, etc...). A
palavra reservada var indica que ali ser declarada uma nova varivel.

No se pode guardar (ou no se deve) qualquer tipo de dado em uma varivel


qualquer. necessrio identificar para o computador qual tipo esse.
(Nmero, Palavra, Caractere, Objetos [veremos mais tarde]). Esse o Tipo
depois do :.

Para o actionscript, existem vrios tipos primitivos. Em pouqussimas palavras,


tipos primitivos de uma linguagem so tipos que no podem ser separados em
nenhum outro tipo. Esses tipos so, por exemplo: int, char, etc. No
actionscript, ao contrrio de outras linguagens, tipos primitivos so pouco
usados pelo programador comum. O programador comum usa tipos que usam
tipos primitivos (mais sobre isso adiante).

Mais um exemplo:

var a:b;

Declarei uma varivel a do tipo b.

Agora que uma varivel foi declarada, possvel us-la de vrias formas.
Como no exemplo:

var a:int = 5;
var b:int = 10;
a = b;
b = a + b;
a = a b + 42;

Aqui, declarei dois inteiros (tipo primitivo) a e b. Pode-se igualar a com b, a


com uma operao que envolve a e b, e a com uma operao que envolve a e
b e mais uma constante.

Existe tambm o uso de constantes na linguagem. Vrios tipos (primitivos ou


no) possuem literais. Literais so maneiras fceis de descrever valores e
dados. O 5 uma literal que descreve o nmero inteiro 5. Outro exemplo
com palavras: abelha um literal que descreve a string abelha, ou seja, a
palavra abelha. Veja:

var palavra:String = ovo;

Strings so palavras. Um pouco mais formalmente, uma lista de caracteres.

Veja tambm que existem operadores. Operadores so usados para manipular


dados: literais e/ou variveis. Todas as quatro operaes (+, -, * e /) so
operadores para inteiros no actionscript. Note que as funes dos operadores
depende dos tipos em que esto envolvidos. Por exemplo, possvel utilizar +
entre strings. O resultado a concatenao das strings, ou seja, junta-se as
strings:

var novaString:String = ome + lete; // novaString torna-se omelete


trace(novaString); // Vai imprimir omelete na tela

Existem tambm alguns operadores que s precisam de um parmetro. Por


exemplo, o ++:

i++;

Isso significa que o i agora se torna i + 1. Isso equivalente escrever:

i = i + 1;

medida que vai utilizando o actionscript, os diferentes tipos e operadores vo


sendo utilizados mais frequentemente. Alm disso, com uma breve pesquisa
na internet j temos uma lista de tipos e de todos os operadores (essa ltima
no to grande assim).

Mexendo no fluxo de execuo

Como j dito acima, o fluxo de execuo vai lendo as instrues uma a uma,
linha a linha. Mas ele no precisa ser totalmente linear. possvel fazer ele
saltar para vrias outras partes do seu cdigo. Mas voc no deveria fazer
livremente.

Caso voc queira que o computador execute um cdigo se for estabelecida


uma condio, ou at que execute um outro quando no for estabelecida, voc
pode usar o if...else...

Veja:

// seu cdigo..

if(condio)
{
//se a condio for satisfeita executa as instrues daqui
instrucao1;
instrucao3;
}
else
{
//caso contrario executa as daqui
instrucao2;
}
//mais cdigo..

Mas como estabelecer uma condio? Existe um tipo de varivel, o tipo


booleano. Tipos booleanos s podem assumir dois valores, true (verdadeiro)
ou false (falso). Note que true e false so palavras reservadas pelo
actionscript. Existem vrios operadores que resultam nesse tipo. Uma
expresso ou instruo que resulta em um tipo booleano so chamadas de
expresses booleanas. Os operadores mais comuns so:

a == b igualdade. Ele resulta em true caso a for igual a b.


A > B maior que. Ele resulta em true caso A for maior que B (d um erro se
A ou B no forem nmeros). Existe tambm o menor que.
A >= B maior ou igual que. Ele resulta em true caso A for maior ou igual a B
(tambm d o mesmo erro). Existe tambm o igual ou menor que.
A != B diferena. Resulta em true caso A no for igual a B.

Existem tambm os operadores booleanos, que so usados sobre booleanos ou


expresses booleanas. Se existem duas expresses booleanas C e D:
C && D E lgico. Resulta true se tanto C tanto D forem true. E false caso
contrrio.
C || D > OU lgico. Resulta true se C ou D forem true. Se um dos dois for
false, no tem problema.

Usando esses operadores voc ter no final uma expresso booleana tambm.
Voc pode substituir o condio no if acima por uma expresso booleana.

Outro jeito de mudar o fluxo de execuo fazendo um loop:

while(condio)
{
//cdigo aqui
}

//mais cdigo..

Esse while determina um loop. Ou seja, esse cdigo dentro do corpo do while
(entre os {}) ser rodado infinitamente, at que a condio no seja mais
satisfeita. Quando no for mais satisfeita, o fluxo de execuo sai do loop e
continua normalmente.

Muito cuidado com o loop infinito: o loop infinito quando por algum erro seu
o while nunca para Isso significa que o flash do usurio vai travar caso
acontea isso. Voc no quer que isso acontea.

Funes

medida que o cdigo fica muito grande, fica necessrio fazer partes de
cdigo que sejam reutilizveis. A que entram as funes. Ver que funes
so nada mais nada menos que fazer o fluxo de execuo pular para uma certo
trecho de cdigo.

Observe o corpo de uma funo comum:

function nome_da_funcao(parametro1:Tipo1, parametro2:Tipo2):Tipo_De_Retorno


{
//Cdigo da funcao aqui
}

Todas as funes iniciam com a palavra reservada function, seguido do nome


que voc deseja adicionar para a funo.

Dentro do corpo da funo (entre os {}) fica o cdigo dela. Esse cdigo ser
rodado toda vez que funo for chamada. Para chamar uma funo, veja
adiante...
var a:int;
var b:Number;

// ....cdigo.......

nome_da_funcao();

//mais cdigo..

Como pode ver, qualquer nome seguido de parnteses () uma chamada de


funo. Quando o fluxo de execuo chegar em uma chamada de funo, ele
entrar na funo e comeara a seguir o cdigo de dentro.

Procure separar seu cdigo em funes o mximo possvel. Alm dele ficar
mais fcil de entender, fica muito mais fcil de encontrar erros.

A funo pode aceitar parmetros, como acima. No exemplo acima, a funo


est esperando os parmetros parametro1 e parametro2. Dentro do cdigo da
funo. Voc pode usar os parmetros como variveis livremente. Na chamada
da funo, voc TEM que colocar os parmetros dentro dos parnteses, na
ordem que foram declarados na declarao da funo.

Exemplo:

function fun(i:int, j:int)


{
//blabl
}

//cdigo

var a:int = 2;
fun(a,4);

As funes tambm podem retornar coisas. Depois do parnteses da


declarao da funo, voc pode definir o tipo de retorno assim como define
tipos de variveis, quando as declara. Esse o tipo do dado que dever ser
retornado pela funo. Voc retorna coisas com a palavra reservada return.
Quando o fluxo de execuo chegar em um return, ele sai da funo na hora.
Voc pode colocar returns sem nada para funes que no retornam nada,
caso s queira sair dela naquela hora.

Exemplo:

function fun():int
{
var b:int = 2;
return b;
}
var a:int = fun();
Como voc pde ver acima, quando voc chama uma funo que retorna
alguma coisa, voc pode pegar esse resultado. E colocar em uma varivel,
como feito acima. Existem muitas utilidades. Uma funo pode retornar um
valor do tipo Boolean e ser colocada dentro de uma condio de um if, por
exemplo. As utilidades so infinitas.

Classes e Instncias

Voc tambm pode at definir os seus prprios tipos. a que classes entram
em ao.

Veja o exemplo:

class nome_da_classe
{
//Variaveis

//Mtodos
}

Uma classe define um tipo. Por exemplo, int, Boolean, Number, String, todas
essas so classes. Toda classe s tem duas modalidades de coisas: campos e
mtodos.

Campos o nome de uma varivel em uma classe, e mtodo apenas um


nome de uma funo em uma classe. Ou seja, toda classe s tem variveis e
funes.

A primeira coisa sobre classes que voc ir fazer como instanciar uma classe.
Voc faz isso a partir da palavra reservada new:

var instancia:nome_da_classe = new nome_da_classe();

Esse new nome_da_classe(); parece uma chamada de funo. E , uma


funo chamada construtor. O Construtor um mtodo especial que toda
classe tem que retorna uma dado do tipo daquela classe. O construtor no
precisa ser definido, mas caso queira defini-lo, apenas crie um mtodo com o
mesmo nome da classe, olhe no exemplo:

class minhaClasse
{
//Variaveis

//Construtor
function minhaClasse()
{
}

//Mtodos
}
Detalhe que o construtor no pode retornar nada. Ele j retorna o tipo da
prpria classe. Mas voc pode usar o return sem nada caso queira que a
funo acabe no meio.

Agora que voc j tem uma instncia da sua classe (ou varivel do tipo da sua
classe, chame-a do que quiser), voc j pode us-la. Veja no exemplo:

class minhaClasse
{
//Variaveis
public var a:int = 2;
public var blabla:tipo_blabla;

//Construtor
function minhaClasse()
{
}

//Mtodos
function foo(x:int):Number
{
return x*x;
}
}

var instancia:minhaClasse = new minhaClasse();


var c:int = instancia.a + 2;
var d:Number = instacia.foo(c);

Observe que utilizamos campos e mtodos da instncia. Todas as instncias de


uma mesma classe tero os mesmos campos e mtodos (voc pode criar
vrias). Para acessar um campo ou mtodo da instncia, use o nome da
instncia seguido de ponto(.) seguido do nome do campo ou do mtodo.

Quando voc chama um mtodo de uma instncia, diz-se que voc est
chamando o mtodo sobre essa instncia.

Classes tambm tem um poder muito grande, que o de extender outras


classes, veja no exemplo:

class Carro
{
var rodas;
var volante;
var motor;

function acelerar()
{
trace(acelerei);
}

function freiar()
{
trace(frear);
}
}

Defini uma classe carro que tem vrias coisas que um carro tem (campos), e o
que um carro faz (mtodos).

Agora sabemos que existem tipos mais especficos de carro, que ainda so
carros. Um exemplo: o fusca:

class Fusca extends Carro


{
var idade:int;
var estragado:Boolean;

override function acelerar()


{
if(estragado)
trace(nem acelerei);
else
trace(acelerei com dificuldade);
}
function estragar()
{
estragado = true;
}

Esse fusca tem tudo o que o carro tem (volante, rodas, etc). Mas ele tem umas
coisas a mais, que so especficas dele(idade de carro velho, se est estragado
ou no...). Ele tambm pode fazer mais coisa que um carro comum (ele pode
estragar) e ele tambm pode alterar o jeito como um carro comum faz as
coisas (agora ele no acelera to bem).

Para mudar a funcionalidade de um mtodo que j foi declarado na classe pai


(no caso, o pai o Carro), usa-se a palavra reservada muito til override.

Dentro dos mtodos, voc tambm pode usar a palavra reservada this. Essa
palavra se refere instncia da qual o mtodo est sendo chamado. Por
exemplo, voc pode acessar campos e outros mtodos dentro de um mtodo,
chamar uma outra funo com a instncia como parmetro, entre outros.

Outro conceito importante o conceito de pacotes. Pense um pacote como


uma pasta que contm classes. Voc pode criar os seus prprios pacotes
quando estiver trabalhando em um projeto. O Flash separa as classes pr
definidas em pacotes fceis de vizualizar. Por exemplo, flash.display o pacote
de coisas grficas, flash.events o pacote de coisas sobre eventos. Os dois
esto dentro do pacote flash, por isso o . entre os nomes.

Classes podem parecer complicadas, mas uma vez aprendidas, so um


importante aliado.

Display Objects e como colocar grficos na tela


Image uma DisplayObject como uma imagem, animao, etc. No se pode
criar instncias dessa classe diretamente (o Flash no permite). O que se faz
usar um filho dessa classe. As mais utilizadas so Sprite, MovieClip e
SimpleButton.

No Flash, os grficos so implementados atravs de uma rvore. Na raz da


rvore, fica o Stage, que o espao em branco que vemos quando criamos um
novo arquivo flash. O stage um DisplayObjectContainer, ou seja, uma classe
que um DisplayObject que pode ter vrios DisplayObject como filhos, e at
outros DisplayObjectConainers.

Na hora da exibio, o Flash comea exibindo o Stage, depois exibe todos os


filhos, depois os filhos dos filhos em cima dos filhos e por a vai. Ou seja, para
adicionar alguma coisa na tela voc tem que adicionar um filho no Stage, e
depois ir adicionando filhos. Ela faz uma busca em largura na rvore exibindo
tudo, a cada frame.

Cada DisplayObject tem sua posio, ou seja, o seu X (sua posio horizontal)
e seu Y (sua posio vertical). Algebricamente, um vetor. Aumentando o X
voc arrasta o DisplayObject para a direita, diminuindo para esquerda. O
aumento do Y arrasta o DisplayObject para baixo.

Ao adicionar um filho na rvore, a origem do filho torna-se a posio do pai.


No flash, como mexemos em duas dimenses, a origem principal a posio
do stage, que a posio x = 0 e y = 0. Essa posio o ponto superior
esquerdo do espao em branco. Um filho sempre tem sua origem na posio
do pai. Ou seja, mudando a posio do pai voc tambm muda a posio do
filho, que depende da posio do pai. Isso tambm acontece com outros
parmetros, no s posio. Por exemplo, transparncia, altura e largura, etc.
Se interfere no pai interfere no filho.

Para adicionar um filho no stage, voc pode ir at o timeline, e apertar F9 para


adicionar cdigo quele frame. O mtodo addChild(d:DisplayObject) serve pra
isso. Ele um mtodo tanto de um stage como de qualquer
DisplayObjectContainer (que inclui sprites e MovieClips).

Exemplo:

var sprite:Sprite = new Sprite();


var movieClip:MovieClip();
addChild(sprite); // Isso faz o sprite aparecer na tela
sprite.addChild(movieClip); // Isso faz um movieclip aparecer tendo como base o sprite

Essa funo addChild a funo para colocar um filho em um


DisplayObjectContainer. Voc executa esse mtodo sobre a instncia que voc
quer que seja pai, passando como parmetro o filho.

Para fazer um desenho no flash e fazer esse desenho aparecer na tela em


tempo de execuo, ou seja, no cdigo, voc ter que linkar o smbolo no
actionscript.

Caso no saiba o que seja smbolo, pesquise flash new symbol ou o que
quiser na internet.

Para linkar o smbolo para o actionscript, voc deve fazer o seguinte:

1. Abra um documento flash.


2. Crie o seu smbolo.
3. Abra a Library(Biblioteca).
4. Clique com o boto direito no smbolo.
5. Marque a opo Export for ActionScript dentro de Linkage
6. Coloque o nome da classe que gostaria de que sua imagem tivesse
7. Coloque a classe que ser pai da imagem que voc est criando. (O
Default, MovieClip, o mais usado, mas voc tambm pode usar Sprite
se preferir gastar menos espao).
8. Pronto! Agora toda vez que voc chamar new nome-da-classe(); ,
voc estar criando uma instncia desse smbolo no cdigo. Funciona em
qualquer parte do cdigo, at em classes, contando que elas estejam no
mesmo projeto.

Agora sim, voc sabe como colocar imagens dentro do cdigo actionscript.

Eventos e Interatividade

Mas e sobre interatividade, como fazer? O Flash foi feito para ser interativo
com o seu usurio, e no uma coisa em que apenas assistido. Fazer alguma
coisa acontecer quando se movimenta o mouse ou aperta-se uma tecla, por
exemplo, importantssimo.

Para comear a fazer alguma coisa interativa, o programador tem que


entender alguma coisa de eventos. A classe Event e suas filhas so tipos de
eventos. As instncias da classe Event so eventos mais geral (e o que
normalmente voc vai mais utilizar). Mas existem tambm, por exemplo, a
classe MouseEvent, tem instncias que so eventos ligados ao mouse, como
movimentao e clique. E por a vai.

A no ser que crie manualmente um evento, ele no vai ser criado


(instanciado) por voc. E sim pelo sistema. O que voc faz que toda vez que
um evento for criado (isso um pouco amplo, a explicao verdadeira mais
complicada) e detectado, uma chamada pra uma funo acontece. essa
funo que voc criar. O que acontecer quando o usurio clica em um
boto? Ele chamar uma funo automaticamente, e voc quem criar essa
funo.

Veja um exemplo de como fazer um evento funcionar, em uma frame do


timeline:
function foo()
{
trace(falae);
}

addEventListener(Event.ENTER_FRAME,foo);

Nesse cdigo, adicionamos ao de entrar em um novo frame (um evento


utilizado MUITO) a funo foo. Ou seja, o flash acabar imprimindo na tela
milhares de falae infinitamente. Isso acontece porque a timeline principal
nunca para de entrar em novos eventos. Alis, nada para de entrar em novos
eventos.

Essa funo, addEventListener, a funo principal para mexer com


interatividade. A instncia sobre a qual voc age o mtodo a instncia que
escuta. Ou seja, se voc quer que um boto capture o evento
MouseEvent.CLICK, voc faz esse mtodo sobre esse boto. O primeiro
parmetro qual o tipo de evento de fato, ser escutado pela instncia.
Existem vrios tipos de eventos, que podem ser facilmente pesquisados.

O segundo parmetro o nome da funo da qual gostaria que fosse chamada


quando o evento especificado acontecesse sobre a instncia especificada. O
bacana que pode ser qualquer funo, at um mtodo de outra instncia que
no tenha nada a ver com o que de fato esteja acontece. A gama de
possibilidades imensa.

Outras Classes

Existem muitas outras classes que podem ser usadas para explorar toda a
funcionalidade do Flash. Como por exemplo Sound para sons, Mouse para o
mouse, Accelerometer para acelermetro de dispositivos mveis, entre outros.
Muitas dessas classes tm seus prprios tipos de eventos.

Uma rpida pesquisa no arquivo de ajuda ou na internet trazem classes e suas


descries para as mais vrias funcionalidades.

Sabendo de DisplayObject's e Event's, garanto-lhe que uma boa parte do


caminho j est percorrida.

Você também pode gostar