INTRODUÇÃO AO ACTIONSCRIPT

Transcrição

1 6 INTRODUÇÃO AO ACTIONSCRIPT No capítulo anterior, aprendemos a criar animações lineares que são inseridas na timeline. Ao longo deste capítulo, iremos abordar a linguagem de programação ActionScript para criar animações não lineares. Este tipo de animação não é reproduzido da mesma forma como na timeline. Com a programação ActionScript podemos controlar a ordem pela qual uma animação é reproduzida para criar interactividade. Daremos, portanto, mais destaque o ActionScript 3.0, o que já aconteceu no capítulo anterior através da utilização de ferramentas que apenas funcionam em documentos ActionScript 3.0. Uma das novidades desta versão do Flash é a introdução do painel Code Snippets que permite ao leitor programar em ActionScript através de blocos de código predefinidos. 6.1 Behaviors (Comportamentos) O Flash disponibiliza um conjunto de behaviors para criar interactividade e controlar movie clips, som e vídeo em filmes de Flash, tornando-se, assim, uma forma mais fácil e acessível de criar programação ActionScript. Os behaviors apenas podem ser utilizados em documentos Flash de ActionScript 2.0. A versão ActionScript 3.0 não permite aplicar behaviors. Um behavior representa a combinação entre um evento e uma acção por ele desenca deada. O script do behavior é um código ActionScript. Um evento representa uma ocorrência de software ou hardware que necessita de uma resposta de uma aplicação Flash. Temos eventos controlados pelos utilizadores ou dependentes da timeline. Por exemplo, o clique do rato ou uma tecla pressionada é um evento do utilizador, a partir do momento em que ocorra em consequência da interacção directa do utilizador; enquanto o início de um filme está dependente da timeline. No Flash, utilizamos o painel Behaviors para anexar behaviors a objectos de filmes, como movie clips, campos de texto, entre outros. Para visualizar o painel Behaviors, deverá executar o comando Window > Behaviors. FCA Editora de Informática 125

2 6 Flash CS5.5 & CS5 Depressa & Bem Adicionar behavior Eliminar behavior Alteração da ordem de execução dos behaviors Evento Acção a ser desencadeada pelo evento Fig. 6.1 Painel Behaviors Para efectuar o download e instalar novos behaviors, deverá consultar o site da Adobe Exchange em Movieclip behaviors No painel Behaviors, podemos encontrar 12 behaviors específicos para controlar movie clips (Tabela 6.1). Vejamos a aplicação de cada um. Fig. 6.2 Behaviors associados a movie clips BEHAVIORS DESCRIÇÃO Bring Forward Posiciona o movie clip um nível acima dos restantes no stage Bring to Front Posiciona o movie clip no nível de topo dos restantes no stage 126 FCA Editora de Informática

3 Introdução ao ActionScript 6 Duplicate Movieclip Permite duplicar um movie clip Goto and Play at frame or label Goto and Stop at frame or label Load External Movieclip Load Graphic Reproduz o movie clip a partir de um determinado frame Coloca o playhead do movie clip num determinado frame, mas não inicia a sua reprodução Abre um filme SWF externo numa determinada parte do filme principal Permite abrir uma imagem JPEG externa numa determinada parte do filme principal Send Backward Posiciona o movie clip um nível abaixo dos restantes no stage Send to Back Posiciona o movie clip debaixo dos restantes no stage Start Dragging Movieclip Stop Dragging Movieclip Unload Movieclip Permite arrastar um movie clip dentro de um filme Permite terminar o arrastamento de um movie clip dentro de um filme Fecha um filme SWF que tenha sido aberto com o behavior Load External Movieclip Tabela 6.1 Descrição dos behaviors associados a movie clips 6.2 Actions O ActionScript permite-nos adicionar interactividade de um nível complexo. Vimos já que facilmente podíamos criar interactividade sem criarmos directamente código ActionScript, através da utilização dos behaviors disponíveis no painel Behaviors. Em alternativa aos behaviors do Flash e para aqueles utilizadores que pretendem ir mais além na criação de scripts, podemos utilizar o painel Actions para criar acções num objecto ou frame. FCA Editora de Informática 127

4 6 Flash CS5.5 & CS5 Depressa & Bem Como qualquer linguagem de programação, o ActionScript tem a sua própria sintaxe. Não é nosso objectivo neste capítulo e nesta obra fazer uma abordagem neste sentido, mas apenas transmitir uma breve introdução daquilo que é possível fazer com esta linguagem. Para criarmos acções (actions) em ActionScript no Flash, utilizamos o painel Actions; no caso de não estar visível, deverá executar o comando Window > Actions: Actions Script Window Script Navigator Fig. 6.3 Painel Actions Script Navigator contém informação relativa ao símbolo, à instância ou ao nome da cena. É utilizada para seleccionar um item e ver o script associado; Actions contém todas as acções (actions) organizadas por categorias; Script Window é utilizada para criar scripts. Podemos adicionar acções através da selecção da acção que pretendemos aplicar na caixa Actions ou, então, através da escrita directa do script nesta janela; Adicionar uma nova acção ou item para além da caixa Actions onde podemos encontrar categorizadas todas as acções, é possível também, através deste botão, adicionar uma nova acção ou um novo item ao script; Pesquisar permite fazer uma pesquisa directa no script; 128 FCA Editora de Informática

5 Introdução ao ActionScript 6 Inserir um caminho de destino (Target Path) exibe uma estrutura com o caminho de todos os objectos no stage para ser mais fácil adicionar acções a um objecto; Verificar sintaxe esta ferramenta é útil para verificar se o script está correctamente escrito; Formatação automática alinha automaticamente as linhas de código para uma leitura mais fácil; Show Code Hint é utilizado para exibir informação de ajuda acerca do comando de ActionScript que estamos a escrever, tornando-se assim mais fácil e rápida a construção do script; Fig. 6.4 Utilização da função Show Code Hint Depuração de erros (Debug Options) esta opção permite localizar e corrigir eventuais erros no script. É utilizada, geralmente, por programadores; Code Snippets este botão permite abrir o painel Code Snippets onde podemos encontrar diversos blocos de código predefinidos e organizados por categorias; Script Assist através deste assistente, é possível criar blocos de código, seleccionando as acções pretendidas a partir da janela Actions e, depois, configurando os parâmetros da acção na Script Window. FCA Editora de Informática 129

6 6 Flash CS5.5 & CS5 Depressa & Bem Controlar um filme com acções No Flash, podemos utilizar as acções para controlar a forma como um filme é reproduzido. Vejamos, na Tabela 6.2, quais as acções mais utilizadas para controlar frames e qual o seu efeito: ACÇÃO play() stop() gotoandplay() gotoandstop() nextframe() prevframe() DESCRIÇÃO Reproduz o filme a partir do frame actual Pára a reprodução do filme no frame actual Reproduz o filme a partir de um determinado frame Posiciona o playhead do filme num determinado frame, mas não inicia a sua reprodução Posiciona o playhead do filme no frame seguinte, mas não inicia a sua reprodução Posiciona o playhead do filme no frame anterior, mas não inicia a sua reprodução Tabela 6.2 Descrição das acções para controlar frames Controlar as propriedades dos movie clips com acções Com o ActionScript, podemos também controlar as propriedades dos movie clips, como o seu tamanho e a sua posição no stage. É possível alterar as propriedades de um movie clip, fazendo sempre referência ao nome da instância desse mesmo movie clip. Na Tabela 6.3, podemos ver uma lista das propriedades mais utilizadas e as suas características em ActionScript 3.0: PROPRIEDADE x y width DESCRIÇÃO Permite controlar o valor da coordenada x da instância do movie clip no stage Permite controlar o valor da coordenada y da instância do movie clip no stage Permite controlar a largura da instância do movie clip 130 FCA Editora de Informática

7 Introdução ao ActionScript 6 height alpha rotation visible currentframe framesloaded name totalframes loaderinfo mousex scalex mousey scaley Permite controlar a altura da instância do movie clip Permite controlar o nível de transparência da instância do movie clip Roda a instância do movie clip Indica se a instância do movie clip se encontra visível ou não Exibe o número do frame actual Exibe o número de frames do movie clip que foram carregados Refere-se ao nome da instância do movie clip Exibe o número total de frames do movie clip Exibe o endereço (URL) do ficheiro SWF a partir do qual o movie clip foi carregado Exibe a coordenada x do cursor do rato Permite controlar o tamanho através do escalonamento horizontal Exibe a coordenada y do cursor do rato Permite controlar o tamanho através do escalonamento vertical Tabela 6.3 Descrição das propriedades dos movie clips Arrastar um movie clip No ActionScript, as acções startdrag()e stopdrag() permitem criar interactividade com os movie clips, tornando possível ao utilizador arrastá-los no stage. Estas acções são bastante úteis para criar jogos em Flash, cursores personalizados e painéis de menus. Depois de aplicada a acção startdrag() a uma instância de um movie clip, podemos arrastar essa instância no stage até que seja aplicada uma nova acção startdrag() a uma instância diferente ou, então, até que seja aplicada a acção stopdrag(). Esta acção não requer a definição do nome de uma instância, pois apenas se pode arrastar um movie clip de cada vez. FCA Editora de Informática 131

8 6 Flash CS5.5 & CS5 Depressa & Bem Fscommand No Flash, podemos aplicar a acção Fscommand para configurar as opções de visualização do filme publicado em formato SWF (Shockwave Flash Player) e executar aplicações externas. Esta acção é constituída por seis comandos. COMANDO allowscale exec fullscreen quit showmenu trapallkeys DESCRIÇÃO Permite definir se o utilizador pode, ou não, redimensionar a janela do filme. A janela, ao ser redimensionada, altera também o tamanho dos objectos Permite executar uma aplicação externa a partir do filme de Flash. A aplicação que vai ser executada deve estar numa subpasta do filme denominada fscommand Permite definir se o filme ocupará toda a área do monitor do utilizador Permite sair do filme É predefinido que esta opção está activada, permitindo, assim, ao utilizador fazer clique com o botão direito do rato e visualizar o menu de contexto Através desta opção, é possível desactivar o teclado quando um filme está a ser executado e também converter todos os eventos do teclado em eventos de movie clip Tabela 6.4 Descrição dos comandos da acção Fscommand 6.3 Eventos Para gerar interactividade no Flash, estes tipos de eventos são, sem dúvida, os mais utilizados para criar elementos de navegação. Podem ser programados eventos com ActionScript para reagir ao rato ou ao teclado. A Tabela 6.5 apresenta os oito diferentes eventos de botões que podemos utilizar para controlar um filme: EVENTO click doubleclick DESCRIÇÃO Este evento controla o momento em que pressionamos e largamos um objecto que funciona como botão Este evento acontece quando fazemos clique duas vezes consecutivas num objecto que funciona como botão 132 FCA Editora de Informática

9 Introdução ao ActionScript 6 rightclick mouseover mouseout mousedown mouseup keydown keyup enterframe exitframe Quando é pressionado o botão direito do rato sobre um objecto que funciona como botão Quando passamos o cursor do rato por cima do objecto Quando o cursor se move para fora da área de toque do objecto Quando mantemos pressionado o botão esquerdo do rato Quando o botão esquerdo do rato deixa de estar pressionado Quando uma determinada tecla é pressionada Quando uma determinada tecla é largada Este evento ocorre quando o playhead do filme entra num determinado frame Este evento ocorre quando o playhead do filme sai de um determinado frame Tabela 6.5 Descrição dos eventos 6.4 Code Snippets Uma das novidades introduzidas no Flash CS5 foi o painel Code Snippets, onde podemos encontrar um conjunto de códigos utilizados com maior frequência em programação com ActionScript 3.0. Estes códigos estão organizados por categorias, nomeadamente para aplicação à timeline, a objectos de áudio e vídeo, entre outras. A sua facilidade de acesso permite-nos uma maior rapidez na criação de scripts. Para utilizar este painel, basta escolher quais as acções que deseja e fazer duplo clique sobre as mesmas para o painel Actions abrir com as acções para aquela opção. Para abrir este painel, o leitor deverá executar o comando Window > Code Snippets. FCA Editora de Informática 133

10 6 Flash CS5.5 & CS5 Depressa & Bem Fig. 6.5 Painel Code Snippets Exercício 6.1 NESTE EXERCÍCIO, VAMOS CRIAR UMA ANIMAÇÃO SIMPLES E APLICAR DOIS BEHAVIORS PARA CONTROLAR O FILME. 1. Vamos criar um novo documento de ActionScript 2.0 e importar uma imagem através do comando File > Import > Import to Stage. 2. Dar um nome à layer que contém a imagem, por exemplo, fundo. 3. Criar uma nova layer através do comando Insert > Timeline > Layer. 4. Na nova layer, executar o comando File > Import > Import to Stage para importar uma imagem. 5. Dar um nome à layer que contém a imagem, por exemplo, animação. 6. Seleccionar a imagem e posicioná-la fora do stage. 134 FCA Editora de Informática