Introdução do ActionScript

Olá galera, hoje darei continuação ao tutorial de actionscript, começandocom um pouco de fundamento da programação;

Fundamentos de programação

Como o ActionScript é uma linguagem de programação, para conhecê-lo, primeiro é necessário compreender alguns conceitos gerais de programação de computador.

O que os programas de computador fazem

Em primeiro lugar, é bom saber o que é um programa de computador e o que ele faz. Um programa de computador consiste em dois aspectos principais:
• Ele é uma série de instruções ou etapas que o computador deve executar.
• Cada etapa envolve a manipulação de algumas informações ou dados.
Em termos gerais, um programa de computador é apenas uma série de comandos passo a passo que você fornece ao computador e ele executa. Cada comando é conhecido como instrução. Como você verá neste manual, no ActionScript, cada instrução é escrita com um ponto-e-vírgula no final.
Em essência, tudo o que uma determinada instrução faz em um programa é manipular alguns dados que estão armazenados na memória do computador. Em um caso simples, você pode instruir o computador a adicionar dois números e armazenar o resultado na memória. Em um caso mais complexo, imagine que existe um desenho de um retângulo em um lugar na tela e você quer escrever um programa a fim de movê-lo para outro lugar. O computador está mantendo controle de determinadas informações sobre o retângulo (as coordenadas x, y nas quais ele está localizado, sua largura, altura, cor etc.). Cada uma dessas informações está armazenada em um local na memória do computador. Um programa que move o retângulo para um local diferente deve ter etapas como “alterar a coordenada x para 200; alterar a coordenada y para 150” (ou seja, deve especificar novos valores a serem usados para as coordenadas x e y). É claro que o computador faz alguma coisa com esses dados para realmente transformar os números na imagem que aparece na tela; mas, para o nível de detalhe que nos interessa, basta saber que o processo de “mover um retângulo na tela”, na verdade, implica em alterar alguns dados na memória do computador.

Variáveis e constantes

Como a programação envolve principalmente a alteração de algumas informações na memória do computador, é preciso encontrar um meio de representar uma informação isolada no programa. Uma variável é um nome que representa um valor na memória do computador. Durante a escrita de instruções para manipular valores, o nome da variável é escrito no lugar do valor; sempre que se deparar com o nome da variável no seu programa, o computador consultará a memória e usará o valor que encontrar nela. Por exemplo, se você tiver duas variáveis chamadas value1 e value2, cada uma contendo um número, para adicionar esses dois números, você pode escrever a instrução:
value1 + value2
Quando executar as etapas, o computador verificará os valores de cada variável e os adicionará juntos.

No ActionScript 3.0, uma variável consiste em três partes diferentes:
• O nome da variável
• O tipo de dados que pode ser armazenado nela
• O valor real armazenado na memória do computador
Acabamos de ver como o computador usa o nome como alocador de espaço para o valor. O tipo de dados também é importante. Durante a criação de uma variável no ActionScript, você especifica o tipo de dados que ela conterá; a partir daí, as instruções do programa só podem armazenar esse tipo de dados na variável, e você pode manipular o valor usando as características específicas associadas a esse tipo de dados. No ActionScript, a criação de uma variável (conhecida como declarar a variável) requer o uso da instrução var:
var value1:Number;
Nesse caso, instruímos o computador a criar uma variável chamada value1, que contém apenas dados Number (“Number” é um tipo de dados específico definido no ActionScript). Você também pode armazenar um valor na variável imediatamente:
var value2:Number = 17;
No Adobe Flash CS4 Professional, existe outro meio de declarar uma variável. Durante a colocação de um símbolo de clipe de filme, símbolo de botão ou campo de texto no Palco, você pode lhe dar um nome de ocorrência no Inspetor de propriedades. Por baixo do pano, o Flash cria uma variável com o mesmo nome que o nome de ocorrência, que você pode usar no código do ActionScript para fazer referência a esse item do Palco. Assim, por exemplo, se você der a um símbolo de clipe de filme no Palco o nome de ocorrência rocketShip, sempre que usar a variável rocketShip no código do ActionScript, na verdade, estará manipulando esse clipe de filme.
Uma constante é muito semelhante a uma variável no sentido de que é um nome que representa um valor na memória do computador, com um tipo de dados específico. A diferença é que um valor só pode ser atribuído a uma constante uma única vez no processamento do aplicativo do ActionScript. Assim que é atribuído, o valor da constante é o mesmo em todo o aplicativo. A sintaxe para declarar uma constante é a mesma que para declarar uma variável, exceto que você usa a palavra-chave const em vez da palavra-chave var: const SALES_TAX_RATE:Number = 0.07;
Uma constante é útil para definir um valor que é usado em vários locais em um projeto e que não é alterado sob circunstâncias normais. O uso de uma constante em vez de um valor literal torna o código mais legível. Por exemplo, é mais fácil entender a finalidade de uma linha de código que multiplica um preço pela SALES_TAX_RATE, comparado a uma linha de código que multiplica o preço por 0,07. Além disso, se o valor definido por uma constante tiver de ser alterado e você usar uma constante que represente esse valor em todo o seu projeto, bastará alterar o valor em um único lugar (a declaração da constante), em vez de alterá-lo em vários locais como aconteceria se você usasse valores literais codificados.

Tipos de dados

No ActionScript, há vários tipos de dados que você pode usar como os tipos de dados da variável que você criar. Alguns deles podem ser entendidos como “simples” ou “fundamentais”:
• Seqüência de caracteres: um valor textual, como um nome ou o texto do capítulo de um livro
• Numérico: o ActionScript 3.0 inclui três tipos de dados específicos para dados numéricos:
• Número: qualquer valor numérico, incluindo valores com ou sem uma fração
• int: um inteiro (um número inteiro sem uma fração)
• uint: um inteiro “sem sinal”, que significa um número inteiro que não pode ser negativo

• Booleano: um valor do tipo verdadeiro ou falso, tal como se uma opção está ativa ou se dois valores são iguais
Os tipos de dados simples representam uma única informação: por exemplo, um único número ou uma única seqüência de texto. Entretanto, a maioria dos tipos de dados definidos no ActionScript poderia ser descrita como tipos de dados complexos, porque representam um conjunto de valores agrupados. Por exemplo, uma variável com o tipo de dados Date representa um valor único: um momento no tempo. No entanto, esse valor de data na verdade é representado com diversos valores: dia, mês, ano, horas, minutos, segundos etc., que são todos números individuais. Portanto, embora pensemos em uma data como um valor único (e a tratemos dessa forma, criando uma variável Date), internamente, o computador a entende como um grupo de diversos valores que, juntos, definem uma única data.
A maioria dos tipos de dados embutidos, bem como os definidos pelos programadores, são tipos de dados complexos.
Alguns tipos de dados complexos que talvez você conheça são:
• MovieClip: um símbolo de clipe de filme
• TextField: um campo de texto de entrada ou dinâmico
• SimpleButton: um símbolo de botão
• Date: informações sobre um momento único no tempo (uma data e hora)
Duas palavras que, em geral, são usadas como sinônimos de tipos de dados são classe e objeto. Uma classe é simplesmente a definição de um tipo de dados; é como um modelo para todos os objetos dos tipos de dados, é como dizer “todas as variáveis do tipo de dados Example têm estas características: A, B e C”. Um objeto, porém, é apenas uma ocorrência real de uma classe; uma variável cujo tipo de dados é MovieClip poderia ser descrita como um objeto MovieClip. Estas são formas diferentes de dizer a mesma coisa:
• O tipo de dados da variável myVariable é Number.
• A variável myVariable é uma ocorrência de Number.
• A variável myVariable é um objeto Number.
• A variável myVariable é uma ocorrência da classe Number

Trabalho com o objetos

O ActionScript é conhecido como uma linguagem de programação orientada a objetos. Programação orientada a objetos é simplesmente uma abordagem da programação, nada mais do que uma forma de organizar o código em um programa, usando objetos.
Anteriormente, definimos um programa de computador como uma série de etapas ou instruções que o computador executa. De forma conceitual, então, podemos imaginar um programa de computador como uma longa lista de instruções. Entretanto, na programação orientada a objetos, as instruções do programa são divididas em objetos diferentes, ou seja, o código é agrupado em blocos de funcionalidade, de forma que tipos relacionados de funcionalidade ou partes relacionadas de informação são agrupados em um único contêiner.
Na verdade, se você já trabalhou com símbolos no Flash, então está acostumado a trabalhar com objetos. Imagine que você definiu um símbolo de clipe de filme (digamos que seja o desenho de um retângulo) e colocou uma cópia dele no Palco. Esse símbolo de clipe de filme também é (literalmente) um objeto no ActionScript; é uma ocorrência da classe MovieClip.

Há diversas características do clipe de filme que você pode modificar. Por exemplo, quando ele é selecionado, há valores que você pode alterar no Inspetor de propriedades, como a coordenada x, sua largura ou vários ajustes de cor, como alterar seu alfa (transparência) ou aplicar um filtro de sombra. Outras ferramentas do Flash permitem fazer mais alterações, como usar a ferramenta Transformação livre para girar o retângulo. Tudo o que é possível fazer para modificar um símbolo de clipe de filme no ambiente de autoria do Flash também pode ser feito no ActionScript, alterando as partes dos dados que são colocadas em um único pacote chamado objeto MovieClip.
Na programação orientada a objetos do ActionScript, há três tipos de características que qualquer classe pode incluir:
• Propriedades
• Métodos
• Eventos
Juntos, esses elementos ajudam a gerenciar as partes dos dados usadas pelo programa e a decidir quais ações são executadas em uma determinada ordem.

Propriedades

Uma propriedade representa uma das partes dos dados que são compactados em um objeto. Um objeto de música pode ter propriedades chamadas artist e title; a classe MovieClip tem propriedades como rotation, x, width e alpha. As propriedades são tratadas como variáveis individuais; na verdade, elas podem ser entendidas apenas como as variáveis “filho” contidas em um objeto.
A seguir, apresentamos alguns exemplos de código do ActionScript que usa propriedades. Esta linha de código move o MovieClip chamado square para 100 pixels na coordenada x:
square.x = 100;
Este código usa a propriedade de rotação fazendo com que o MovieClip square gire para corresponder à rotação do MovieClip triangle:
square.rotation = triangle.rotation;
Este código altera a escala horizontal do MovieClip square para que ele fique uma vez e meia maior do que antes:
square.scaleX = 1.5;
Observe a estrutura comum: você usa uma variável (square, triangle) como o nome do objeto, seguido de um ponto (.) e, depois, o nome da propriedade (x, rotation, scaleX). O ponto, conhecido como operador ponto, é usado para indicar que você está acessando um dos elementos filho de um objeto. A estrutura inteira reunida, “nome da variávelponto-nome da propriedade”, é usada como uma única variável, como um nome para um único valor na memória do computador.

Métodos

Um method é uma ação que pode ser executada por um objeto. Por exemplo, se você criou um símbolo de clipe de filme no Flash com vários quadros-chave e animação em sua linha de tempo, esse clipe de filme pode ser reproduzido, parar ou ser instruído a mover o indicador de reprodução para um quadro específico.
Este código instrui o MovieClip chamado shortFilm a iniciar a reprodução:
shortFilm.play();
Esta linha faz o MovieClip chamado shortFilm parar a reprodução (o indicador de reprodução pára; é como pausar um vídeo):
shortFilm.stop();

Este código faz um MovieClip chamado shortFilm mover o indicador de reprodução para o Quadro 1 e parar a
reprodução (é como retroceder um vídeo):
shortFilm.gotoAndStop(1);
Como você pode ver, os métodos, assim como as propriedades, são acessados escrevendo o nome do objeto (uma variável), um ponto e o nome do método seguido de parênteses. Os parênteses são uma forma de indicar que você está chamando o método ou, em outras palavras, instruindo o objeto a executar aquela ação. Às vezes, os valores (ou as variáveis) são colocados entre parênteses, como uma forma de passar adiante informações adicionais necessárias para executar a ação. Esses valores são conhecidos como parâmetros de método. Por exemplo, o método gotoAndStop() precisa saber para qual quadro deve ir, por isso requer um único parâmetro entre parênteses. Outros métodos, como play() e stop(), são auto-explicativos, por isso não requerem informações extras. No entanto, eles ainda são escritos com parênteses.
Diferentemente das propriedades (e variáveis), os métodos não são usados como alocadores de espaço de valor.
Entretanto, alguns métodos podem executar cálculos e retornar um resultado que pode ser usado como uma variável.
Por exemplo, o método toString() da classe Number converte o valor em sua representação de texto:
var numericData:Number = 9;
var textData:String = numericData.toString();
Por exemplo, você usaria o método toString() se quisesse exibir o valor de uma variável Number em um campo de texto na tela. A propriedade text da classe TextField (que representa o conteúdo real do texto exibido na tela) é definida como uma String, por isso pode conter apenas valores de texto. Esta linha de código converte o valor numérico na variável numericData em texto e faz com que apareça na tela, no objeto TextField chamado calculatorDisplay:
calculatorDisplay.text = numericData.toString();

Eventos

Descrevemos um programa de computador como uma série instruções que o computador executa em etapas. Alguns programas de computador simples consistem em nada mais do que algumas etapas que ele executa e depois é encerrado. Entretanto, os programas do ActionScript são criados para continuar a execução e esperar a entrada do usuário ou a ocorrência de outras coisas. Os eventos são mecanismos que determinam quais instruções o computador executa em um determinado momento.
Basicamente, os eventos são fenômenos que acontecem, sobre os quais o ActionScript é informado e aos quais pode responder. Muitos eventos estão relacionados à interação do usuário, como quando um usuário clica em um botão ou pressiona uma tecla no teclado, mas também há outros tipos. Por exemplo, se você usar o ActionScript para carregar uma imagem externa, há um evento que poderá avisá-lo quando o carregamento da imagem for concluído. Em essência, quando um programa ActionScript é executado, o Adobe Flash Player e o Adobe AIR aguardam determinados eventos e, então, executam o código ActionScript específico definido para esses eventos.

Tratamento de eventos básico

A técnica para especificar determinadas ações que devem ser executadas em resposta a eventos específicos é conhecida como tratamento de eventos. Durante a escrita do código do ActionScript para executar o tratamento de eventos, há três elementos importantes a serem identificados:
• A origem do evento: para qual objeto o evento deverá ocorrer? Por exemplo, qual botão será clicado ou qual objeto Loader está carregando a imagem? A origem do evento também é conhecida como destino do evento, porque é o objeto para o qual o evento é destinado pelo Flash Player ou AIR (ou seja, onde o evento realmente acontece).
• O evento: o que irá acontecer, a qual fenômeno você deseja responder? É importante identificar isso, porque muitos objetos acionam diversos eventos.

• A resposta: qual ou quais etapas você deseja executar quando o evento acontecer?
Sempre que você escrever código do ActionScript para manipular eventos, ele deve incluir estes três elementos, e o código deve seguir a estrutura básica (os elementos em negrito são alocadores de espaço que você preenche conforme o caso específico):
function eventResponse(eventObject:EventType):void
{
// Actions performed in response to the event go here.
}
eventSource.addEventListener(EventType.EVENT_NAME, eventResponse);
Esse código faz duas coisas. Primeiro, ele define uma função, que é a forma de especificar as ações que você deseja executar em resposta ao evento. Em seguida, o método addEventListener() do objeto de origem é chamado basicamente inscrevendo a função do evento especificado para que, quando o evento acontecer, as ações da função sejam executadas. Vejamos cada uma dessas partes com mais detalhes.
Uma função fornece um meio de agrupar as ações, com um único nome, que é como um nome de atalho, para executar as ações. Ela é idêntica a um método, exceto que não está necessariamente associada a uma classe específica (na verdade, um método poderia ser definido como uma função associada a uma classe específica). Durante a criação de uma função para tratamento de eventos, você deve escolher o nome da função (chamada de eventResponse neste caso). Você também deve especificar um parâmetro (chamado eventObject neste exemplo). A especificação de um parâmetro de função é como declarar uma variável, por isso você também deve indicar o tipo de dados do parâmetro. (Neste exemplo, o tipo de dados do parâmetro é EventType.)
Cada tipo de evento que você deseja escutar é associado a uma classe do ActionScript. O tipo de dados que você define para o parâmetro de função é sempre a classe associada ao evento específico ao qual deseja responder. Por exemplo, um evento click (acionado quando o usuário clica em um item com o mouse) é associado à classe MouseEvent. Para escrever uma função de ouvinte para um evento click, você define essa função com um parâmetro com o tipo de dados MouseEvent. Finalmente, entre chaves ({ … }), você escreve as instruções que deseja que o computador execute quando o evento ocorrer.
Depois de escrever a função de tratamento de eventos, é necessário informar ao objeto de origem de evento (o objeto para o qual o evento acontece, por exemplo, o botão) que você deseja que a função seja chamada quando o evento ocorrer. É possível fazer isso chamando o método addEventListener() desse objeto (todos os objetos que possuem eventos também têm um método addEventListener()). O método addEventListener() usa dois parâmetros:
• O primeiro é o nome do evento específico ao qual você deseja responder. Novamente, cada evento é afiliado a uma classe específica, e essa classe terá um valor especial predefinido para cada evento (como se fosse o próprio nome exclusivo do evento, que você deve usar para o primeiro parâmetro).
• O segundo é o nome da função de resposta do evento. Observe que um nome de função é escrito sem parênteses quando transmitido como um parâmetro.

Exame do processo de tratamento de eventos

Veja a seguir uma descrição passo a passo do processo que acontece durante a criação de um ouvinte de eventos. Neste caso, é um exemplo de criação de uma função de ouvinte que é chamada quando um objeto myButton é clicado.
O código real escrito pelo programador é o seguinte:

function eventResponse(event:MouseEvent):void
{
// Actions performed in response to the event go here.
}
myButton.addEventListener(MouseEvent.CLICK, eventResponse);
Apresentaremos a seguir o funcionamento desse código, quando executado no Flash Player. O comportamento é o mesmo no Adobe AIR:
1 Quando o arquivo SWF é carregado, o Flash Player registra o fato de que há uma função chamada
eventResponse().

img3

2 Em seguida, o Flash Player executa o código (especificamente, as linhas de código que não estão contidas em uma função). Neste caso, é apenas uma linha de código: chamar o método addEventListener() no objeto de origem
do evento (chamado myButton) e transmitir a função eventResponse como um parâmetro.

img4

a Internamente, myButton tem uma lista de funções que estão ouvindo cada um de seus eventos, por isso quando seu método addEventListener() é chamado, myButtonarmazena a função eventResponse() na lista de ouvintes de eventos.

img5

3 Em algum momento, o usuário clica no objeto myButton, acionando o evento click (identificado como MouseEvent.CLICK no código).

img6

Então, acontece o seguinte:
a O Flash Player cria um objeto, uma ocorrência da classe associada ao evento em questão (MouseEvent, no exemplo citado). Para muitos eventos, essa será uma ocorrência da classe Event; para eventos do mouse, será uma ocorrência de MouseEvent e, para outros eventos, será uma ocorrência da classe associada a esse evento.
Esse objeto criado é conhecido como o objeto de evento e contém informações específicas sobre o evento que ocorreu: qual é o tipo de evento, onde ele ocorreu e outras informações específicas de evento se aplicável.

img7

b Em seguida, o Flash Player verifica a lista de ouvintes de eventos armazenada por myButton. Ele verifica todas essas funções, chamando uma de cada vez e transmitindo o objeto de evento para a função como um parâmetro.
Como a função eventResponse() é um dos ouvintes de myButton, como parte desse processo, o Flash Player chama a função eventResponse().

img8

c Quando a função eventResponse() é chamada, o código nela é executado e as ações especificadas são realizadas.

img9

Exemplos de tratamento de eventos

A seguir, mostramos alguns exemplos mais concretos de eventos para lhe dar uma idéia de alguns elementos de eventos comuns e as possíveis variações disponíveis durante a escrita do código de tratamento de eventos:
• Clicar em um botão para iniciar a reprodução do clipe de filme atual. No exemplo a seguir, playButton é o nome da ocorrência do botão, e this é um nome especial que significa “o objeto atual”:
this.stop();
function playMovie(event:MouseEvent):void
{
this.play();
}
playButton.addEventListener(MouseEvent.CLICK, playMovie);
• Detectar tipos em um campo de texto: Neste exemplo, entryText é um campo de texto de entrada, e outputText é um campo de texto dinâmico:
function updateOutput(event:TextEvent):void
{
var pressedKey:String = event.text;
outputText.text = “You typed: ” + pressedKey;
}
entryText.addEventListener(TextEvent.TEXT_INPUT, updateOutput);
• Clicar em um botão para navegar em uma URL. Nesse caso, linkButton é o nome de ocorrência do botão:
function gotoAdobeSite(event:MouseEvent):void
{
var adobeURL:URLRequest = new URLRequest(“http://www.adobe.com/”);
navigateToURL(adobeURL);
}
linkButton.addEventListener(MouseEvent.CLICK, gotoAdobeSite);

Criar ocorrências de objetos

Obviamente, para que você possa usar um objeto no ActionScript, primeiro, ele deve existir. Uma parte da criação de um objeto é declarar uma variável; porém, a declaração de uma variável só cria um lugar vazio na memória do computador. Você deve atribuir um valor real à variável, isto é, criar um objeto e armazená-lo na variável, antes de tentar usá-lo ou manipulá-lo. O processo de criar um objeto é conhecido como instanciar o objeto, em outras palavras, criar uma ocorrência de uma classe específica.
Existe uma maneira simples de criar uma ocorrência de objeto que não envolve o ActionScript. No Flash, quando você coloca um símbolo de clipe de filme, símbolo de botão ou campo de texto no Palco e lhe atribui um nome de ocorrência no Inspetor de propriedades, o Flash automaticamente declara uma variável com esse nome de ocorrência, cria uma ocorrência de objeto e armazena o objeto na variável. Da mesma forma, quando você usa a linguagem MXML para criar um componente no Adobe Flex Builder (codificando uma tag MXML ou colocando o componente no editor no modo Design) e lhe atribui uma ID (no markup MXML ou na exibição Propriedades do Flex), essa ID se torna o nome de uma variável do ActionScript, e uma ocorrência do componente é criada e armazenada nessa variável.
Entretanto, nem sempre você criará um objeto visualmente. Também há várias formas de criar ocorrências de objeto usando somente o ActionScript. Primeiro, com vários tipos de dados do ActionScript, você pode criar uma ocorrência usando uma expressão literal, um valor escrito diretamente no código do ActionScript. Eis alguns exemplos:
• Valor numérico literal (insere o número diretamente):
var someNumber:Number = 17.239;
var someNegativeInteger:int = -53;
var someUint:uint = 22;
• Valor da seqüência de caracteres literal (envolve o texto com aspas duplas):
var firstName:String = “George”;
var soliloquy:String = “To be or not to be, that is the question…”;
• Valor booleano literal (usa os valores literais true ou false):
var niceWeather:Boolean = true;
var playingOutside:Boolean = false;
• Valor Array literal (envolve uma lista de valores separados por vírgula entre colchetes):
var seasons:Array = [“spring”, “summer”, “autumn”, “winter”];
• Valor XML literal (insere o XML diretamente):
var employee:XML = <employee>
<firstName>Harold</firstName>
<lastName>Webster</lastName>
</employee>;
O ActionScript também define expressões literais para os tipos de dados Array, RegExp, Object e Function. Para obter detalhes sobre essas classes, consulte “Trabalho com matrizes”  logo adiante, “Uso de expressões regulares” na página 209 e “Tipo de dados Object” também adiante.
Para qualquer outro tipo de dados, para criar uma ocorrência de objeto, use o operador new como o nome da classe, desta forma:
var raceCar:MovieClip = new MovieClip();
var birthday:Date = new Date(2006, 7, 9);
O ato de criar de um objeto usando o operador new, muitas vezes, é descrito como “chamar o construtor da classe” Um construtor é um método especial que é chamado como parte do processo de criar uma ocorrência de uma classe.
Observe que, ao criar uma ocorrência dessa forma, você coloca parênteses depois do nome da classe e, às vezes, especifica valores de parâmetro (duas ações que também são executadas ao chamar um método).

Observe que, mesmo para esses tipos de dados que permitem criar ocorrências usando uma expressão literal, você ainda pode usar o operador new para criar uma ocorrência de objeto. Por exemplo, as duas linhas de código a seguir fazem exatamente a mesma coisa:
var someNumber:Number = 6.33;
var someNumber:Number = new Number(6.33);
É importante se familiarizar com a forma como new ClassName() cria objetos. Se for necessário criar uma ocorrência de qualquer tipo de dados ActionScript que não tenha uma representação visual (e não possa ser criada colocando um item no Palco do Flash ou no modo Design do editor XML do Flex Builder), isso só será possível criando o objeto diretamente no ActionScript pelo uso do operador new.
No Flash especificamente, o operador new também pode ser usado para criar uma ocorrência de um símbolo de clipe de filme que é definido na Biblioteca mas não é colocado no Palco. Para obter mais informações sobre isso, consulte “Criação de objetos MovieClip com o ActionScript”.

Elementos de programa comuns

Além de declarar variáveis, criar ocorrências de objetos e manipular objetos usando suas propriedades e métodos, há outros blocos de construção que você precisa usar para criar um programa do ActionScript.

Operadores

Os operadores são símbolos (ou, ocasionalmente, palavras) essenciais que são usados para executar cálculos. Eles são muito usados em operações matemáticas e também para comparar valores. Como regra geral, um operador usa um ou mais valores e “obtém” um único resultado. Por exemplo:
• O operador de adição (+) adiciona dois valores, tendo como resultado um único número:
var sum:Number = 23 + 32;
• O operador de multiplicação (*) multiplica dois valores, tendo como resultado um único número:
var energy:Number = mass * speedOfLight * speedOfLight;
• O operador de igualdade (==) compara se dois valores são iguais, tendo como resultado um único valor verdadeiro
ou falso (booleano):
if (dayOfWeek == “Wednesday”)
{
takeOutTrash();
}
Conforme mostrado aqui, o operador de igualdade e os outros operadores de “comparação”, em geral, são usados com a instrução if para determinar se algumas instruções devem ser executadas.
Para obter detalhes e exemplos do uso de operadores, consulte “Operadores” mais a frente.

Comentários

Durante a escrita do ActionScript, muitas vezes, você desejará fazer anotações, talvez para explicar como algumas linhas de código funcionam e por que escolheu uma determinada opção. Os comentários de código são uma ferramenta que você pode usar para escrever um texto que o computador deve ignorar no seu código. O ActionScript inclui dois tipos de comentários:
• Comentário de uma linha: um comentário de uma linha é criado colocando duas barras em qualquer lugar de uma linha. Tudo que vier depois das barras até o fim da linha será ignorado pelo computador:
// This is a comment; it’s ignored by the computer.
var age:Number = 10; // Set the age to 10 by default.
• Comentário de várias linhas: um comentário de várias linhas inclui um marcador de comentário inicial (/*), o conteúdo do comentário e um marcador de comentário final (*/). Tudo entre os marcadores inicial e final é ignorado pelo computador, independentemente do número de linhas que o comentário contém:
/*
This might be a really long description, perhaps describing what
a particular function is used for or explaining a section of code.
In any case, these lines are all ignored by the computer.
*/
Outro uso comum dos comentários é “desativar” temporariamente uma ou mais linhas de código, por exemplo, se você estiver testando uma forma diferente de fazer algo ou tentando descobrir por que um código do ActionScript não está funcionando conforme o esperado.

Controle do fluxo

Muitas vezes em um programa, você desejará repetir determinadas ações, executar apenas algumas e outras não, executar ações conforme condições específicas etc. O controle de fluxo é o controle sobre as ações que são executadas.
Há vários tipos de elementos de controle de fluxo disponíveis no ActionScript.
• Funções: as funções são como atalhos: fornecem um meio de agrupar uma série de ações sob um único nome e podem ser usadas para realizar cálculos. As funções são especialmente importantes para tratar eventos, mas também são usadas como uma ferramenta geral para agrupar uma série de instruções. Para obter mais informações sobre funções, consulte “Funções”.
• Loops: as estruturas de loop permitem designar um conjunto de instruções que o computador executará por um determinado número de vezes ou até que alguma condição seja alterada. Com freqüência, os loops são usados para manipular vários itens relacionados, empregando uma variável cujo valor é alterado sempre que o computador completa o loop. Para obter mais informações sobre loops, consulte “Repetição” logo a seguir.
• Instruções condicionais: as instruções condicionais fornecem um meio de designar algumas instruções que são executadas somente sob determinadas circunstâncias ou de fornecer conjuntos alternativos de instruções para condições diferentes. O tipo mais comum de instrução condicional é a instrução if. A instrução if verifica um valor ou uma expressão entre parênteses. Se o valor for true, as linhas de código entre chaves são executadas; caso contrário, elas são ignoradas. Por exemplo:
if (age < 20)
{
// show special teenager-targeted content
}
A parceira da instrução if, a instrução else, permite designar instruções alternativas a serem executadas caso a condição não seja true:

if (username == “admin”)
{
// do some administrator-only things, like showing extra options
}
else
{
// do some non-administrator things
}
Para obter mais informações sobre instruções condicionais, consulte “Condicionais”.

Exemplo: Peça de portfólio de animação

Este exemplo foi criado para oferecer-lhe uma oportunidade de ver pela primeira vez como é possível juntar partes do ActionScript para obter um aplicativo completo, se não robusto, do ActionScript. A peça de portfólio de animação é um exemplo de como você pode usar uma animação linear existente (por exemplo, uma peça criada para um cliente) e adicionar alguns elementos interativos menores apropriados para incorporar essa animação em um portfólio on-line.
O comportamento interativo que adicionaremos à animação incluirá dois botões nos quais o espectador poderá clicar: um para iniciar a animação e outro para navegar em uma URL separada (como o menu do portfólio ou a home page do autor).
O processo de criar essa peça pode ser dividido nestas seções principais:
1 Preparar o arquivo FLA para adicionar elementos interativos e do ActionScript.
2 Criar e adicionar os botões.
3 Escrever o código do ActionScript.
4 Testar o aplicativo.

Preparação para adicionar interatividade

Antes que possamos adicionar elementos interativos à nossa animação, é bom configurar o arquivo FLA criando alguns locais para adicionar o novo conteúdo. Isso inclui a criação de espaço real no Palco onde os botões podem ser colocados e também a criação de “espaço” no arquivo FLA para manter separados os itens diferentes.

Para configurar o FLA para adicionar elementos interativos:

1 Se você ainda não tiver uma animação linear à qual irá adicionar a interatividade, crie um novo arquivo FLA com uma animação simples como uma interpolação de movimento ou uma interpolação de forma. Caso contrário, abra o arquivo FLA contendo a animação que você está exibindo no projeto e salve-o com um novo nome para criar um novo arquivo funcional.
2 Decida o local na tela em que você deseja que os dois botões apareçam (um para iniciar a animação e outro para vincular ao portfólio do autor ou à home page). Se necessário, limpe o Palco ou adicione espaço para esse novo conteúdo. Se a animação já não tiver uma, você pode querer criar uma tela de abertura no primeiro quadro (provavelmente, você deslocará a animação para que ela comece no Quadro 2 ou depois).
3 Adicione uma nova camada, acima das outras camadas na Linha de tempo, e renomei-a como buttons. Essa será a camada na qual você adicionará os botões.
4 Adicione uma nova camada, acima das camadas de botões, e renomei-a como actions. Nela, você adicionará o código do ActionScript para seu aplicativo.

Criação e adição de botões

Em seguida, precisamos realmente criar e posicionar os botões que serão a parte central do nosso aplicativo interativo.

Para criar e adicionar botões ao FLA:

1 Usando as ferramentas de desenho, crie a aparência visual do seu primeiro botão (o botão “reproduzir”) na camada de botões. Por exemplo, você pode desenhar uma figura oval na horizontal com texto em cima.
2 Usando a ferramenta Seleção, selecione todas as partes gráficas do botão sozinho.
3 No menu principal, escolha Modificar > Converter em símbolo.
4 Na caixa de diálogo, escolha Botão como o tipo de símbolo, dê um nome ao símbolo e clique em OK.
5 Com o botão selecionado, no Inspetor de propriedades, dê ao botão o nome de ocorrência playButton.
6 Repita as etapas de 1 a 5 para criar o botão que levará o espectador à home page do autor. Chame este botão de homeButton.

Gravação do código

O código do ActionScript para este aplicativo pode ser dividido em três conjuntos de funcionalidade, mas todos serão inseridos no mesmo lugar. As três coisas que o código precisa fazer são:
• Parar o indicador de reprodução assim que o arquivo SWF carregar (quando o indicador de reprodução entrar no Quadro 1).
• Monitorar um evento para iniciar a reprodução do arquivo SWF quando o usuário clicar no botão de reprodução.
• Monitorar um evento para enviar o navegador à URL apropriada quando o usuário clicar no botão da home page do autor.

Para criar um código que pare o indicador de reprodução quando ele entrar no Quadro 1:

1 Selecione o quadro-chave no Quadro 1 da camada de ações.
2 Para abrir o painel Ações, no menu principal, escolha Janela > Ações.
3 No painel Script, digite o seguinte código:
stop();

Para escrever código para iniciar a animação quando o botão de reprodução for clicado:

1 No fim do código digitado nas etapas anteriores, adicione duas linhas vazias.
2 Digite o seguinte código na parte inferior do script:
function startMovie(event:MouseEvent):void
{
this.play();
}
Este código define uma função chamada startMovie(). Quando startMovie() é chamado, elefaz com que a linha de tempo principal comece a reproduzir.
3 Na linha seguinte ao código adicionado na etapa anterior, digite esta linha de código:
playButton.addEventListener(MouseEvent.CLICK, startMovie);
Esta linha de código registra a função startMovie() como um ouvinte para o evento click de playButton. Em outras palavras, com ela, sempre que o botão chamado playButton é clicado, a função startMovie() é chamada.

Para escrever o código por meio do qual o navegador acessa uma URL quando o botão da home page for clicado:

1 No fim do código digitado nas etapas anteriores, adicione duas linhas vazias.
2 Digite este código na parte inferior do script:
function gotoAuthorPage(event:MouseEvent):void
{
var targetURL:URLRequest = new URLRequest(“http://example.com/&#8221;);
navigateToURL(targetURL);
}
Este código define uma função chamada gotoAuthorPage(). Essa função primeiro cria uma ocorrência de URLRequest representando a URL http://example.com/ e depois repassa essa URL para a função navigateToURL(), fazendo o navegador do usuário abrir nessa URL.
3 Na linha seguinte ao código adicionado na etapa anterior, digite esta linha de código:
homeButton.addEventListener(MouseEvent.CLICK, gotoAuthorPage);
Esta linha de código registra a função gotoAuthorPage() como um ouvinte para o evento click de homeButton.
Em outras palavras, com ela, sempre que o botão chamado homeButton é clicado, a função gotoAuthorPage() é chamada.

Teste do aplicativo

Neste momento, o aplicativo deve estar funcionando completamente. Vamos testá-lo para ver se isso é verdade.

Para testar o aplicativo:

1 Do menu principal, escolha Controlar > Testar filme. O Flash cria o arquivo SWF e o abre em uma janela do Flash Player.
2 Tente os dois botões para verificar se eles agem conforme o esperado.
3 Se os botões não funcionarem, veja algumas coisas que você pode verificar:
• Os dois botões têm nomes de ocorrência distintos?
• As chamadas de método addEventListener() usam os mesmos nomes que os nomes de ocorrência dos botões?
• Os nomes de evento corretos foram usados nas chamadas de método addEventListener()?
• Foi especificado o parâmetro correto para cada uma das funções? (As duas devem ter um único parâmetro com o tipo de dados MouseEvent.)
Tudo isso, além de outros erros possíveis, gera uma mensagem de erro quando você escolhe o comando Testar filme ou clica no botão. Verifique se há erros de compilação no painel Erros do compilador (aqueles que acontecem quando você escolhe Testar filme pela primeira vez) e verifique se há erros de tempo de execução no painel Saída (erros que acontecem quando o SWF é reproduzido, tal como quando você clica em um botão).

Criação de aplicativos com o ActionScript

O processo de escrever no ActionScript para criar um aplicativo vai além de apenas conhecer a sintaxe e os nomes das classes que serão usadas. Embora a maioria das informações neste manual seja destinada a esses dois tópicos (sintaxe e uso de classes do ActionScript), outras informações também são úteis, tal como quais programas podem ser usados para escrever código do ActionScript, como o ele pode ser organizado e incluído em um aplicativo e quais etapas devem ser executadas após o desenvolvimento do aplicativo do ActionScript.

Opções para organizar seu código

Você pode usar o código do ActionScript 3.0 para acionar tudo, desde simples animações gráficas até sistemas complexos de processamento de transações de cliente-servidor. Dependendo do tipo de aplicativo que está sendo criado, você pode preferir usar uma ou mais dessas formas de incluir o ActionScript no seu projeto.

Armazenamento de código em quadros em uma linha de tempo do Flash

No ambiente de autoria do Flash, você pode adicionar código do ActionScript a qualquer quadro na linha de tempo.
Esse código será executado enquanto o filme estiver sendo reproduzido, quando o indicador de reprodução entrar nesse quadro.
A colocação de código do ActionScript em quadros fornece um meio simples de adicionar comportamentos a aplicativos criados na ferramenta de autoria do Flash. Você pode adicionar código a qualquer quadro na linha de tempo principal ou na linha de tempo de qualquer símbolo do MovieClip. Entretanto, essa flexibilidade tem um preço.
Durante a criação de aplicativos grandes, é fácil perder o controle de quais quadros contêm quais scripts. Com o tempo, pode ficar mais difícil manter o aplicativo.
Muitos desenvolvedores simplificam a organização do código do ActionScript na ferramenta de autoria do Flash, colocando o código somente no primeiro quadro de uma linha de tempo ou em uma camada específica no documento Flash. Isso facilita a localização e manutenção do código nos arquivos FLA do Flash. Entretanto, para usar o mesmo código em outro projeto Flash, é necessário copiar e colar o código no novo arquivo.
Para poder usar o código do ActionScript em outros projetos Flash no futuro, você deve armazená-lo em arquivos externos do ActionScript (arquivos de texto com a extensão .as).

Armazenamento de código em arquivos do ActionScript

Se o seu projeto envolve uma quantidade significativa de código do ActionScript, a melhor maneira de organizar seu código é em arquivos de origem do ActionScript separados (arquivos de texto com a extensão .as). Um arquivo do ActionScript pode ser estruturado de duas formas, dependendo da maneira como você pretende usá-lo no aplicativo.
• Código do ActionScript não estruturado: linhas de código do ActionScript, incluindo instruções ou definições de funções, escritas como se fossem inseridas diretamente em um script de linha de tempo, arquivo MXML etc.
O ActionScript escrito dessa forma pode ser acessado usando a instrução include no ActionScript ou a tag <mx:Script> no MXML do Adobe Flex. A instrução include do ActionScript faz com que o conteúdo de um arquivo externo do ActionScript seja inserido em um local específico e dentro de um determinado escopo em um script, como se fosse inserido diretamente. Na linguagem MXML do Flex, a tag <mx:Script> permite especificar um atributo de origem que identifica um arquivo externo do ActionScript a ser carregado nesse momento no aplicativo. Por exemplo, a seguinte tag carregará um arquivo externo do ActionScript chamado Box.as:
<mx:Script source=”Box.as” />
• Definição da classe do ActionScript: uma definição de uma classe do ActionScript, incluindo suas definições de método e propriedade.
Durante a definição de uma classe, é possível acessar o código do ActionScript na classe, criando uma ocorrência da classe e usando suas propriedades, seus métodos e eventos, assim como faria com qualquer classe embutida do ActionScript. Isso requer duas partes:
• Use a instrução import para especificar o nome completo da classe, para que o compilador do ActionScript saiba onde encontrá-la. Por exemplo, se você deseja usar a classe MovieClip no ActionScript, primeiro é necessário importar essa classe usando seu nome completo, incluindo o pacote e a classe:

import flash.display.MovieClip;
Se preferir, você pode importar o pacote que contém a classe MovieClip, que é equivalente a escrever instruções import separadas para cada classe no pacote:
import flash.display.*;
As únicas exceções à regra de que uma classe deve ser importada se for referida no código são as classes de nível superior, que não são definidas em um pacote.
Nota: No Flash, para scripts anexados aos quadros na Linha de tempo, as classes embutidas (nos pacotes flash.*) são importadas automaticamente. Entretanto, sempre que você escrever suas próprias classes, se estiver trabalhando com componentes de autoria Flash (os pacotes fl.*) ou se estiver trabalhando no Flex, precisará importar explicitamente qualquer classe para escrever um código que crie ocorrências dessa classe.
• Escreva um código que se refira especificamente ao nome da classe (normalmente declarando uma variável com essa classe como seu tipo de dados e criando uma ocorrência da classe a ser armazenada na variável). Fazendo referência a outro nome de classe no código do ActionScript, você instrui o compilador a carregar a definição dessa classe. Por exemplo, dada uma classe externa chamada Box, esta instrução faz com que uma nova ocorrência da classe Box seja criada:
var smallBox:Box = new Box(10,20);
Quando encontra a referência à classe Box pela primeira vez, o compilador pesquisa o código-fonte carregado para localizar a definição dessa classe.

Escolha da ferramenta correta

Dependendo da necessidade do seu projeto e dos recursos disponíveis, é possível usar uma das diversas ferramentas (ou várias ferramentas combinadas) para escrever e editar o código do ActionScript.

Ferramenta de autoria do Flash

Além de seus recursos gráficos e de criação de animações, o Adobe Flash CS4 Professional inclui ferramentas para trabalhar com códigos do ActionScript, anexados a elementos em um arquivo FLA ou em arquivos externos, exclusivos do ActionScript. A ferramenta de autoria do Flash é ideal para projetos que envolvem grande quantidade de animação ou vídeo, ou quando você deseja criar a maior parte dos ativos gráficos sozinho, especialmente projetos com uma interação mínima do usuário ou funcionalidade que exija o ActionScript. Outro motivo para escolher essa ferramenta ao desenvolver projetos do ActionScript é caso prefira criar ativos visuais e escrever código no mesmo aplicativo. Você também pode usar a autoria do Flash se quiser usar componentes da interface do usuário pré-criados, mas com um SWF menor ou uma atribuição de capa visual mais fácil são prioridades essenciais para seu projeto.
O Adobe Flash CS4 Professional inclui duas ferramentas para escrever códigos do ActionScript:
• Painel Ações: disponível para trabalhar em um arquivo FLA, este painel permite escrever código do ActionScript anexado a quadros em uma linha de tempo.
• Janela Script: a janela Script é um editor de texto dedicado para trabalhar com arquivos de código do ActionScript (.as).

Flex Builder

O Adobe Flex Builder é a principal ferramenta para criar projetos com a estrutura do Flex. Além do layout visual e das ferramentas de edição de MXML, o Flex Builder também inclui um editor do ActionScript, por isso ele pode ser usado para criar projetos do Flex ou somente ActionScript. Os aplicativos do Flex possuem várias vantagens, incluindo um rico conjunto de controles pré-criados da interface do usuário, controles flexíveis de layout dinâmico e mecanismos embutidos para trabalhar com fontes de dados externas e vincular dados externos a elementos da interface do usuário.
Entretanto, por causa do código adicional necessário para fornecer esses recursos, os aplicativos do Flex podem ter um arquivo SWF maior e não podem ser completamente encapados com tanta facilidade quanto seus equivalentes do Flash.
Use o Flex Builder se estiver criando aplicativos da Internet avançados, orientados a dados e cheios de recursos com o Flex e quiser editar código do ActionScript, código MXML e criar o layout do aplicativo visualmente, tudo com uma única ferramenta.

Editor do ActionScript de terceiros

Como os arquivos do ActionScript (.as) são armazenados como arquivos de texto simples, qualquer programa capaz de editar arquivos de texto sem formatação pode ser usado para escrever arquivos do ActionScript. Além dos produtos do ActionScript da Adobe, foram criados diversos programas de edição de texto de terceiros com recursos específicos do ActionScript. Você pode escrever um arquivo MXML ou classes do ActionScript usando qualquer programa de editor de texto. É possível, então, criar um aplicativo SWF (um aplicativo do Flex ou somente ActionScript) a partir desses arquivos usando o SDK do Flex, que inclui as classes de estrutura do Flex, além do compilador do Flex.
Opcionalmente, muitos desenvolvedores usam um editor do ActionScript de terceiros para escrever classes do ActionScript, junto com a ferramenta de autoria do Flash para criar conteúdo gráfico.
Você pode optar por usar um editor do ActionScript de terceiros se:
• Preferir escrever código do ActionScript em um programa separado junto com a criação de elementos visuais no Flash.
• Usar um aplicativo para programação que não seja do ActionScript (como criação de páginas HTML ou de aplicativos em outra linguagem de programação) e quiser usar o mesmo aplicativo para o código do ActionScript também.
• Quiser criar projetos do Flex ou somente ActionScript usando o SDK do Flex sem o Flash ou o Flex Builder.
Alguns dos notáveis editores de código que fornecem suporte específico ao ActionScript incluem:
• Adobe Dreamweaver® CS4
• ASDT
• FDT
• FlashDevelop
• PrimalScript
• SE|PY

O processo de desenvolvimento do ActionScript

Quer você tenha um projeto do ActionScript grande ou pequeno, o uso de um processo para criar e desenvolver seu aplicativo o ajudará a trabalhar com mais eficiência. As etapas a seguir descrevem um processo de desenvolvimento básico para criar um aplicativo que usa o ActionScript 3.0:
1 Crie seu aplicativo.
Você deve descrever seu aplicativo de alguma forma antes de começar a criá-lo.

2 Componha o código do ActionScript 3.0.
Você pode criar código do ActionScript usando o Flash, Flex Builder, Dreamweaver ou um editor de texto.
3 Crie um arquivo de aplicativo do Flash ou Flex para executar o código.
Na ferramenta de autoria do Flash, isso envolve a criação de um novo arquivo FLA, a definição de configurações de publicação, adição de componentes da interface do usuário ao aplicativo e a referência ao código do ActionScript. No ambiente de desenvolvimento do Flex, a criação de um novo aplicativo envolve a definição do aplicativo e a adição dos componentes da interface do usuário usando MXML e a referência ao código do ActionScript.
4 Publique e teste o aplicativo do ActionScript.
Isso significa executar o aplicativo de dentro do ambiente de desenvolvimento do Flex ou de autoria do Flash e verificar se ele faz tudo conforme o esperado.
Observe que não é preciso seguir essas etapas na ordem nem concluir uma etapa completamente antes de começar outra. Por exemplo, você pode criar uma tela do aplicativo (etapa 1) e imagens gráficas, botões etc. (etapa 3), antes de escrever código do ActionScript (etapa 2) e testar (etapa 4). Ou você pode criar parte disso e depois adicionar um botão ou um elemento da interface por vez, escrevendo o ActionScript para cada um e testando-o durante a criação. Embora seja útil lembrar desses quatro estágios do processo de desenvolvimento, no mundo real, costuma ser mais eficiente executar os estágios avançando e retrocedendo, conforme apropriado.

Criação de suas próprias classes

O processo de criar as classes que serão usadas nos projetos pode parecer assustador. Entretanto, a parte mais difícil da criação de uma classe é a tarefa de criá-la, identificando os métodos, as propriedades e os eventos que ela incluirá.

Estratégias para criar uma classe

O tópico de criação orientada a objetos é complexo; existem cargos totalmente dedicados ao estudo acadêmico e à prática profissional dessa disciplina. No entanto, apresentamos algumas sugestões de abordagens que podem ajudá-lo a começar.
1 Pense na função que as ocorrências dessa classe exercerão no aplicativo. Em geral, os objetos cumprem uma destas três funções:
• Objeto de valor: esses objetos servem basicamente como contêineres de dados, isto é, eles costumam ter diversas propriedades e menos métodos (ou, às vezes, nenhum método). Em geral, eles são representações de código de itens definidos claramente, como uma classe Song (representando uma única música do mundo real) ou classe Playlist (representando um grupo conceitual de músicas) em um aplicativo de player de música.
• Objeto de exibição: são os objetos que realmente aparecem na tela. Exemplos incluem elementos da interface do usuário como uma lista suspensa ou exibição de status, elementos gráficos como criaturas em um videogame etc.
• Estrutura do aplicativo: esses objetos exercem uma ampla gama de funções de suporte na lógica ou no processamento executados pelos aplicativos. Exemplos incluem um objeto que executa determinados cálculos em uma simulação biológica, um que é responsável por sincronizar valores entre um controle de mostrador e uma exibição de volume em um aplicativo de player de música, um que gerencia as regras em um videogame ou um que carrega uma imagem salva em um aplicativo de desenho.
2 Escolha a funcionalidade específica de que a classe precisará. Os diferentes tipos de funcionalidade, em geral, se tornam métodos da classe.

3 Se a classe for servir como um objeto de valor, decida quais dados as ocorrências incluirão. Esses itens são bons candidatos para propriedades.
4 Como a classe está sendo criada especificamente para seu projeto, o mais importante é fornecer a funcionalidade de que o aplicativo precisa. Talvez ajude responder a estas questões:
• Que informações o aplicativo irá armazenar, controlar e manipular? Decidir isso ajuda a identificar os objetos de valor e as propriedades que você deseja.
• Quais conjuntos de ações deverão ser executados, por exemplo, quando o aplicativo for carregado pela primeira vez, um botão for clicado, um filme parar de ser reproduzido etc.? Esses são bons candidatos para métodos (ou propriedades, se as “ações” envolverem apenas a alteração de valores individuais).
• Quais informações a classe deve saber para executar cada ação específica? Essas informações se tornam os parâmetros do método.
• Conforme o aplicativo executar seu trabalho, o que mudará na sua classe que outras partes do aplicativo deverá saber? Esses itens são bons candidatos para eventos.
5 Se houver um objeto existente semelhante àquele de que você precisa, mas que não tenha alguma funcionalidade adicional que você deseja adicionar, considere a criação de uma subclasse (uma classe que aproveite a funcionalidade de uma classe existente, em vez de definir todas as suas próprias funcionalidades). Por exemplo, se você quiser criar uma classe que seja um objeto visual na tela, pode usar o comportamento de um dos objetos de exibição existentes (por exemplo, Sprite ou MovieClip) como base para sua classe. Nesse caso, MovieClip (ou Sprite) seria a classe base, e sua classe estenderia essa classe. Para obter mais informações sobre a criação de uma subclasse, consulte “Herança” mais pra frente.

Escrita do código para uma classe

Depois de fazer um plano de criação para sua classe ou, pelo menos, ter uma idéia das informações sobre as quais ela deverá ter controle e quais ações deverão ser executadas, a sintaxe real da escrita de uma classe é bem direta.
Veja as etapas mínimas para criar sua própria classe do ActionScript:
1 Abra um novo documento de texto, em um programa específico do ActionScript como o Flex Builder ou o Flash, em uma ferramenta de programação geral como o Dreamweaver ou em qualquer programa que permita trabalhar com documento de texto sem formatação.
2 Insira uma ocorrência de class para definir o nome da classe. Para isso, digite as palavras public class, o nome da classe e as chaves que envolverão o conteúdo da classe (as definições de método e propriedade). Por exemplo:
public class MyClass
{
}
A palavra public indica que a classe pode ser acessada de qualquer outro código. Para obter alternativas, consulte “Atributos de espaço para nomes de controle de acesso”.
3 Digite uma instrução package para indicar o nome do pacote no qual sua classe se encontrará. A sintaxe é a palavra package, seguida do nome completo do pacote e das chaves (que envolverão o bloco da instrução class). Por exemplo, o código na etapa anterior seria alterado da seguinte forma:
package mypackage
{
public class MyClass
{
}
}

4 Defina cada propriedade na classe usando a instrução var dentro do corpo da classe; a sintaxe é a mesma usada para declarar qualquer variável (com a adição do modificador public). Por exemplo, a adição destas linhas entre as chaves de definição da classe criará propriedades chamadas textVariable, numericVariable e dateVariable:
public var textVariable:String = “some default value”;
public var numericVariable:Number = 17;
public var dateVariable:Date;
5 Defina cada método na classe usando a mesma sintaxe usada para definir uma função. Por exemplo:
• Para criar um método myMethod(), digite:
public function myMethod(param1:String, param2:Number):void
{
// do something with parameters
}
• Para criar um construtor (o método especial que é chamado como parte do processo de criar uma ocorrência de uma classe), crie um método cujo nome corresponda exatamente ao nome da classe:
public function MyClass()
{
// do stuff to set initial values for properties
// and otherwise set up the object
textVariable = “Hello there!”;
dateVariable = new Date(2001, 5, 11);
}
Se você não incluir um método construtor na classe, o compilador criará automaticamente um construtor vazio (sem nenhum parâmetro e nenhuma instrução) na sua classe.
Há mais alguns elementos de classe que você pode definir, que são mais complexos.
• Assessores são um cruzamento especial entre um método e uma propriedade. Durante a escrita do código para definir a classe, você escreve o assessor como um método para poder executar várias ações (em vez de apenas ler ou atribuir um valor, que é tudo o que você pode fazer ao definir uma propriedade). Entretanto, na criação de uma ocorrência da classe, você trata o assessor como uma propriedade, usando apenas o nome para ler ou atribuir o valor. Para obter mais informações, consulte “Métodos de acessor get e set”.
• Os eventos no ActionScript não são definidos usando uma sintaxe específica. Em vez disso, você define eventos na classe usando a funcionalidade da classe EventDispatcher para manter controle de ouvintes de evento e notificá-los dos eventos. Para obter mais informações sobre a criação de eventos nas suas próprias classes, consulte“Manipulação de eventos”.

Exemplo: Criação de um aplicativo básico

Você pode criar arquivos de código do ActionScript externo com uma extensão .as usando o Flash, Flex Builder, Dreamweaver ou qualquer editor de texto.
O ActionScript 3.0 pode ser usado em diversos ambientes de desenvolvimento de aplicativo, incluindo as ferramentas de autoria do Flash e o Flex Builder.
Esta seção apresenta as etapas de criação e de aprimoramento de um aplicativo ActionScript 3.0 simples usando a ferramenta de autoria do Flash ou o Flex Builder. O aplicativo que você criar apresentará um padrão simples para usar arquivos externos de classe do ActionScript 3.0 nos aplicativos Flash e Flex. Esse padrão se aplicará a todos os outros aplicativos de exemplo daqui em diante.

Criação do seu aplicativo do ActionScript

Você deve ter uma idéia do aplicativo que deseja ter antes de começar a criá-lo.
A representação do seu design pode ser tão simples quanto o nome do aplicativo e uma breve instrução de sua finalidade ou tão complicado quanto um conjunto de documentos de requisitos contendo vários diagramas UML (Unified Modeling Language). Este manual não discute a disciplina do design de software em detalhes, mas é importante ter em mente que ele é uma etapa essencial no desenvolvimento de aplicativos do ActionScript.
Nosso primeiro exemplo de um aplicativo do ActionScript será um aplicativo “Hello World” padrão, pois seu design é muito simples:
• O aplicativo será chamado de HelloWorld.
• Ele exibirá um único campo de texto contendo as palavras “Hello World!”.
• Para ser reutilizado facilmente, ele usará uma única classe orientada a objetos, chamada Greeter, que pode ser usada de dentro de um documento Flash ou um aplicativo do Flex.
• Depois de criar uma versão básica do aplicativo, você adicionará uma nova funcionalidade que exija do usuário a inserção de um nome de usuário e faça o aplicativo verificar esse nome em relação ao uma lista de usuários conhecidos.
Com essa definição concisa estabelecida, você pode começar a criar o aplicativo em si.

Criação do projeto HelloWorld e da classe Greeter

A instrução do design para o aplicativo Hello World dizia que seu código deve ser fácil de reutilizar. Com esse objetivo em mente, o aplicativo usa uma única classe orientada a objetos, chamada Greeter, que é usada de dentro de um aplicativo criado no Flex Builder ou na ferramenta de autoria do Flash.

Para criar a classe Greeter na ferramenta de autoria do Flash:

1 Na ferramenta autoria do Flash, selecione Arquivo > Novo.
2 Na caixa de diálogo Novo documento, selecione o arquivo do ActionScript e clique em OK.
Uma nova janela de edição do ActionScript será exibida.
3 Selecione Arquivo > Salvar. Selecione uma pasta para conter o aplicativo, chame o arquivo do ActionScript de Greeter.as e clique em OK.

Adição de código à classe Greeter

A classe Greeter define um objeto, Greeter, que poderá ser usado no aplicativo HelloWorld.

Para adicionar código à classe Greeter:

1 Digite o seguinte código no novo arquivo:

package
{
public class Greeter
{
public function sayHello():String
{
var greeting:String;
greeting = “Hello World!”;
return greeting;
}
}
}
A classe Greeter inclui um único método sayHello() , que retorna uma seqüência de caracteres que diz “Hello World!”.
2 Clique em Arquivo > Salvar para salvar esse arquivo do ActionScript.
A classe Greeter agora está pronta para ser usada em um aplicativo.

Criação de um aplicativo que usa o código do ActionScript

A classe Greeter que você criou define um conjunto independente de funções de software, mas não representa um aplicativo completo. Para usar a classe, é necessário criar um documento do Flash ou aplicativo do Flex.
O aplicativo HelloWorld cria uma nova ocorrência da classe Greeter. Veja como anexar a classe Greeter ao seu aplicativo.

Para criar um aplicativo do ActionScript usando a ferramenta de autoria do Flash:

1 Selecione Arquivo > Novo.
2 Na caixa de diálogo Novo documento, selecione Documento Flash e clique em OK.
Uma nova janela do Flash será exibida.
3 Selecione Arquivo > Salvar. Selecione uma pasta que contenha o arquivo de classe Greeter.as, chame o documento Flash de HelloWorld.fla e clique em OK.
4 Na paleta Ferramentas do Flash, selecione a ferramenta Texto e arraste até o Palco para definir um novo campo de texto, com aproximadamente 300 pixels de largura e 100 de altura.
5 No painel Propriedades, com o campo de texto ainda selecionado no Palco, defina o tipo de texto como “Texto dinâmico” e digite mainText como o nome de ocorrência do campo de texto.
6 Clique no primeiro quadro da linha de tempo principal.
7 No painel Ações, digite o seguinte script:
var myGreeter:Greeter = new Greeter();
mainText.text = myGreeter.sayHello();
8 Salve o arquivo.

Publicação e teste do aplicativo do ActionScript

O desenvolvimento de software é um processo interativo. Você escreve um código, tenta compilá-lo e o edita até obter uma compilação limpa. Depois, você executa o aplicativo compilado, testa-o para ver se ele cumpre o design pretendido e, caso negativo, edita o código novamente até que o faça. Os ambiente de desenvolvimento do Flash e do Flex Builder oferecem vários meios de publicar, testar e depurar aplicativos.
Veja as etapas básicas para testar o aplicativo HelloWorld em cada ambiente.

Para publicar e testar um aplicativo do ActionScript usando a ferramenta de autoria do Flash:

1 Publique seu aplicativo e observe se há erros de compilação. Na ferramenta de autoria do Flash, selecione Controlar > Testar filme para compilar o código do ActionScript e executar o aplicativo HelloWorld.
2 Se forem exibidos erros ou avisos na janela Saída durante o teste do aplicativo, corrija as causas dos erros nos arquivos HelloWorld.fla ou HelloWorld.as e tente testar o aplicativo novamente.
3 Se não houver nenhum erro de compilação, você verá uma janela do Flash Player mostrando o aplicativo Hello World.
Você acabou de criar um aplicativo orientado a objetos simples, mas completo, que usa o ActionScript 3.0.

Aprimoramento do aplicativo HelloWorld

Para tornar o aplicativo um pouco mais interessante, agora você o fará solicitar e validar um nome de usuário em relação a uma lista de nomes predefinida.
Primeiro, você atualizará a classe Greeter para adicionar nova funcionalidade. Depois, você atualizará o aplicativo para usar a nova funcionalidade.

Para atualizar o arquivo Greeter.as:

1 Abra o arquivo Greeter.as.
2 Altere o conteúdo do arquivo com o seguinte (as linhas novas e alteradas são mostradas em negrito):
package
{
public class Greeter
{
/**
* Defines the names that should receive a proper greeting.
*/
public static var validNames:Array = [“Sammy”, “Frank”, “Dean”];
/**
* Builds a greeting string using the given name.
*/
public function sayHello(userName:String = “”):String
{
var greeting:String;
if (userName == “”)
{
greeting = “Hello. Please type your user name, and then press
the Enter key.”;
}
else if (validName(userName))
{

greeting = “Hello, ” + userName + “.”;
}
else
{
greeting = “Sorry ” + userName + “, you are not on the list.”;
}
return greeting;
}

/**
* Checks whether a name is in the validNames list.
*/
public static function validName(inputName:String = “”):Boolean
{
if (validNames.indexOf(inputName) > -1)
{
return true;
}
else
{
return false;
}
}

}

}

A classe Greeter agora tem vários novos recursos:
• A matriz validNames lista os nomes de usuário válidos. A matriz é inicializada com uma lista de três nomes quando a classe Greeter é carregada.
• O método sayHello() agora aceita um nome de usuário e altera a saudação com base em algumas condições. Se userName for uma seqüência de caracteres vazia (“”), a propriedade greeting será definida para solicitar um nome ao usuário. Se o nome do usuário for válido, a saudação se tornará “Hello, userName”. Finalmente, se as duas condições não forem atendidas, a variável greeting será definida como “Sorry userName, you are not on the list”.
• O método validName() retornará true se inputName for encontrado na matriz validNames e false se não for encontrado. A instrução validNames.indexOf(inputName) verifica cada seqüência de caracteres na matriz validNames em relação à seqüência de caracteres inputName. O método Array.indexOf() retornará a posição de índice da primeira ocorrência de um objeto em uma matriz ou o valor -1 se o objeto não for encontrado nela.
Em seguida, você editará o arquivo Flash ou Flex que faz referência a essa classe do ActionScript.

Para modificar o aplicativo usando a ferramenta de autoria do Flash:

1 Abra o arquivo HelloWorld.fla.
2 Modifique o script no Quadro 1 para que uma seqüência de caracteres (“”) seja transmitida ao método sayHello() da classe Greeter:
var myGreeter:Greeter = new Greeter();
mainText.text = myGreeter.sayHello(“”);
3 Selecione a ferramenta Texto na paleta Ferramentas e crie dois novos campos de texto no Palco, lado a lado e diretamente sob o campo de texto mainText existente.
4 No primeiro campo de texto novo, digite o texto User Name: para servir de rótulo.

5 No outro campo de texto novo, e no Inspetor de propriedades, selecione InputText como o tipo de campo de texto.
Selecione Linha única como o Tipo de linha. Digite textIn como o nome de ocorrência.
6 Clique no primeiro quadro da linha de tempo principal.
7 No painel Ações, adicione as seguintes linhas no final do script existente:
mainText.border = true;
textIn.border = true;
textIn.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed);
function keyPressed(event:KeyboardEvent):void
{
if (event.keyCode == Keyboard.ENTER)
{
mainText.text = myGreeter.sayHello(textIn.text);
}
}
O novo código adiciona a seguinte funcionalidade:
• As primeiras duas linhas simplesmente definem bordas para os dois campos de texto.
• Um campo de texto de entrada, como o campo textIn, possui um conjunto de eventos que ele pode despachar. O método addEventListener() permite definir uma função que é executada quando um tipo de evento ocorre. Neste caso, o evento é o pressionamento de uma tecla no teclado.
• A função personalizada keyPressed() verifica se a tecla que foi pressionada é a tecla Enter. Caso afirmativo, ela chama o método sayHello() do objeto myGreeter , transmitindo o texto do campo de texto textIn como um parâmetro. Esse método retorna uma seqüência de caracteres de saudação com base no valor transmitido.
A seqüência de caracteres retornada é atribuída à propriedade text do campo de texto mainText.
O script completo para o Quadro 1 é o seguinte:
var myGreeter:Greeter = new Greeter();
mainText.text = myGreeter.sayHello(“”);
mainText.border = true;
textIn.border = true;
textIn.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed);
function keyPressed(event:KeyboardEvent):void
{
if (event.keyCode == Keyboard.ENTER)
{
mainText.text = myGreeter.sayHello(textIn.text);
}
}
8 Salve o arquivo.
9 Selecione Controlar > Testar filme para executar o aplicativo.
Durante a execução do aplicativo, você será solicitado a inserir um nome de usuário. Se for válido (Sammy, Frank ou Dean), o aplicativo exibirá a mensagem de confirmação “hello”.

Execução de exemplos subseqüentes

Agora que desenvolveu e executou o aplicativo “Hello World” do ActionScript 3.0, você tem o conhecimento básico necessário para executar os outros exemplos de código apresentados nessa série de posts.

Teste de listagens de código de exemplo dos posts

Durante a leitura destes posts, talvez você queira testar as listagens de código de exemplo usadas para ilustrar os diversos tópicos. Esse teste pode envolver a exibição do valor de variáveis em determinados pontos no programa ou a exibição ou interação com o conteúdo na tela. Para testar o conteúdo ou a interação visual, os elementos necessários serão descritos antes ou dentro da listagem de código (bastará apenas criar um documento com os elementos conforme descrito para testar o código). Caso você queira exibir o valor de uma variável em um determinado ponto no programa, há algumas formas de fazer isso. Uma delas é usar um depurador, como aqueles criados no Flex Builder e no Flash.
Para um teste simples, porém, pode ser mais fácil apenas imprimir os valores de variável em um local que permita exibi-los.
As etapas a seguir o ajudarão a criar um documento Flash que você pode usar para testar uma listagem de código e exibir valores de variável:

Para criar um documento Flash para testar os exemplos:

1 Crie um novo documento Flash e salve-o no seu disco rígido.
2 Para exibir os valores de teste em um campo de texto no Palco, ative a ferramenta Texto e crie um novo campo Texto dinâmico no Palco. Um campo de texto largo e alto, com o Tipo de linha definido como Multiline e a borda ativada será muito útil. No Inspetor de propriedades, atribua um nome de ocorrência ao campo de texto (por exemplo, “outputText”). Para escrever os valores no campo de texto, você adicionará um código que chama o método appendText() ao código de exemplo (descrito abaixo).
3 Se preferir, você pode adicionar uma chamada de função trace() à listagem de código (conforme descrito abaixo) para exibir os resultados do exemplo.
4 Para testar um determinado exemplo, copie a listagem de código para o painel Ações; se necessário, adicione uma chamada de função ou um valor trace() ao campo de texto usando seu método appendText().
5 Do menu principal, escolha Controlar > Testar filme para criar um arquivo SWF e exibir os resultados. Como esta abordagem é para exibir os valores de variáveis, há duas formas de fazer isso facilmente ao testar os exemplos: escrever os valores em uma ocorrência de campo de texto no Palco ou usar a função trace() para imprimir os valores no painel Saída.
• A função trace(): a função trace() do ActionScript escreve os valores de qualquer parâmetro transmitido (variáveis ou expressões literais) no painel Saída. Muitas listagens de exemplo deste manual já incluem uma chamada de função trace(), por isso, para essas listagens, basta copiar o código para o documento e testar o projeto. Se quiser usar trace() para testar o valor de uma variável em uma listagem de código que não a inclua, apenas adicione uma chamada trace() à listagem de código, transmitindo a variável como um parâmetro. Por exemplo, se você encontrar uma listagem de código como esta no post,
var albumName:String = “Three for the money”;
deverá copiar o código no painel Ações e adicionar uma chamada à função trace() como esta para testar o resultado da listagem de código:
var albumName:String = “Three for the money”;
trace(“albumName =”, albumName);
Durante a execução do programa, esta linha será impressa:

albumName = Three for the money
Cada chamada de função trace() pode usar vários parâmetros, que são reunidos em uma string como uma única linha impressa. Uma quebra de linha é adicionada ao final de cada chamada de função trace(), de forma que chamadas trace() separadas são impressas em linhas separadas.
• Um campo de texto no Palco: se preferir não usar a função trace(), você pode adicionar um campo Texto dinâmico ao Palco usando a Ferramenta texto e escrever os valores nesse campo de texto para exibir os resultados de uma listagem de código. O método appendText() da classe TextField pode ser usado para adicionar um valor String ao final do conteúdo do campo de texto. Para acessar o campo de texto usando o ActionScript, atribua-lhe um nome de ocorrência no Inspetor de propriedades. Por exemplo, se o seu campo de texto tiver o nome de ocorrência outputText, o seguinte código poderá ser usado para verificar o valor da variável albumName:
var albumName:String = “Three for the money”;
outputText.appendText(“albumName = “);
outputText.appendText(albumName);
Esse código deve escrever o seguinte texto no campo de texto chamado outputText:
albumName = Three for the money
Como mostra o exemplo, o método appendText() adicionará o texto à mesma linha que o conteúdo anterior; portanto, diversos valores podem ser adicionados à mesma linha de texto usando várias chamadas appendText().
Para forçar o texto para a linha seguinte, você pode anexar um caractere de nova linha (“\n”):
outputText.appendText(“\n”); // adds a line break to the text field
Diferentemente da função trace(), o método appendText() aceita apenas um valor como parâmetro. Esse valor deve ser uma seqüência de caracteres (uma ocorrência de String ou um literal de seqüência de caracteres). Para imprimir o valor de uma variável que não seja uma seqüência de caracteres, primeiro é necessário converter o valor em uma String. A maneira mais fácil de fazer isso é chamar o método toString() do objeto:
var albumYear:int = 1999;
outputText.appendText(“albumYear = “);
outputText.appendText(albumYear.toString());

Teste dos exemplos do fim do capítulo

Como este, a maioria dos posts dessa série inclui um exemplo de fim de post significativo relacionado aos diversos conceitos discutidos. Entretanto, diferentemente do exemplo Hello World deste post, esses exemplos não serão apresentados em um formato de tutorial passo a passo. O código relevante do ActionScript 3.0 em cada exemplo será destacado e discutido, mas as instruções sobre a execução dos exemplos em ambientes de desenvolvimento específicos não serão fornecidas. Os arquivos de exemplo distribuídos com esta série, contudo, incluirão todos os arquivos necessários para compilar e executar os exemplos facilmente no ambiente de desenvolvimento de sua escolha.

Anúncios

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s