Tutorial Classes AS3; Estrutura e compreensão!

Tutorial Classes AS3; Estrutura e compreensão!

Tenho visto por variados sitios alguns pontos interessantes que falam do AS3, mas muito poucos aborda a estrutura base de uma class e os seus tipos de elementos e funções… ora, andei pelos meus feed’s e favoritos à procura de alguns artigos que falassem disso, e como de esperar são muito poucos, por isso aqui vai… um tutorial de como entender e construir as classes em as3.

Começando…

Com o Flash player 10 e o Flash CS4 disponivel, bem como o aproximar do lançamento do Flex 4 e thermo (esperemos) o Action Script 3 está a ficar na moda, e cada vez vejo mais pessoas à procura de informações sobre como se iniciarem no AS3.

A grande base para entender o AS3 é a compreensão de linguagem orientada a objectos que utiliza uma estrutura de código optimizada baseada em funções que são executadas por “pedido” a esse código e pela devida hierarquia e que asseguram o melhor desempenho da aplicação / animação. A grande vantagem do AS3 é permitir separar muito do código em pequenos arquivos que ao serem compilados ficam disponiveis na aplicação como parte conjunta.

Apesar de inevitavelmente trazer muitas vantagens, também pode ser um pouco complicado entender o AS3, mas vamos por passos;

A OOP, ou POO (Programação Orientada a Objectos), traz consigo uma robusta forma de desenvolver o código da nossa aplicação, que comporta muitos melhoramentos como:

  • Estrutura de código, muito organizado e de facil compreensão.
  • Reutilização do código, o que permite além de reduzir os custos de programação acelera em muito o desenvolvimento de aplicações devido à extensibilidade do código.
  • A robustez e velocidade do código, que permite uma grande performance, com muito poucos erros que podem facilmente serem interceptados.
  • Grande vantagem de migrações de outras linguagens principalmente o Java que comporta muitas semelhanças devido à sua já utilização de OOP.

A programação orientada a objectos basea-se na abstração do resto do código, e concentração apenas no “pedaço” de código/class que estamos a fazer, este peçado de código é considerado um objecto, que como qualquer elemento fisico tem caracteristicas, definições e propriedades… o mesmo se passa com estes objectos no AS3, vejam um exemplo:

Vida Real; Carro:

Caracteristicas: marca, modelo, ano

Funções: anda, trava, acelera, rodaVolante, acendeLuz, apagaLuz

Passando isto para uma class em AS3:

Caracteristicas/Variaveis: carro.marca , carro.modelo, carro.ano

Funções: carro.anda(); carro.trava(), carro.acelera(), carro.rodaVolante(), carro.acendeLuz(), carro.apagaLuz()

Isto para quem leu os meus tutoriais de AS3 já não é estranho, embora agora vá abordar o assunto de uma maneira diferente, explicando um pouco mais as classes.

Quando falamos de classes, temos que ter em especial atenção alguns pontos, principalmente porque são as bases da linguagem orientada a objectos, termos já presentes em muitas linguagens de programação como java ou php.

Dum modo geral, ao programar AS3 devemos ter em conta:

  • Definição / escrita de classes
  • Criação de Propriedades, métodos e definições de acesso e conteudo
  • Controlo de acesso às classes, propriedades, métodos e definições / variaveis
  • Criação de popriedades e métodos estáticos
  • Definição e utilização de interfaces
  • Utilização de métodos hereditários bem como a re-escrita de elementos das classes

Resumindo ao básico, uma classe engloba todas as propriedades de um objecto (podendo o objecto ser a sua propria class) bem como as suas definições e comportamentos. As classes no AS3 são compostas num arquivo de extensão .as e são consideradas como dados / objectos e podem ser declaradas como tal como se fossemos usar um outro tipo de objectos.

Uma class pode fazer parte de um “pacote/grupo” chamado “package” que pretende com que o código seja mais facilmente organizado para o programador e especialmente util na programação em grupo.

Vejam um exemplo, temos um carro e uma moto, como são ambos veiculos, podemos engloba-los no mesmo pacote, mas depois temos algumas diferenças, um têm 4 rodas, volante, 5 lugares e por outro lado temos a mota com 2 rodas, 2 lugares, guiador… nestas diferenças, para organizarmos ainda mais o código dentro do package “veiculos” podemos separar por:

Veiculos 2 Rodas

Veiculos 4 Rodas

Sendo que o nosso package estará distribuido como:

Veiculos->2 Rodas->Moto

Veiculos->4 Rodas->Carro

Se tivermos mais um bicicleta, fariamos:

Veiculos->2 Rodas->Bicicleta

Sendo que os nossos packages seriam: veiculos.duasRodas e veiculos.quatroRodas e as nossas classes Moto.as, Carro.as e Bicicleta.as.

Para criação dos packages destas classes, usariamos:


package veiculos.duasRodas {

}

e

package veiculos.quartoRodas {

}

Sendo que obrigatóriamente o  veiculos.quatroRodas representa a estrutura de pastas a partir da nossa pasta Source, raiz do projecto, vejam o exemplo do projecto em Flex da imagem ao lado, como podem ver, a pasta src é a pasta source do meu projecto, e é a partir desta que é feita a estrutura de pastas para definir o nosso package.

De seguida vou criar as pastas src/veiculos/duasRodas e src/veiculos/quartoRodas que vão organizar e identificar claramente as minhas classes. Pode ver também já os ficheiros (classes) Moto.as, Bicicleta.as e Carro.as devidamente criados e colocados nas suas devidas pastas. Assim se forma a estrutura do nosso package e suas devidas classes.

Esta é obrigatóriamente a estrutura de packages em AS3, sendo que uma class não têm obrigatóriamente de ser incluida num package, mas em projectos de media/grande dimensão é altamente aconselhavel a seguir este tipo de organização. O nome das classes devem sempre ser iniciados por letra maiuscula.

Vejamos o exemplo da class Moto:

package veiculos.duasRodas
{
public class Moto
{
public function Moto()
{
}
}
}

Iniciamos com o package, definimos a nossa class como public para que possa ser instanciada (para que possa ser atribuida e utilizada como uma variavel) e definimos a função principal da nossa class como public também.

Esta é a estrutura base, sendo que podem ser usados diferentes tipos de declarações para a nossa class e funções, tais como:

  • public – Declara a visibilidade maxima, publica, que é visivel por todos os elementos da nossa applicação.
  • internal – Visivel unicamente dentro do nosso package, apenas possivel de utilização interna.
  • final – Class final, impossivel de ser extendida por outra class.
  • dynamic – Class dinamica, possivel de ser alterada com dados durante a execução da aplicação adicionando propriedades à mesma.

As declarações final e dynamica devem ser usadas como sub elementos na declaração da class, como:

  • public final class Moto
  • internal dynamic class Moto
  • public dynamic class Moto

Depois de uma class elaborada, ela não fica automaticamente disponivel na nossa aplicação, quando a desejar-mos usar devemos indicar à aplicação que ela deve ser incluida, para isso usamos o import, indicando o seu caminho a partir da pasta raiz do projecto:


import veiculos.duasRodas.Moto;

E deve de seguida ser instanciada, usando a palavra new:


private var cbr:Moto = new Moto();

A partir deste momento a nossa class encontra-se instanciada na variavel cbr e pode ser usada na nossa aplicação.

As nossas classes podem conter atributos, ou propriedades que podem igualmente ser indicadas como variavies, podendo seguir o seguinte código:


package veiculos.duasRodas
{
public class Moto
{
public var modelo:String;
public var marca:String;
public var cor:uint;

private var velocidadeActual:uint=0;

public function Moto()
{
}
}
}

onde foram declaradas as variaveis/propriedades modelo, marca, cor onde estão acessiveis a toda a aplicação, desde que a class tenha sido instanciada, estas declarações podem ser de alguns tipos:

  • public – Passivel de ser acedida e definda ao longo de toda a aplicação e instancias
  • private – Apenas para uso da nossa class, não acessivel fora da mesma nem em sub-classes
  • protected – Acessivel para uso da nossa class, mas também nas sub-classes
  • static – Acessivel para uso na class mas também na sua instancia.

Depois da definição da class e suas propriedades podemos definir métodos, ou acções executaveis da nossa class, conhecidos como métodos, podem ser definidos como funções:

public function acelera(velInc:uint):void {
velocidadeActual+=velInc;
}

onde definimos a função como public, que recebe o incremento de velocidade como argumento e que o incrementa na velocidadeActual. Estes métodos podem ser declarados como:

  • public – Visivel em todo o código na instancia da class.
  • private – Visivel internamente na class mas não nas sub-classes.
  • protected – Visivel na class e sub-classes.
  • static – Apenas visivel na class, mas não nas instancias da mesma.

Podem não ter reparado, mas na class que dei exemplo existe uma função com o mesmo nome da class:

package veiculos.duasRodas
{
public dynamic class Moto
{
public var modelo:String;
public var marca:String;
public var cor:uint;
private var velocidadeActual:uint=0;

public function Moto()
{
}

public function acelera(velInc:uint):void {
velocidadeActual+=velInc;
}
}
}

Esta função é chamada de constructor, e todo o conteudo desta função é imediatamente executado assim que a class é instanciada usando a palavra new, como em cima foi explicado. Este método é obrigatóriamente publico (public) e não pode ser declarada com qualquer um dos outros “controladores de acesso” como private, internal ou protected.

O constructor da class pode ser usado para definir valores / propriedades da mesma class assim que esta é instanciada, por exemplo:

public function Moto(modeloM:String, marcaM:String)
{
modelo=modeloM;
marca=marcaM;
}

onde os argumentos modeloM e marcaM devem ser indicados na instanciação:

var cbr:Moto=new Moto(“CBR”,”Honda”);

Estes argumentos podem ser opcionais, mas devemos para isso indicar um valor por defeito para eles:

public function Moto(modeloM:String=”R200″, marcaM:String=”Suzuki”)
{
modelo=modeloM;
marca=marcaM;
}

onde podemos na sua instanciação declarar ou não esses argumentos:

var cbr:Moto=new Moto(“CBR”,”Honda”);

var cbr:Moto=new Moto(“CBR”);

var cbr:Moto=new Moto();

Onde, na ausencia de atribuição de algum dos elementos (modeloM,marcaM) a função assumirá os valores pode defeito (modeloM=”R200″ e marcaM=”Suzuki”).

Nas classes existem alguns pontos que podem ser muito importantes na sua estrutura, falo de acessores, tipicamente conhecidos como getter’s e setter’s que permitem definir internamente uma variavel não alteravel na sua instancia, tais como variaveis private.

Estes get’s e set’s permitem definir/aceder a uma variavel privada sem que tenhamos que definir uma função public para aceder aos mesmos. As variaveis sujeitas a este tipo de acessores devem ser iniciadas pelo caracter _ como mostra em baixo:

private var _velocidadeMax:uint;
private var _rotacaoMax:uint;

Para definirmos os acessores, tratamo-los como funções mas com algumas caracteristicas, no caso dos get (busca):

public function get velocidadeMax():uint {
return _velocidadeMax;
}

onde definimos como public, usando a palavra get nomeDaVariavel e devolvendo o mesmo tipo de dados da mesma variavel. Devolvemos com o retun a variavel.

No caso dos set, para definir o valor de uma variavel, usamos:

public function set velocidadeMax(vel:uint):void {
_velocidadeMax=vel;
}

De notar que em ambos os casos a variavel na declaração da função é usada sem o caracter _.

Ao usarmos estes getter’s e setter’s (podemos usar os que quisermos e podemos apenas usar um deles dependendo se queremos apenas definir ou ler os dados dessa variavel) estamos a indicar que na instancia da class a variavel private pode ser lida e alterada:

private var cbr:Moto = new Moto(“CBR”,”Honda”);

cbr.velocidadeMax=240; //usando o set

var vel:uint = cbr.velocidadeMax; //usando o get

Outra forma de alterar estas variavei, poderia ser utilizando métodos/funções, mas desta forma na instancia serão disponibilizadas muito mais funções e que em class maiores pode confundir a baralhar a programação, vejam:

public function buscaVelocidadeMax():uint {
return _velocidadeMax;
}

public function  defineVelocidadeMax(vel:uint):void {
_velocidadeMax=vel;
}

mas desta feita teriamos que usar:


private var cbr:Moto = new Moto(“CBR”,”Honda”);

cbr.defineVelocidadeMax(240);

var vel:uint = cbr.buscaVelocidadeMax();

Podemos perceber algora alguns exemplos, como o que se segue que serve para enumeração, ou seja, permite definir um tipo de dados com um determinado valor, muito util para certas constantes de utilização e comparaçao na nossa aplicação, vejam:

public final class HondaCBR {

public static const cilindros:uint=2;
public static const marca:String=”Honda”;
public static const modelo:String=”CBR”;

public static const serie:String=”CBR-RX001-2006″;
public static const velMax:uint=280;
}

Esta class apenas serve para defiir dados, como se trata de um função public final pode ser acedida por toda a aplicação, mas não pode ser extendida/alterada bem como as suas variavies constantes e inalteraveis durante a execução.

Vejam na nossa class original, poderiamos colocar esta class HondaCBR.as no nosso source e colocar:

import HondaCBR;

public function Moto(modeloM:String=”R200″, marcaM:String=”Suzuki”)
{
if(modeloM=HondaCBR.modelo && marcaM=HondaCBR.marca) {
_velocidadeMax=HondaCBR.velMax;
modelo=HondaCBR.modelo;
marca=HondaCBR.marca;
//podendo aqui ter acesso a toda a class de definições:
//HondaCBR.serie
//HondaCBR.cilindros
}
else
{
modelo=modeloM;
marca=marcaM;
}
}

Assim fariamos com que identificasse-mos rapidamente as caracteristicas da nossa moto, sendo que é um exemplo de entre muitos que podem simplificar muito as coisas em as3.

Existem alguns pontos também muito uteis, como interfaces ou re-escrita de métodos, embora já exija um bom conhecimento da programação AS3 e como o post já está bem grande, fica para uma próxima oportunidade.

Espero que as coisas fiquem mais simples agora e que pelo menos o AS3 seja desmistificado.

Um abraço.


19 comments

add yours
  • michel melo October 30, 2008

    Parabens mario,

    gostei disso, tirou uma duvida que estava com ela a algum tempo :)

  • Daniel Tôrres November 2, 2008

    Parabéns, seus esclarecimentos sobre Classes foram muito úteis. É constrangedor “vasculhar” a “net” e não encontrar material que seja claro e linear.

  • Luis Fonseca November 3, 2008

    Parabéns pelo tutorial!

  • Mário Santos November 5, 2008

    Obrigado a todos pelas palavras.

    []’s

  • Isis-M November 17, 2008

    Adorei o artigo…

    se você puder escrever algo do tipo “10 coisas essenciais para entender AS3″, ficaria muito feliz!

    Obrigada

  • Douglas querubin December 2, 2008

    olá, gostaria de construir um temporizador, que a cada 30 segundos ele dispara chamando uma função. como posso fazer isso?

    meumaiil@hotmail.com

  • Fred December 2, 2008

    OLá, Mario, td bem cm vc ?
    Sou do Brasil, e vasculhando na net, o seu foi o melhor tutorial de as3 q eu encontrei até agora, extremamente profissional, e visualmente impecável …
    Estou com uma dúvida em relação à classe Key…
    Qd eu chamo um addEventListener, usando essa classe, cm eu tenho q fazer pra especificar a tecla q eu quero q seja pressionada ?
    Tentei várias opções com o Keydown, mas nada …
    N sei se eu tenho q especificar na função mesmo, sei lá …
    Todos os exemplos q eu vi até agora usam apenas o Keydown …
    Imagine q eu tenho um mc de um quadrado no palco, e eu quero q ele obedeça as teclas up, left, right, e down …
    Acredito q deve ser alguma coisa extremamente
    simples …
    Vc pode me ajudar com isso ?
    Abs … Fred

  • Mário Santos December 2, 2008

    Douglas, isto deve resolver:

    private var timer:Timer = new Timer(3000);

    timer.addEventListener(TimerEvent.TIMER, funcaoAExecutar)
    timer.start();

    private function funcaoAExecutar(evt:TimerEvent):void {
    //instruções a executar a cada 3000 ms
    }

    Serviu? Abraço.

  • Mário Santos December 2, 2008

    Oi Fred, obrigado pelas palavras…

    Quanto ao seu problema, basta importar o:

    import flash.events.KeyboardEvent;

    e Depois trabalhar com os eventos do teclado :)

    Veja o primeiro exemplo aqui:
    http://livedocs.adobe.com/flex/3/html/help.html?content=events_11.html

    clique na area e depois carregue em qualquer tecla… ele te dá o código de cada tecla.. depois basta implementar as suas ações :)

    Abraço.

  • le fuck December 8, 2008

    neeee neeee neee – lern einfach deutsch! das versteht kein schwanz dein herumgestammel! unter aller sau! ist jedes englische tutorial um einiges qualitativer als deins…

  • Mário Santos December 8, 2008

    Lieber Freund!
    Englisch ist die Standardsprache in der Welt! Aber, weil ich portugues bin, ist meine erste Zielsetzung portugiesische Sprache.

    Warum nicht erlernen Sie Portugiesen? :)

    Nächstes Jahr versuche ich, einen neuen Blog auf englisch zu schreiben, aber zurzeit benutze gerade Ihre Sprachmarkierungsfahne auf die Oberseite des Blogs.

    Bester Respekt.

  • Marcelo BMC January 26, 2009

    Me permita apenas uma adendo: variável é uma coisa e atributo é outra; Em OOP usamos “métodos” e não “funções”. Função é um conceito antigo usando em programação procedural.
    Fora isso, parabéns!

  • Mário Santos January 27, 2009

    Marcelo, se eu usasse a palavra método 98% das pessoas que se estao a iniciar em OOP não iriam compreender…hehehe, mas é na realidade um método… se reparares eu começei o tutorial a falar de funções e junto ao final ja falava em métodos/funções… tudo por ser mais facil de compreender… :P

    Mas valeu pela nota!

    Abraço!

  • Internetagentur February 3, 2009

    Ich muss jetzt auch zusätzlich noch AS3 lernen, da die Anfragen diesbezüglich immer mehr bei uns werden. Wo findet man gute Tutorials zu diesem Thema?

  • Mário Santos February 4, 2009

    Hi Internetagentur!

    Sie haben viele gute Ressourcen auf der Adobe Website, wie http://www.adobe.com/devnet/flex/videotraining/ oder http://www.adobe.com/devnet/flex/ oder sogar http://www.adobe .com / DevNet / ActionScript /

    Danach gibt es mehrere große Blogs, wie http://ntt.cc, nur über die Google-Suche und finden Sie viele andere … sondern immer in Englisch ..

  • Luis Carlos - Brasil February 4, 2009

    Parabéns, ótima materia sobre OOP, vc tem ua ótima didática, deveria pensar em começar a gravar Screencast rsssss.
    Estou esperando a 3ª parte do tutorial AS3, pra quando sai? rssssss

    Abraços

  • Julio February 9, 2009

    EXCELENTE!!! justo lo que andaba buscando.

  • Roger apu June 26, 2010

    Oloco véi isso que é ter amor por ensinar :-S parabens

  • Ademar December 24, 2010

    Muito obrigado e parabéns pelo tutorial! Depois de pesquisar muito, encontrei em seu blog a melhor explicação sobre classes. Melhor inclusive do que o help oficial da adobe, em minha opinião. Também penso como você no que diz respeito a ensinar/explicar. As vezes a linguaguem “correta”, rigorasamente técnica, pode dificultar as coisas para quem está começando a entender. Utilizar metáforas, analogias e outros recursos pode ajudar muito. Acho que programadores em geral podem conhecer muito do código, mas não são muito práticos e objetivos quando precisam ensinar, creio que esse seja o motivo de divergências que ocorrem quando um usúario solicita uma aplicação e o programador apresenta algo diferente do solicitado. Eles não falam a mesma “lingua”.

Leave a Comment

Post