Você está na página 1de 112

Action Script “e-Learning”

Instituto Superior de Engenharia do Porto

Departamento de Engenharia Informática

Junho de 2003

e-Learning
“Action Script”

Adérito Fernandes

Página I
Action Script “e-Learning”

Página II
Action Script “e-Learning”

Autor do Projecto:

Adérito dos Santos Curcialeiro Fernandes


Aluno N.º 930461

Orientador do Projecto:

Eng.º Carlos Miguel Miranda Vaz de Carvalho

Página III
Action Script “e-Learning”

Página IV
Action Script “e-Learning”

e-Learning
“Action Script”

1. Índice

Página V
Action Script “e-Learning”

Página VI
Action Script “e-Learning”

1.1. Índice Geral

1. Índice
1.1. Índice Geral VII
1.2. Índice de Exemplos VIII
1.3. Índice do Curso XVII

2. Introdução
2.1. Resumo X
2.2. Motivação X
2.3. Metodologia X
2.4. Esquema do Relatório XI

3. Curso de e-Learning “ActionScript”


3.1. Introdução X
3.2. “e-Learning breve introdução” XIV
3.3. Índice do Curso XVII
3.4 Curso de e-Learning XXIII

4. Conclusão
4.1. Breve nota do autor 106

5. Glossário
5.1 Conjunto de termos mais usados 109

6. Referências
6.1. Referências mais Relevantes 111

Página VII
Action Script “e-Learning”

1.2. Índice de Exemplos

1.2.1. Exemplo de construção de storyboard 38


1.2.2. Exemplo de utilização das acções play(), stop() e gotoAndPlay() 43
1.2.3. Exemplo de utilização dos eventos associados a botões 48
1.2.4. Exemplo de criação de janelas deslizantes 54
1.2.5. Exemplo de como criar variáveis de input/output 62
1.2.6. Exemplo de como atribuir um nome a um objecto 65
1.2.7. Exemplo de utilização da função “loadMovie” 67
1.2.8. Exemplo da utilização de “if” “elsif” “else” “while” “function” 72
1.2.9. Exemplo de criação de mecanismos de pré-load 79
1.2.10. Exemplo de criação de um jogo 85
1.2.11. Exemplo de interacção entre o php e o mysql 95
1.2.12. Exemplo de interacção entre o flash e o php 96
1.2.1.3 Exemplo de como inserir correctamente um flash numa página101

Página VIII
Action Script “e-Learning”

e-Learning
“Action Script”

2. Introdução

Página IX
Action Script “e-Learning”

2.1. Resumo

Este trabalho foi realizado no âmbito da cadeira de Projecto, do 5º ano do curso de


Engenharia Informática - Computadores e Sistemas, do Instituto Superior de Engenharia do
Porto durante o segundo semestre do ano lectivo de 2002/2003.
Pretendo com este trabalho apresentar a matéria a dar em várias aulas relativamente a um
curso de e-learning relacionado com ActionScript.
O curso será divido em lições, sendo cada lição acompanhada por um tutor.
O curso terá como objectivo principal transmitir conhecimentos a alunos que pouca ou
nenhuma formação tenham em ActionScript, ficando no final do curso aptos a desenvolver
soluções que envolvam ActionScript em níveis de complexidade de programação elevada
como por exemplo jogos de computador.

2.2. Motivação

O que me levou à escolha e realização deste trabalho foi o facto de eu já ter um vasto
conhecimento nesta área para além de também se tratar de uma oportunidade para expor as
minhas ideias relativamente ao ActionScript em níveis de programação mais avançados.
Outra razão é a possibilidade de se poder utilizar este material para a formação de
colaboradores novos que venham a reforçar a equipa de desenvolvimento multimédia que
coordeno actualmente na empresa Multitema Multimédia e Design, S.A.

2.3. Metodologia
Para a realização deste trabalho foi necessário a realizar pesquisas na Internet e consultar
manuais de formação em programação FLASH de forma a obter bom material sobre algumas
especificidades que um curso de e-Learning implica. Também importante foi o apoio e o
material facultado pelo meu orientador bem como a experiência profissional que eu possuo
nesta área.

Posso dividir a evolução do trabalho em três fases distintas:


- Recolha
Nesta fase procedi à recolha de informação relacionada com metodologias de ensino
através de e-Learning e diversos exemplos de ActionScript. Para esta recolha contei
com a preciosa ajuda da Macromedia, que contém no seu Site vários exemplos de
ActionScript e de material que me foi cedido pela Multitema (do qual sou responsável)
contendo mais exemplos inclusive de PHP que serão apresentados em cada lição do
respectivo curso.
- Análise
Nesta fase analisei todo o material recolhido por forma a filtrar o que é importante e o
que não tem interesse pedagógico.

Página X
Action Script “e-Learning”

Pode-se inserir ainda nesta fase a realização de um esboço da matéria a tratar em cada
aula devidamente distribuída pelas várias aulas seguindo uma orientação de menor
complexidade até á maior complexidade.
- Elaboração
Após a recolha de material, sua análise e respectiva planificação, comecei a descrever
cada aula até dar por concluído o curso de e-Learning de ActionScript que descrevo ao
longo das restantes páginas deste relatório.

2.4 Esquema do Relatório

O relatório encontra-se dividido em 3 partes distintas:


1- Introdução, uma pequena explicação sobre o curso
2- Índice do curso
3- O Curso que se divide por 14 aulas.

Página XI
Action Script “e-Learning”

Página XII
Action Script “e-Learning”

e-Learning
“Action Script”

3. Curso de e-Learning “ActionScript”

Página XIII
Action Script “e-Learning”

3.1. Introdução

O curso a realizar deverá constituir 14 aulas, que deverão ser acompanhados por um
orientador responsável pela análise dos resultados do formando após o termo de cada aula.
Sempre que o formando concluir uma aula deverá responder a um exercício e enviar a
resolução para o orientador. Sempre que o aluno concluir a o exercício que lhe foi proposto,
cabe ao seu orientador enviar-lhe a password que permitirá aceder á próxima aula.
Este processo repete-se ate que o aluno tenha concluído a ultima aula do curso.
O sistema deverá impedir que o formando possa realizar mais do que uma aula diariamente.
O curso inicia com a inscrição do Formando que recebe uma login e password por forma a
poder aceder a dados sobre o seu orientador (nome, email, ...) e claro a iniciar o curso
começando pela sua primeira aula.

3.2. “e-Learning breve introdução”

O que é e-Learning?

O e-Learning está a tornar-se na revolução do ensino para as áreas digitais, o futuro do ensino
passa pelo e-Learning.
Na maior parte das vezes, as aulas não deixam de ser a mera exposição de conhecimentos
adquiridos pelos professores que através da exposição de acetatos os passam para os alunos,
o papel dos professores tende a ser cada vez mais a orientação, consiste em orientar os
alunos para autonomamente atinjam determinados níveis de conhecimento.
Agora imagine-se que o aluno não necessitava de se deslocar à sala de aula, bastando aceder
a uma página WEB para poder obter toda a matéria que ia ser dada na aula, a única falta que
poderia sentir para além do convívio com os colegas, seria a opinião e esclarecimentos do
professor relativamente à matéria que ia ser dada. Mas se o aluno pudesse obter esse mesmo
feed-back do professor através de email passava a usufruir de todas as condições de ter o
mesmo sucesso de aprendizagem da matéria que teria se estivesse fisicamente na sala de
aula.
Por ter consciência disso, A Sociedade actual terá de se adaptar porque o futuro do ensino
passa pela implementação de sistemas de e-Learning, em que os alunos deixam de ter de se
deslocarem à sala de aula, para poderem passar a ter as aulas através de um terminal de
computador.

Vantagens

As vantagens na utilização do e-learning são a possibilidade de um acompanhamento


mais personalizado entre o formador e o aluno, pois com a troca de emails entre ambos os
interlocutores, garante-se que todos os alunos tem a possibilidade de exporem as suas
questões e de as verem resolvidas o que muitas vezes não sucedia pela aglutinação da
palavra por parte de alguns alunos em relação ao mais tímidos.
Outra das vantagens será a de os alunos mais tímidos, face a uma terminal de comutador,
deixarem de ter complexos em exporem os seus problemas e dúvidas, porque não sentem

Página XIV
Action Script “e-Learning”

represálias dos colegas, nem se sentem violados por outros ficarem a conhecer as suas
dúvidas, pois o diálogo mantém-se estritamente entre o professor e o aluno.
Outra vantagem é a possibilidade de os professores não se sentirem limitados na
exposição da matéria quer por alguma limitação física aparente ou pelo facto de terem
mais ou menos idade que os alunos, como os alunos não tem acesso a imagens visuais
do professor cada um pode imaginar o professor ideal (na eventualidade de não existir
sistemas de vídeo conferencia)
Outra vantagem é o tempo, por não ser necessário o aluno deslocar-se ao instituto de
ensino, à um ganho de tempo precioso que pode ser aproveitado para realizar outras
tarefas.
A possibilidade de se estudar a lição à hora que for mais conveniente permite que cada
aluno tenha o seu horário adaptado à sua agenda pessoal.
Se todo o sistema de ensino se baseasse no e-learning existia também um ganho
significativo na redução de despesas na construção de edifícios.
Outro ganho era o de se poder centralizar o conhecimento, existindo apenas uma central
que guardasse todo o conhecimento, todos os formadores poderiam aceder a essa base
de dados e trocar informações úteis entre eles obtendo ganhos significativos na aquisição
de conhecimentos.
Tal como os alunos que deixavam de ter necessidade de se deslocar à unidade de ensino,
também os professores podiam usufruir das mesmas condições dos alunos (ter horário à
medida, não ter a necessidade de se deslocar, ....)

Desvantagens

O aumento do desemprego por deixar de ser necessário existir alguns cargos.


Reflexo negativo na sociedade em empresas que obtém rendimentos na prestação de
alguns tipo de serviços aos institutos de ensino (construção de edifícios).
Sociedade mais fechada, falta de diálogo em sociedade.
Perda de valores de sociedade pela falta de convívio.
Sociedade cada vez mais dependente da tecnologia.
Aumento da obesidade pela falta de realização de exercício físico (como andar).

Conclusão

Sabe-se que o futuro será o e-learning e que apesar das desvantagens que acarreta, cabe á
sociedade adaptar-se e encontrar soluções para o futuro.

Página XV
Action Script “e-Learning”

Página XVI
Action Script “e-Learning”

3.3. Índice do Curso

AULA I – “ActionScript - Introdução”

1- Introdução 23
2- Flash 5 ActionScript 23
3- Requisitos de aprendizagem 23
4- Flash – O explorador de ficheiros 23
5- Flash – O Stage 24
6- Flash – Definições 24
7- Convenções utilizadas 25
8- Exercício 25

AULA II – “ActionScript - Iniciação”

1- Introdução 27
2- Eventos no Flash 27
3- Comentários 30
4- Comandos, argumentos e propriedades 30
5- Instruções 31
6- Sintaxe 31
7- Resumo 32
8- Exercício 32

AULA III – “ActionScript - Traçando planos”

1- Introdução 37
2- Traçando planos 37
3- Libraria de Ideias 37
4- Storyboarding 37
5- Construindo ActionScript 38
a. Estilo Top Down 38
b. Estilo Botton Up 38
6- Exemplos 38
7- Resumo 39
8- Exercício 39

Página XVII
Action Script “e-Learning”

AULA IV – “ActionScript - Timeline Actions”

1- Introdução 41
2- Timeline Paths 41
3- Adicionando acções básicas à Timeline 42
4- Adicionando Labels à Timeline 42
5- Exemplos 43
6- Resumo 45
7- Exercício 45

AULA V – “ActionScript - Começando a interactividade”

1- Introdução 47
2- Criar um botão 47
3- Interactividade com MoviClips 47
4- Exemplos 48
5- Resumo 50
6- Exercício 50

AULA VI – “ActionScript - Truques de navegação”

1- Introdução 51
2- Botões invisíveis 51
3- Ligar Cenas 52
4- Ligar Labels 52
5- Ligar MovieClips 52
6- Ligar SWFs e Níveis 52
7- Adicionar animações a botões 52
8- Janelas deslizantes 53
9- Resumo 59
10- Exercício 59

Página XVIII
Action Script “e-Learning”

AULA VII – “ActionScript - Variáveis”

1- Introdução 61
2- Literais e expressões 61
3- Variáveis de Input 61
4- Variáveis de Output 63
5- Atribuir nomes às variáveis 64
6- Variáveis numéricas 64
7- Variáveis booleanas 65
8- Actionscript – Objectos, propriedades e métodos 65
9- Exemplos 67
10- Resumo 68
11- Exercício 68

AULA VIII – “ActionScript - Loops”

1- Introdução 69
2- Tomada de decisões 69
3- “if” 69
4- “elseif” 70
5- “else” 70
6- Action script loops 70
7- Arrays 71
8- Exemplos 71
9- Resumo 74
10- Exercício 74

AULA IX – “ActionScript - Interactividade avançada”

1- Introdução 75
2- Instanciação 75
3- Classes – métodos, propriedades, comportamentos 76
4- Definição de objectos (Movieclips, objectos não gráficos) 77
5- Interactividade Avançada e propriedades dos objectos 78
6- Preloads e Cache 78
7- Exemplos 79
8- Resumo 84
9- Exercício 84

Página XIX
Action Script “e-Learning”

AULA X – “ActionScript - ActionScript Modular”

1- Introdução 85
2- Conceitos sobre jogos, Exemplo 85
3- Criar os objectos 85
4- Criar o script que coloque todos os objectos nas posições
correctas e que iniciasse todas as variáveis que vão ser
utilizadas 86
5- No mesmo frame as funções que correspondem aos métodos de
cada objecto 88
6- Funções auxiliares 90
7- Motor do jogo 91
8- Variáveis e funções que devem ser invocadas sempre que se
entra no frame 91
9- Resumo 91
10- Exercício 91

AULA XI – “ActionScript - PHP”

1- Introdução 93
2- Interacção entre o Flash e o PHP 93
3- O que é o PHP 93
4- Comandos básicos de PHP 94
5- Exemplos 94
6- Resumo 94
7- Exercício 94

CAPITULO XII – “ActionScript – troca de informação com Bases de Dados”

1- Introdução 95
2- Como utilizar o PHP para trocar informações com Bases de Dados 95
3- Cuidados a ter com o delay das comunicações 96
4- Exemplos 96
5- Resumo 99
6- Exercício 99

Página XX
Action Script “e-Learning”

AULA XIII – “Action Script – Compatibilidade/Conflitos”

1. Introdução 101
2. Compatibilidade entre diferentes sistemas operativos e browsers 101
3. Problemas com alguns browsers 102
4. Novos interfaces (Pocket PC) 102
5. Resumo 103
6. Exercício 103

AULA XIV – “Fim do curso”

1- Notas Finais 105


2- Disponibilizar em PDF o curso 105
3- Entrega de Certificado 105

Página XXI
Action Script “e-Learning”

Página XXII
Action Script “e-Learning”

3.4 Curso de e-Learning

AULA I – “Action Script - Introdução”

1- Introdução
Esta é a primeira aula, o aluno ficará a conhecer a ferramenta com que irá trabalhar, o Flash.
Terá o primeiro contacto com algumas das suas funcionalidades como o explorador de
ficheiros, ficará também a conhecer o Stage e qual a orientação dos objectos em relação ao
eixo dos xx e yy.
O aluno com a ajuda do orientado fará o seu primeiro programa de flash apresentando a
famosa frase “Olá Mundo” no seu programa de flash.
A aula terminará sem se aprofundar mais, dando liberdade ao aluno para começar a interagir
com a aplicação de desenvolvimento “Flash”.

2- Flash 5 Action Script

A interactividade emergente que o ActionScript, nomeadamente a partir da versão 5 do Flash


veio trazer, foi uma nova visão à forma como se encara o WebDesign.
Actualmente, a linguagem de programação ActionScript já é considerada uma linguagem
orientada para objectos totalmente interactiva.
Todas estas mais valias permitidas pelo ActionScript associadas a ficheiros leves,
característica fundamental do FLASH, tornam as aplicações resultantes totalmente
independentes da máquina e sistema operativo, trazendo uma nova geração de programas
que conseguem conciliar a animação com a programação ao seu mais alto nível.
Durante as várias aulas o aluno ficará apto a conceber soluções em flash, começando por
aprender processos simples de interactividade entre o utilizador e o flash, avançando aula a
aula os seus conhecimentos até à aula final em que o aluno desenvolverá um jogo, como meio
de aplicar os seus conhecimentos e ficar apto a desenvolver aplicações em Flash ao nível dos
melhores programadores a nível internacional.

3- Requisitos de aprendizagem

Foi considerado que o aluno já deve possuir alguns conhecimentos básicos de flash, que lhe
permitam identificar os termos: timeline, stage, library, movieclip e também já ter algum
conhecimento de HTML e JAVASCRIPT.

4- Flash – O explorador de ficheiros

Durante as aulas, pode acontecer que o código desenvolvido fique mais complexo e
movieclips ou scripts se percam no projecto de flash que está a ser criado. Através do
explorador de ficheiros todos esses scripts ou movieclips passam a ser detectáveis, deixando
de existir motivos para ficarem perdidos dentro do respectivo projecto.
Para se aceder ao explorador de ficheiros, o caminho é Window > Movie Explorer.

Página 23
Action Script “e-Learning”

Agora proponho que pratique um pouco criando alguns objectos e veja a reacção do
explorador de ficheiros.

5- Flash – O Stage

O stage como é designado no flash, representa a janela onde todos os acontecimentos têm
lugar, pode-se equiparar a um teatro, o stage é o palco onde os actores actuam.
Uma das características do stage é a possibilidade de se activar uma régua que permita
identificar a distância entre um objecto e o canto superior esquerdo do stage. A visualização
da régua pode ser activada ou desactivada acedendo ao menu “View > Rulers”. As medidas
apresentadas representam medidas utilizadas para impressão e design, diferem das medidas
cartesianas utilizadas pela matemática na medida em que a direcção do eixo dos yy é no
sentido inverso à da direcção representada pelas medidas cartesianas:

X
Y
Coordenadas em flash

6- Flash – Definições

O flash permite personalizar várias preferências, pede-se ao aluno que personalize o seu
ambiente de flash de forma a ficar em sintonia com os exemplos que serão apresentado no
seguimento da formação.
Para isso basta aceder às preferências em: Flash > Preferences e garantir que as fiquem
iguais à seguinte imagem:

Página 24
Action Script “e-Learning”

7- Convenções utilizadas

Para facilitar a compreensão dos exemplos utilizados pode ser que sejam usados diferentes
tipos de letra e cores que diferem das que escreverá nas suas aplicações, isto não implica que
o seu programa não funcione.

8- Exercício

Agora propõe-se a criação de um exemplo em flash que mostre a palavra “Olá Mundo”

Página 25
Action Script “e-Learning”

Página 26
Action Script “e-Learning”

AULA II – “Action Script - Iniciação”

1- Introdução

Nesta aula será dada alguma teoria, mas apenas a que considero exclusivamente necessária
para se entender alguns termos que serão utilizados no seguimento do curso.
No final da aula, mostrar-se-á o que se consegue apenas com duas linhas de código.
O aluno ficará a conhecer o conceito de Eventos, Comentários, Comandos, Argumentos,
Propriedades, Instruções e qual a sintaxe a utilizar.

2- Eventos no Flash

Quando se pensa em Action Script pensa-se em interactividade, no fundo trata-se de “fazer


acontecer coisas” mediante eventos causados pelo utilizador, por exemplo, abrir uma página
após um clique num botão.

Imagine um relógio de cuco, que a cada hora, o cuco sai do relógio e emite um som, imagine
também que se pode definir um alarme para que numa determinada hora o relógio comece a
fazer um barulho diferente servindo de despertador.
A estes acontecimentos chamam-se eventos e aos sons produzidos pelo relógio chamam-se
acções.
O ActionScript é conhecido como sendo uma linguagem de condução de eventos.

O que é então um evento no Flash?


Pode ser considerado como algo que acontece externamente, pode ser a pressão de um
botão pelo utilizador, ou a pressão de uma tecla do teclado. Pode também ser considerado
como algo que acontece dentro do flash, como carregar um filme ou mover-se para o próximo
frame, quando o flash desencadeia a acção de mover para o próximo frame ele verificará se
tem instruções associadas a esse evento e se as tiver, executa-as. A isso chama-se um
evento interno pelo facto de ser o flash a gerar esse evento.
Quer se tratem de eventos internos ou externos, o Flash trata-os da mesma forma:
ActionScripts estão preparados para detectar um evento em particular.
Uma vez ocorrido esse evento, uma série de ActionScripts serão executados.

Aos ActionScripts que são executados após a ocorrência de um evento chamam-se de


eventhandler.
Em conclusão, sempre que se pretender ter um evento, deve-se ter um evenhandler.
Por exemplo, imagine-se um botão que aguarda que o primam.
O utilizador pressionou o botão – EVENTO
O Flash detectou esse evento e executou o ActionScript que lhe estava associado –
EVENTHANDLER
O utilizador recebe o resultado.

Este tipo de relação evento/eventhandler é fácil de perceber quando se tratam de objectos


simples como botões, no entanto essa relação já não é tão linear quando se trata de eventos
gerados internamente pelo flash.

Página 27
Action Script “e-Learning”

OK, para quem já tem alguma experiência em programação e é novo na utilização de


linguagens de ActionScript deve estar a perguntar, afinal quais são as vantagens de utilização
da relação eventos/event handler?
A resposta é muito simples, quando se programa em linguagens como por exemplo em
VisualBasic, é sabido que são bastante boas na resolução de problemas em que o código é
executado linearmente, primeiro executa-se a linha 1, depois a linha 2 e por ai
sucessivamente.
Infelizmente na vida real, os acontecimentos não sucedem linearmente, por exemplo quando
se vai às compras é natural que não se siga a lista de compras linearmente tal como foi
planeada.
Dessa forma, como não se pode esperar que as coisas aconteçam pela ordem desejada terá
de se lidar com os acontecimentos pela ordem em que ocorrem.
Nunca se terá a certeza de que o evento A acontecerá antes do evento B, terá de se prever
que tanto A ou B podem acontecer em primeiro lugar.
Por esse motivo, ao contrario das linguagens de programação como o VisualBasic que é
interpretado sequencialmente, o ActionScript está preparado para dar resposta em tempo real
aos eventos assim que ocorrem.

Após esta breve introdução ao ActionScript está na altura de se começar a escrever algum
código.
Pode-se então agregar ActionScript a 3 situações num movieclip:
A um Keyframe
A um botão do Stage
A um movieclip do Stage

Para começar vamos começar pelo mais fácil dos 3:


Atribuir ActionScript a Keyframes
Para se atribuir um ActionScript a um keyframe, não é necessário ter mais do que um
keyframe, a janela “Frame Actions” e uma linha de código.
Vamos então, no nosso filme, seleccionar a primeira frame da Layer 1

Ainda com o frame seleccionado, abrir a janela “Frame Actions” que pode ser feito através de
uma das seguintes hipóteses:
Fazendo dois cliques consecutivos no frame (versão 5.0).
Acedendo ao menu “Window > Actions”.
Ou através da tecla de atalho que lhe está associada.

Página 28
Action Script “e-Learning”

Independentemente da forma como se abre a janela de ActionScript o resultado obtido será


semelhante a:

Esta janela difere de versão para versão do flash, mas em todas elas, do lado esquerdo
encontram-se todos os eventos que podem estar associados a um objecto, bem como todos
os comandos que podem ser utilizados dentro do evento, (condições de IF, funções para
tratamento de Strings, etc…). Quando é escolhido um comando ou acção de entre uma das
disponíveis do lado esquerdo, é passado automaticamente para o lado direito da janela com
as várias possibilidades que lhe são permitidas acontecendo apenas no modo Normal, porque
existe também o modo Expert que permite ao programador escrever código livremente sem
obter sugestões do flash, mas isso veremos mais adiante.
Escolhendo então uma das opções do lado esquerdo, a opção “Actions” seguida da opção
“Movie control” e da opção “Stop” obtém-se a primeira acção associada ao Keyframe
seleccionado.

Página 29
Action Script “e-Learning”

Esta acção é uma acção de grande importância, pois é através da Acção “Stop();” que se vai
poder parar o movie permitindo mostrar botões ficando o movie parado à espera por um
evento, que pode ser desencadeado por botões ou por outro tipo de elementos.

3- Comentários

Como vimos anteriormente, a acção “stop();” não é difícil de entender, mas existem outras
acções e/ou conjunto de acções que se tornam mais difíceis de entender, por esse motivo é
necessário escrever comentários para descrever melhor o código.
O método para se introduzir comentários no código é semelhante ao do C++, ou seja: // para
comentar uma linha de código ou /* …. */ para comentar um pedaço de código ou texto.
Para ajudar, no flash o código comentado fica a uma cor diferente da do restante código.
Finalmente fechando a janela de Actionscript pode-se verificar que o frame onde se inseriu o
script ficou com um “a” pequenino, serve para identificar frames que contenham scripts
associados.

Depois desta primeira experiência com ActionScript, é importante rever alguma da


terminologia da programação.
Tal como nas outras linguagens, também as instruções de ActionScript devem ser exactas, as
instruções dividem-se em três grupos bem definidos:
Comandos
Argumentos
Propriedades

4- Comandos, argumentos e propriedades

Os Comandos e Argumentos fazem sentido se os compararmos com quando os nossos pais


nos pedem para limpar o quarto, não no sentido de ordem mas pressupondo uma das
seguintes situações:
Quando se é o único filho e só existe um quarto para limpar, então os nossos pais não
necessitam de especificar que quarto devemos limpar.
Mas se existirem vários quartos e mais irmãos, então é necessário pelo menos
especificarem que quarto é para limpar.
No primeiro caso não é necessário adicionar mais informação ao pedido, basta
receber esse simples “comando” para se limpar o quarto.
No segundo caso, é necessário adicionar informação extra chamando-se a essa
informação extra “argumentos”.

O comando stop(); que vimos anteriormente não recebe qualquer argumento pois o flash sabe
o que deve fazer apenas com esse comando.

Página 30
Action Script “e-Learning”

Mas se for um comando diferente como por exemplo o comando gotoAndPlay(); já se torna
necessário passar argumentos para que o flash saiba para que frame deve ir, exemplo:
gotoAndPlay(10); em que o número 10 identifica que a frame de destino é a 10.
Passando para um nível de programação mais avançado temos as propriedades, no exemplo
dado anteriormente a propriedade do quarto é se está limpo ou se está sujo.
No flash as propriedades estão disponíveis no submenu “properties” da janela das Acções em
que deixando o rato sobre a propriedade desejada algum tempo surge um comentário que
explica a propriedade e os parâmetros que pode receber.
Juntando os comandos, argumentos e as propriedades obtém-se as instruções.

5- Instruções

Existem diferentes tipos de instruções mas todas elas encaixam-se numa das seguintes
categorias:
Faz este comando.
Faz este comando usando este argumento.
Altera esta propriedade de acordo com este argumento.
Se esta instrução é verdadeira então executa esta série de acções.
Continua a executar este grupo de instruções enquanto for verdadeiro qualquer coisa.

Se ainda nunca programou, então veja o seguinte exemplo:


Fica a fazer isto…
Meter água no copo
Enquanto o copo não estiver cheio

Meter água no copo é o número 2 da lista, o comando é pôr e o argumento é água no copo.

6- Sintaxe

Uma parte importante em cada linguagem desde a linguagem chinesa, egípcia á europeia, é a
ordem com que as frases são construídas, a sintaxe, não interessa em que linguagem se fala
mas espera-se ouvir as palavras segundo uma certa ordem para compreender o significado da
frase acabada de ouvir.
Contrariamente ás linguagens faladas o ActionScript apenas necessita de satisfazer alguns
requisitos de sintaxe que se podem dividir em três categorias:
1- Quando começa ou acaba uma acção individual
Cada acção básica começa numa nova linha e termina com ;
As únicas excepções são os comentários // e comandos de agrupar acções {}

2- Que parte da acção é o comando, o argumento e a propriedade?


// comentário
x = 10;
stop();
Stop = acção e dentro dos () estão os argumentos.

3- Que linha executar mediante uma certa condição se for aceite ou não e que conjunto
de acções devem ser executadas continuamente até que seja satisfeita uma
determinada condição.

Página 31
Action Script “e-Learning”

7- Resumo

Nesta aula vimos o que são comentários, comandos e argumentos e vimos como se atribui
uma acção

8- Exercício

Para que o aluno possa aplicar os conhecimentos adquiridos nesta aula propõe-se o
desenvolvimento de um exercício simples que corresponda a ter um circulo a movimentar-se
no ecrã e que pára no keyframe 55 com a acção “stop();”.

Para ajudar neste primeiro exercício vão ser explicados todos os passos a realizar:

1. Seleccionar a opção circulo da barra de ferramentas e desenhar um circulo no stage.

Página 32
Action Script “e-Learning”

2. Seleccionar o circulo com o rato e escolher a opção do menu “insert > Convert do
symbol” que normalmente corresponde à tecla de atalho F8.

3. Surge então uma janela com vários campos que podem ser escolhidos:

4. Desta janela pode-se escolher o nome que queremos atribuir ao novo símbolo e qual
deve ser o seu comportamento.
Pode ser do tipo Movie Clip quando se pretende ter Movie Clips dentro de
outros movie clips permitindo reutilizar um mesmo movie clip as vezes que se
quiser sem se ter a necessidade de o duplicar.
Pode ser do tipo botão sempre que se pretendam ter botões é necessário que
sejam símbolos com comportamentos de botão.
E gráficos quando se tratam de símbolos simples como é o caso do circulo a
animar.

Página 33
Action Script “e-Learning”

5. Depois de escolhido o “behavior” “Graphic” e feito OK, já temos um novo símbolo no


stage em substituição do circulo que foi desenhado no stage.

6. Note-se que para animar objectos é necessário que sejam símbolos de outra forma a
animação não acontecerá.

7. Agora é necessário criar alguns frames, para isso basta seleccionar o frame 40 e
inserir um novo Keyframe que pode ser feito através da tecla de atalho F6.

8. Agora é necessário seleccionar o frame 1 e no menu seleccionar “insert > creat motion
tweening”

Página 34
Action Script “e-Learning”

9. É a opção “Create Motion Tween” é que dá instruções ao flash para converter o


conteúdo da layer seleccionada entre keyframes em animação, que corresponde a
uma transformação de símbolos entre os keyframes. Essa transformação pode ser
uma simples translação no espaço. Para exemplificar, seleccione-se o ultimo
keyframe, na posição 40 e desloque-se o circulo. Se agora se testar já temos
animação, para testar seleccione a opção “control > Play”

10. Só falta inserir a acção “stop();” no keyframe 40 para terminar o exemplo de outra
forma quando se exportasse o projecto a animação ficaria em loop.

Página 35
Action Script “e-Learning”

Página 36
Action Script “e-Learning”

AULA III – “Action Script - Traçando planos”


1- Introdução

Nesta aula vamos rever a importância que há na elaboração de um bom storyboard


(planificação no papel do que será a aplicação final).
A regra principal é que se não funcionar no papel então também não vai funcionar no
computador.
Dada a diferença entre esta aula e aulas mais práticas, não será exigido muito esforço ao
aluno, sendo a aula bastante sintetizada.

2- Traçando planos

Como o Flash é mais do que uma linguagem de programação é necessário planificar no papel
antes de se começar a programar, tal como nos filmes existe um guião também no flash deve
existir um storyboard. Em primeiro lugar deve-se traçar um esboço do que se pretende,
mesmo que se tratem apenas de alguns riscos, esta fase tem uma importância redobrada
porque, para além de servir de orientação para o storyboard final serve também para expor
ideias perante o cliente que está a financiar o projecto.
Para facilitar a elaboração do primeiro esboço é importante possuir já um conjunto de
exemplos de partida “Libraria de ideias”.

3- Libraria de ideias

Possuir um conjunto de exemplos de partida para a elaboração de um esboço do que será o


sotryboard final é o sucesso de muitas empresas, ganhando tempo na elaboração desses
esboços e reutilizando trabalho já desenvolvido permite poupar custos e libertar meios
humanos para o desenvolvimento dos projectos depois de adjudicados pelas empresas que os
pretendem.
Quando a libraria é reduzida deve-se começar por desenvolver projectos mais simples e
gradualmente ir aumentando o grau de complexidade da oferta de serviços. Deve-se guardar
desde o primeiro dia todo o trabalho que se venha a desenvolver, pois será a partir desse
trabalho, de projectos concluídos e de projectos que não passaram da fase de storyboarding
que a libraria de ideias será enriquecida.

4- Storyboarding

Depois de um primeiro esboço é necessário aprofundar mais as ideias, é então que se passa
para a fase de Storyboarding.
O Storyboard deve constituir um meio de comunicação que permita transmitir as ideias que se
tem para o projecto a desenvolver, entre a equipa que irá desenvolver o projecto e o cliente
final.
Consultando vários livros relacionados com multimédia consegue-se encontrar diferentes tipos
de normas para realizar esses storyboards mas a verdade é que tratando-se de uma área que
tanto serve para desenvolver soluções mais vocacionadas para a animação, como soluções
mais vocacionadas para a programação, não existe nenhum modelo que seja considerado o
ideal e as empresas sejam levadas a criar os seus próprios modelos.

Do meu ponto de vista qualquer que seja o modelo escolhido deve satisfazer sempre os
seguintes requisitos:

Página 37
Action Script “e-Learning”

Existir uma descrição detalhada em forma de árvore, a hierarquia de cada menu.


Existir uma maquete em suporte digital do design que se pretende para cada menu.
No caso de animação deve existir em papel ou suporte digital um desenho dos
acontecimentos que ocorreram em cada keyframe.

Só depois de feitas todas as alterações que se considerem necessárias é que se passa para a
fase seguinte ao Storyboard que é a elaboração das artes finais.
É nesta fase de cada projecto que pode haver uma distinção clara entre as pessoas que
concebem o sotryboard, as pessoas que criam as maquetes/artes finais e as pessoas que irão
passar essas artes finais para uma linguagem de programação multimédia, neste caso, o
FLASH.

5- Construindo ActionScript

Estilo Top down


O estilo de programação Top Down é designado por método funcional, pois executa o
código linha a linha até chegar à solução final, ou seja, não conhece a solução final
enquanto não terminar o código que está a executar. Pode-se representar o código nos
diferentes níveis em forma de árvore que se ramifica em função das escolhas tomadas.

Estilo Botton Up
O estilo de programação Botton Up baseia-se em encontrar uma solução a partir dos
resultados obtidos e das pistas disponíveis, pode-se comparar ao trabalho que um
detective tem de realizar para solucionar um crime, devido à complexidade de se entender
este estilo de programação o curso incidirá apenas sobre o estilo Top Down.

6- Exemplos

Um storyboard pode ser tão simples como o seguinte exemplo:

Entrada do Site, através de uma curta animação em flash.


Menu inicial
• Imagem escolhida pelo cliente, ilustrada em flash, com algum movimento.
• Quem Somos
o O que é a empresa ( página com breve texto referente à empresa )
o Conselho de Fundadores ( pagina com o nome dos fundadores e links )
o Objectivos ( página com breve texto referente aos objectivos/missão)
o Instalações ( fotografias das instalações e localização )
• Actividades
o A decorrer ( página com breve texto referente às actividades em curso )
o Decorridas ( página com breve texto referente às actividades decorridas )
• Programas
o Áreas de actuação ( página com texto referente as áreas em que actua e programas
de actuação )
• Contactos ( 1 pagina com os contactos dos vários departamentos, com diferentes emails )

Neste exemplo, define-se em traços gerais que páginas vai ter o site e que informação irá
constar em cada uma dessas páginas.
Desta forma consegue-se passar a ideia que se tem para o site a qualquer pessoa, tanto ao
cliente como a algum outro colaborador que irá intervir na elaboração do projecto.

Página 38
Action Script “e-Learning”

7- Resumo

Como vimos nas explicações anteriores, o processo de storyboarding é de extrema


importância, quer para transmitir a ideia que se tem do projecto, que para nossa própria
orientação durante a elaboração da aplicação.
É importante também, manter actualizada uma libraria de ideias que trará vantagens a longo
prazo.

8- Exercício

Para treinar um pouco, propõe-se a elaboração de um storyboard que represente de uma


forma clara e sucinta, todos os passos que decorreram desde o inicio desta aula até ao seu
termo.

Página 39
Action Script “e-Learning”

Página 40
Action Script “e-Learning”

AULA IV – “ActionScript - Timeline Actions”


1- Introdução

Nesta aula serão apresentados os scripts que se podem atribuir à timeline. “Timeline significa
espaço de tempo, se comparamos a uma fita de um filme, sabemos que a fita é constituída por
milhares de imagens e quando vistas a uma determinada velocidade dão a sensação de
movimento, agora suponhamos que era possível parar o filme num determinado ponto e que
só recomeçaria quando se executasse uma determinada acção, essas acções são os
exemplos que vamos ver de seguida e a fita é a nossa timeline”.
O aluno ficará também a conhecer o conceito de Labels.

2- Timeline Paths

Sabendo que a timeline representa o espaço de tempo em que ocorrem as animações,


interessa saber que cada uma dessas animações pode ser a representação de um objecto que
também tem a sua própria timeline, assim podemos ter no mesmo programa a timeline
principal e as diferentes timelines de cada objecto, parece um pouco confuso, mas se
imaginarmos como estão organizadas as pastas do nosso computador sabemos que existe a
raiz que pode ser c: e as pastas umas dentro das outras, no flash sucede o mesmo, existe a
raiz que é o programa e que tem automaticamente uma timeline e cada objecto que pertença
ao programa é como se de uma pasta se tratasse.
A raiz pode ser representada por root ou por / e os objectos que são usados no programa
“apenas se forem do tipo movie clips” e se tiverem um nome atribuído por exemplo: “exemplo”
podem ser representados por: _root.exemplo ou por /exemplo.
Então o que são as Paths? as Paths aparecem na janela do stage de forma a identificar o
caminho até à timeline que está em modo de edição, permitindo regressar facilmente à
timeline anterior ou mesmo à raiz.

Página 41
Action Script “e-Learning”

3- Adicionando acções básicas à Timeline

A timeline pode ter várias acções associadas desde play() a acções mais complexas.
As 3 primeiras acções da janela de acções são:
Go to
Play
Stop

A acção Play() Permite retomar a execução de um movie após uma condição de paragem
criada através da acção stop().
Portanto a acção stop() permite parar a execução de um movie e a acção play() permite
retomar a execução desse movie.
Mas, podem estar a pensar, e se o movie parar como pode recomeçar? A acção stop() limita-
se a parar a execução do filme frame a frame, ou seja, se uma animação estava a correr pára,
mas os eventos do flash continuam activos, o que permite que se no frame onde foi executada
a acção stop() existir um botão que desencadeie a acção play(), essa acção é executada.

Outra acção que pode ser adicionada à timeline é a acção de salto Go to(), esta acção permite
reencaminhar a execução das animações para rumos diferentes, como se por exemplo se uma
linha de comboio que tivesse várias saídas e fosse mudando de rumo durante o percurso do
comboio. Esta acção é bastante útil para a criação de menus, imagine-se um menu com duas
opções, Quando se clicar na opção 1 vai-se para o frame 5, e clicando-se na opção 2 vai-se
para o frame 10, desta forma só se passa pelo frame 5 quando se escolhe a primeira opção.
Para se utilizar a acção Goto é necessário que essa acção seja completada com stop() ou
play(), derivando assim 2 acções que são nomeadamente:
GotoAndPlay()
GotoAndStop()

A primeira permite realizar saltos sem parar a execução da timeline.


A segunda permite realizar saltos mas parando a execução da timeline.

4- Adicionando Labels à Timeline

A possibilidade de se adicionar Labels à Timeline pode ser muito útil, a acção Go to, como
vimos anteriormente permite saltar da posição actual da timeline para o frame passado
parâmetro, GotoAndPlay(10), no entanto ficamos um pouco limitados se for necessário alterar
a duração das animações, o que implica ter de se alterar em todos os scripts o número do
frame passado por parâmetro para as acções de Salto, por forma a evitar este trabalho
forçado e dando mais flexibilidade ao flash pode ser atribuída uma label a um determinado
frame, para que da próxima vez que for necessário inserir uma acção de salto em vez de se
passar como parâmetro o número do frame passa-se a label (nome que identifica a frame).

Página 42
Action Script “e-Learning”

5- Exemplos

O próximo exemplo mostra como se pode utilizar as acções play(), stop() e gotoAndPlay()

1- No frame 1 inserir um botão e um texto, na timeline inserir o script stop();

Página 43
Action Script “e-Learning”

2. No Botão do frame 1 inserir inserir o script gotoAndPlay(10);

3. No frame 10 inserir um keyframe, botão e um texto, na timeline inserir o script stop();

Página 44
Action Script “e-Learning”

4. No Botão do frame 10 inserir inserir o script gotoAndPlay(1);

6- Resumo

Nesta aula foram dados conceitos sobre as acções stop(), play(), gotoAndStop(),
gotoAndPlay(), frames, e labels

7- Exercício

Propõe-se o desenvolvimento de uma animação que comece no frame 1 e salte do frame 10


para o frame 5, mas utilizando labels.

Página 45
Action Script “e-Learning”

Página 46
Action Script “e-Learning”

AULA V – “ActionScript - Começando a interactividade”


1- Introdução

Nesta aula vão ser transmitidas as informações necessárias para se começar a programar em
ActionScript, vai-se falar de botões e como associar eventos a botões ou a movieclips.
Relembrando aulas anteriores, um objecto pode ser do tipo botão, movieclip ou gráfico, um
objecto do tipo gráfico é usado para inserção de imagens estáticas na root ou dentro de um
movieclip, um objecto do tipo botão, como o próprio nome indica serve para criar botões que
permitem captar eventos típicos dos botões e um objecto do tipo MovieClip serve tanto para
inserir programas completos dentro do flash como simples animações.

2- Criar um botão

Para se criar um botão deve-se fazer:


Desenhar um circulo e convertê-lo para símbolo do tipo botão, clicar duas vezes seguidas
em cima do símbolo para o editar.
Verificar se a timeline deixou de ter frames numerados para passar a ter apenas quatro
frames com as designações de Up, Over, Down, Hit.
Seleccionar o frame Over e inserir um keyframe, o mesmo para o frame Down e Hit.
Agora temos o circulo duplicado em cada keyframe, o frame Up deve conter o símbolo que
vai aparecer por defeito, o frame Over deve conter o símbolo que vai aparecer quando o
rato se sobrepor a ele, o frame Down deve conter o símbolo que vai aparecer quando se
clica sobre o botão e o frame Hit deve conter o símbolo que representa a área de acção
que vai detectar se o cursor do rato está sobre o botão.
Agora sai-se do modo de edição do Botão, com o botão feito vamos lhe atribuir uma
acção, para isso com o botão seleccionado chama-se a janela das acções, insere-se a
acção pretendida, por exemplo: gotoAndStop(1);
A acção que foi atribuída ao botão deve estar inserida dentro de um evento, normalmente
o flash escreve logo o código necessário para que a acção funcione correctamente, se o
flash não inserisse esse código seria necessário em vez de se escrever simplesmente
gotoAndStop(1); seria necessário escrever:
on (release){
gotoAndStop(1);
}
Uma noção importante a ter é que a { deve estar sempre na linha do evento que a chama
porque se o script fosse escrito da seguinte forma:
on (release)
{
gotoAndStop(1);
}
não iria funcionar.

3- Interactividade com MovieClips

Uma das particularidades novas nas ultimas versões do flash é a de permitir adicionar eventos
também a movieclips
O processo de se adicionar um evento a um Movieclip é igual ao de se adicionar um evento a
um botão, no entanto os eventos que se podem atribuir a um Movieclip podem ser muito mais
complexos que os dos botões. Por exemplo, imagine-se um movie com várias animações,

Página 47
Action Script “e-Learning”

obviamente irão demorar algum tempo a carregar o que é sempre desagradável e pode levar o
utilizador a distrair-se e quando dá conta já a animação começou a correr, para evitar que
isso aconteça e de forma a garantir que o utilizador vê a animação toda, basta ter um botão de
começar que só depois de pressionado é que a animação começa, esse botão pode aparecer
depois do movie ter sido todo carregado.
Como se pretende que o utilizador clique em qualquer região do ecrã para continuar pode-se
fazer um botão do tamanho do stage, mas desagradavelmente iria ficar sempre visível o cursor
que aparece sempre que passa por cima de um botão, para dar a volta a esse problema o
ideal era ter um movieclip que permitisse comportar-se como um botão sem alterar o cursor do
rato.
Para se atribuir então o script ao MovieClip, o código seria:
onclipEvent(mouseDown){
// qualquer coisa
}
Como se verifica, os eventos são captados de forma diferente da dos botões, num botão basta
escrever onRelease enquanto que num movieclip tem de se escrever
onClipEvent(mouseDown).
Agora aconselha-se a ver os restantes eventos que podem ser atribuídos a um movieclip.

4- Exemplos

Vou agora exemplificar a utilização dos eventos que se podem associar a botões e a
movieclips para fazer um jogo muito simples, o jogo consiste em ter uma pista de automóveis,
uma linha de partida e uma linha de chegada, assim que o rato clicar no botão começar tem de
percorrer a pista sem que o cursor do rato saia da sua área e só termina quando chegar à
linha de chegada e clicar no botão terminar.
1- Deve-se desenhar uma linha com alguma espessura e convertê-la para botão
2- Deve-se inserir um botão na linha de partida
3- Deve-se inserir um botão na linha de chegada
4- Deve-se inserir uma label chamada start, outra chamada perdeu e outra chamada
ganhou.
5- No frame 1 insere-se uma acção de stop();
6- No botão de inicio do jogo insere-se a acção gotoAndStop(“start”);

Página 48
Action Script “e-Learning”

7- Nos frames a que dão acesso a label start deve-se atribuir ao botão que representa
a pista a acção: gotoAndStop(“Perdeu”);

8- E no botão da meta insere-se a acção gotoAndStop(“Ganhou”)

9- Uma particularidade importante é a de que os eventos captados pelos botões


diferem entre si, o botão de inicio, capta o evento Release, que é chamado quando
se clica com o rato sobre o botão. O Botão que representa a pista, capta o evento
RollOut que é chamado quando o rato sai da sua superfície. O botão de fim, capta
o evento RollOver que é chamado quando o rato passa por cima do botão.

10- Agora, propõe-se ao utilizador que ponha em prática este exemplo.

Página 49
Action Script “e-Learning”

5- Resumo

Nesta aula ficou-se a saber como captar os eventos que o rato desencadeia sobre botões e
sobre Movieclips, ficou-se também a saber como se pode apenas com pouco código e través
da captação dos eventos do rato, fazer um jogo simples.
Também se ficou a saber como atribuir labels aos frames de forma a facilitar a navegabilidade
entre frames.

6- Exercício

Propõe-se que o aluno altere o exercício anterior e em vez dos botões de inicio e fim utilize
MovieClips.

Página 50
Action Script “e-Learning”

AULA VI – “ActionScript - Truques de navegação”


1- Introdução

Para completar os conhecimentos adquiridos até agora e para desvendar alguns dos segredos
que alguns sites escondem, vou apresentar alguns truques que se podem utilizar para criar
efeitos interessantes.

2- Botões invisíveis

Um dos truques trata-se de criar botões invisíveis que podem ser facilmente colocados sobre
objectos animados permitindo mascarar todo o tipo de objectos e/ou imagens.
Para se criar um botão invisível o processo é igual ao de criar um botão normal, a diferença é
que para se obter um botão invisível deve-se apagar todos os objectos dos frame Up, Over e
Down, mantendo-se apenas o objecto no frame hit.

Depois de criado o botão pode-se visualizar no stage que o botão mudou de aparência, para
um azul transparente.

Página 51
Action Script “e-Learning”

3- Ligar Cenas

Por defeito quando se cria um programa em flash tem-se logo disponível uma timeline e uma
Cena que aparece com a designação de scene, no entanto o flash está preparado para ter
várias cenas com essa possibilidade, pode-se separar por várias cenas os links que partem de
um menu, no fundo cada cena comporta-se como se de um novo programa se tratasse, com a
particularidade de que se um objecto existir em várias cenas é carregado apenas uma vez
contrariamente a se tivesse vários programas independentes entre si.

4- Ligar Labels

Outra característica do flash é a de permitir ter várias labels, como vimos anteriormente
facilitam a criação de links dentro do flash as labels podem estar dispersas por várias cenas
que o flash consegue detectá-las na mesma.

5- Ligar MovieClips

Os movieclips podem ser sobrepostos uns aos outros, o que está á frente ficará á frente dos
outros, desta forma podem-se sobrepor animações umas às outras.

6- Ligar SWFs e Níveis

Para além de se poder organizar o programa de flash através de cenas, labels e com
movieclips, também se podem ter vários swfs já compilados e em tempo real carregá-los para
um determinado nível como se fossem layers.
O movie que chama o swf externo situa-se sempre no nível 0, o swf pode ser carregado para o
nível que se quiser. Convém saber que sempre que se carrega um swf para um nível os outros
swfs que possam ter sido carregados para a memória e o movie principal não param a sua
execução, continuam a correm em background e se tiverem botões eles continuam a
funcionar, assim é conveniente não sobrepor movies a botões.
Para se carregar o swf o comando que se deve utilizar é loadMovieNum(“nome do swf, 1) o
segundo parâmetro é o nível. Também se pode utilizar o comando loadMovie(“nome no
movie”,”nome do swf”), é outra forma de se carregar um swf que permite substituir um
movieclip que já exista no stage pelo swf.

7- Adicionar animações a botões

Criar botões animados não é complicado, simplesmente possuem movieclips nos frames up,
Over e Down. Uma sugestão, não insiram animações no frame hit a menos que queiram criar
confusão.

Página 52
Action Script “e-Learning”

8- Janelas deslizantes

Como já devem ter visto em alguns sites de flash, existem janelas que se podem deslocar
dentro de um programa de flash ora não é muito complicado conseguir essa proeza.

Vou então explicar como se podem criar janelas deslizantes:

1- Deve-se criar um novo movie, basta ter 800x600 pixels.

Página 53
Action Script “e-Learning”

2- Depois, Cria-se um movieclip que será a nossa janela, o Design fica à


responsabilidade de cada um. Acrescenta-se também no frame 1 a acção stop();

3- Editar o movieclip da “janela” e criar um segundo keyframe no frame 2 igual ao do


frame 1.

Página 54
Action Script “e-Learning”

4- Criar uma segunda layer com o nome de ícones e criar 2 ícones que representem a
opção de minimizar a janela e a opção de fechar a janela. Criar também outro ícone
que represente a opção de maximizar que deve ser colocado na layer ícones na frame
2, naturalmente na segunda frame a janela deve ter uma aparência de minimizada.

5- Depois de criados todos os objectos, apenas falta atribuir nomes à labels e criar
botões invisíveis sobre os ícones. Para isso criam-se keyframes nos 3 primeiros
frames com a acção de stop() em cada um deles (sim no 3 primeiros frames, o ultimo
irá apontar para nada, pois será o frame que é chamado pelo botão de fechar janela).
Ao primeiro keyframe dá-se o nome à label de “full”.

Página 55
Action Script “e-Learning”

6- Ao segundo keyframe o nome de “small”

Página 56
Action Script “e-Learning”

7- E ao terceiro o nome de “blank”.

8- Depois Criam-se 3 botões invisíveis que devem ser colocados numa layer à frente das
restantes. O botão de fechar a janela deve ter o script gotoAndStop(“close”);

Página 57
Action Script “e-Learning”

9- O botão de minimizar a janela deve ter o script gotoAndStop(“small”);

10- A barra que permite à janela deslocar-se deve ter os scripts startDrag(“”); e
stopDrag();

Página 58
Action Script “e-Learning”

11- No segundo keyFrame, a única alteração a fazer é no script do botão de maximizar


que deve ter o script gotoAndStop(“full”);

12- E é tudo, se testar já tem uma janela deslizante.

9- Resumo

Nesta aula ficou a saber construir botões invisíveis que podem ser aplicados a várias
situações, como por exemplo à construção de janelas deslizantes como se viu no ultimo
exemplo.
Os conhecimentos adquiridos nesta aula vão ser bastante úteis no futuro, pois a utilização de
botões invisíveis é o que mais se utiliza hoje em dia na construção de Sites.

10- Exercício

Propõe-se ao Aluno que complete o exemplo anterior de forma a que a sua janela se
assemelhe o mais possível ás janelas das outras aplicações, com Titulo, texto, botões de
fechar, maximizar, restaurar e minimizar.

Página 59
Action Script “e-Learning”

Página 60
Action Script “e-Learning”

AULA VII – “ActionScript - Variáveis”

1- Introdução

As variáveis no flash são tratadas da mesma forma que noutras linguagem de programação,
existem vários tipos de variáveis: numéricas, de caracteres e booleanas.
As variáveis numéricas tanto podem representar números inteiros (27 ou –15), como números
com casas decimais (3,142).
As variáveis de caracteres podem representar qualquer tipo de caracter e não tem limite
definido, por exemplo: Sham, Hello, a1b2c3.
As variáveis booleanas apenas representam 2 estados, true ou false.
Quando se torna necessário guardar estes diferentes tipos de dados, em algumas linguagens
de programação e necessário definir o seu tipo antes de as utilizar, em ActionScript tal não é
necessário pois trata-se de uma linguagem untyped, o que representa que não é necessário
especificar o tipo de dados que a variável vai guardar, para alem disso as variáveis em
ActionScript podem guardar diferentes tipos de dados em momentos diferentes.

2- Literais e expressões

O método mais simples para se atribuir um valor a uma variável é através do sinal (=).
O método mais simples para se especificar o que se pretende guardar é através da utilização
de valores literais.
Então, quando se pretender guardar um nome numa variável em ActionScript chamada
meunome faz-se da seguinte forma: meunome="aderito";
Neste caso "aderito" trata-se de um literal do tipo caracteres pois encontra-se entre duas
aspas.
Se em alternativa se pretendesse guardar um literal inteiro bastava fazer: minhaidade=27;
Depois de o flash interpretar estas duas linhas de código as variáveis poderiam ser utilizadas
para substituir os valores que guardaram, por exemplo se fosse escrita a seguinte linha de
código:
resultado=minhaidade - 10;
A variável resultado passava a conter o valor 17 que é o resultado da operação 27-10.
A esta ultima operação dá-se o nome de expressão pois trata-se de outra forma de atribuir
valores a variáveis.
É importante realçar que a gestão dos tipos de variáveis são da responsabilidade do
programador pois se a=2 e b=3 então a+b=5 mas se a="fa" e b="ca" então a+b="faca" e se
a="fa" e b=3 então a+b="fa3".
É importante saber de que tipo são as variáveis, para evitar misturas convém que as variáveis
numéricas se mantenham sempre numéricas e vice-versa.

3- Variáveis de Input

Ate agora apenas se explicaram quais os tipos de variáveis existentes e como lhes atribuir
valores, vamos então exemplificar com um exemplo como podem ser realmente úteis em para
isso vamos guardar caracteres.

Página 61
Action Script “e-Learning”

Vai ter de se criar um campo de input, é obvio que se queremos guardar um valor que o
utilizador insira terá de existir um campo de input, para isso selecciona-se o ícone de texto

E cria-se uma caixa de texto no stage

Página 62
Action Script “e-Learning”

Depois é necessário alterar o tipo de texto de static para input

Atribui-se lhe um nome

E pronto, já temos uma variável chamada nome que guarda os valores que o utilizador venha
a inserir.

4- Variáveis de output

Para se criar uma variável de output o processo é igual ao de criar uma variável de input em
que a única diferença reside em que no tipo de variável, em vez de ser input deverá ser
dynamic, crie então uma variável de output com o nome resultado.

Página 63
Action Script “e-Learning”

Agora se no flash se acrescentar um botão com o script resultado = nome + "ww" vai
acontecer que o valor inserido vai aparecer no campo de output com os caracteres "ww"
acrescentados.

5- Atribuir nomes às variáveis


O nome que se pode dar a uma variável pode ser o que se entender desde que não colida
com alguns nomes que são reservados.
Os nomes que estão reservados ao flash e que não podem ser utilizados como variáveis são:
break, continue, delete, else, for, function, if, in new, on, return, this, typeof, var, void, while e
with.
Também os símbolos:
{}, ;, () não podem ser usados como variáveis.
Também convém não preceder nenhuma variável com // ou com /* pois são indicadores de
comentário e as variáveis não são interpretadas.
Também os operadores são reservados, +-/* os espaços também não dever ser usados, deve-
se optar por _ para substituir os espaços numa variável.
E por ultimo uma variável não pode ser precedida de dígitos.
Resumindo são representações correctas de variáveis:
Vaca
Menu8
Label7c
Off
São representações incorrectas
On
Label 7
6cmenu
My-toys
Uma nota importante é que o flash é case sensitive, ou seja, os comandos se não forem
escritos correctamente em letras maiúsculas e minúsculas não funcionam, mas relativamente
as variáveis já não e case sensitive.

6- Variáveis numéricas

Para se utilizarem variáveis numéricas basta que o valor atribuído à variável seja um valor
numérico, mas caso se pretenda criar uma variável de input que só receba valores numéricos
é necessário fazer algo mais.
Se analisarmos a janela das propriedades de um campo de texto do tipo input, conseguimos
detectar um conjunto de botões que permitem embeber no documento final de flash, fontes e
conforme se activam esses botões, dá-se ordem ao flash para embeber apenas caracteres
numéricos, texto, símbolos ou todos.
Portanto quando se pretender um campo de input que apenas receba valores numéricos, só
se deve seleccionar o botão de embeber caracteres numéricos.

Página 64
Action Script “e-Learning”

7- Variáveis booleanas

Tal como para se utilizarem variáveis numéricas basta que o valor atribuído à variável seja um
valor numérico, também para se utilizarem variáveis booleanas basta atribuir o valor true ou
false à variável.

8- Actionscript – Objectos, propriedades e métodos

Tal como nas linguagens de mais alto nível a utilização do conceito de objectos continua a ser
mais usada, também o flash permite lidar com objectos.
Quando se pensa em variáveis como representações reais como por exemplo chocolates
então uma caixa de chocolates pode ser considerada um objecto.
Os objectos providenciam meios para guardar e manipular valores.
No flash existem vários tipos de objectos mas provavelmente é o objecto movieclip que é mais
facilmente entendido, assim vou começar por explicar o comportamento, propriedades e
métodos desse tipo de objecto.

Página 65
Action Script “e-Learning”

Se no frame 1 inserirmos a acção a.play(); então o objecto a recebe o método play(); que lhe
diz para iniciar a sua execução.

Tal como existe o método play(); existem muitos outros métodos que podem ser objectos na
janela das acções “Action frame”.
Sendo um objecto também dispõe de propriedades que servem para obter e/ou alterar
algumas características do objecto, uma das características mais interessante é a de se obter
a localização do objecto em relação ao stage sob o formato x/y. Mais adiante veremos as
vantagens em manipular esta propriedade dos objectos.
Se pensarmos em grande, importa dizer que um objecto do tipo movieclip pode ser um swf
externo que é carregado em tempo de execução e que pode ter vários movieclips dentro de
movieclips infinitamente, ora isso é muito interessante, imagine-se que se tem um documento
de flash “swf” que se chama relogio.swf, nem se faz a menor ideia como foi programado
apenas se sabe que é um relógio que mostra as horas, caso não esteja protegido (é possível
proteger os swfs de forma a não poderem ser importados para outras aplicações de flash),
pode ser utilizado na nossa aplicação de flash, exemplificando:

Página 66
Action Script “e-Learning”

9- Exemplos

Deve-se criar um objecto do tipo movie clip e atribuir-lhe um nome, por exemplo relógio

No frame 1 insere-se o seguinte código: loadMovie(“relogio.swf”, “relogio”);

Página 67
Action Script “e-Learning”

E o resultado obtido será:

10- Resumo

Nesta aula deram-se conceitos sobre Literais e expressões, explicaram-se quais os diferentes
tipos de variáveis de Input/Output que podem ser utilizados no flash, explicou-se como atribuir
nomes às variáveis e qual a diferença entre variáveis numéricas, variáveis booleanas e strings.
Por último, explicou-se o conceito de Objectos e quais as suas propriedades e métodos.

11- Exercício

Propõe-se a criação de um movieclip que corresponda a uma janela, tal como se vio na aula
anterior, e um novo movie clip que através do script loadMovie(“janela.swf”, “janela1”); e
loadMovie(“janela.swf”, “janela2”); substitua 2 moviclips pelo mesmo janela.swf.
Pretende-se com este exercício que explicar a possibilidade de se reutilizar o mesmo
movieclip externo várias vezes dentro de outro movieclip.

Página 68
Action Script “e-Learning”

AULA VIII – “ActionScript - Loops”

1- Introdução

Neste ponto de aprendizagem, já conseguimos que o flash realize instruções básicas, saltar
entre frames, controlar acções dos botões, mas ainda não lhe conseguimos dar instruções que
o faça agir de uma forma inteligente. Na aula anterior aprenderam-se conceitos básicos de
manipulação de variáveis, nesta aula vão ser dados conceitos de loop e da utilização de
variáveis para a tomada de decisões provocando com que as apresentações de flash ajam de
uma forma inteligente e que tenham comportamentos mais convincentes.

2- Tomada de decisões

Em termos de tomada de decisões, o flash limita-se a um comando, o if. Este comando, pode
ser complementado com else e elsif para lhe conferir mais funcionalidade.
Antes de começar a explicar a estrutura if-elsif-else, vejamos como se tomam as decisões na
vida real.
“Eu vou hoje ao Concerto de Rock se não estiver a chover”
É mais provável pensar-se assim:
“Se eu tiver dinheiro suficiente e não estiver a chover, vou hoje ao concerto de Rock”
Agora a decisão já não é baseada apenas na condição de não estar a chover, mas também na
condição de ter dinheiro suficiente.
Para se converter estas duas condições para o flash de uma forma que ele consiga entender,
é necessário seguir uma determinada simbologia, como se de uma nova linguagem se
tratasse.
Escrevendo de uma forma simplista, o que se pretende é que o flash entenda:
If (Não está a chover) and (tenho dinheiro suficiente)
{Vou ao concerto}

3- “if”

Então as simbologias a seguir são:


Todas as condições devem começar com o comando if.
Logo após o comando if deve vir entre ( parêntesis ) a condição.
No final do parêntesis deve abrir-se uma chaveta {.
Na linha de baixo deve vir as acções a realizar caso a condição seja satisfeita.
No fim das acções a realizar deve-se fechar a chaveta }.

If ( condição ) {
Acções
}

No exemplo anterior, se existissem duas variáveis, esta_chover e tenho_dinheiro em que


eram inicializadas a 0 e sem em algum ponto do programa fossem actualizadas, caso
estivesse a chover a variável esta_chover ficava com o valor 1 e se tivesse dinheiro suficiente
a variável tenho_dinheiro ficava com o valor 1, então a condição seria escrita da seguinte
forma:
If (esta_chover == 0) and (tenho_dinheiro == 1) {
Acções
}

Página 69
Action Script “e-Learning”

4- “elseif”

Se os cálculos que o flash teria de fazer em cada condição fossem bastante demorados então,
podia-se separar as condições em dois if’s, em que o segundo só era testado se o primeiro
fosse verdadeiro. Nesse caso o código ficaria:

If (esta_chover == 1) {
Acções
}elseif (tenho_dinheiro == 1){
Acções
}

5- “else”

Para além do elsif, também se pode utilizar o comando else para executar acções sempre
que a condição de if não for satisfeita com sucesso.
A principal diferença ente o else e o elseif, é que só se pode usar um comando de else por
cada condição de if, enquanto que o comando elseif pode ser usado quantas vezes for
necessário, desde que esteja após uma condição de if e antes de alguma instrução de else.
Por exemplo:

If (esta_chover == 1) {
Acções
}elseif (tenho_dinheiro == 1){
Acções
}else{
Acções
}

6- ActionScript loops

Um ActionScript loop existe não entre frames diferentes mas no próprio frame que contém
código que lhe permite entrar em loop sem que saia desse frame.
Convém advertir, que se for criado um ActionScript que num único frame contenha código que
mova um objecto no stage de um lado para outro, o resultado que se iria obter não seria
equivalente ao deslocamento continuo desse objecto, mas apenas a um salto da posição
inicial até à posição final obtida após completar o loop. Isto deve-se ao facto de que o flash
apenas actualiza os objectos do stage quando muda de frame.
Portanto, a utilização de ActionScript loops é bastante útil quando se pretende realizar cálculos
que necessitem de um tempo de resposta muito rápido.
Como se realizam então esses loops?
Tal como para as condições existe uma simbologia própria, também para se escrever código
para a realização de loops é necessário respeitar uma determinada simbologia.
O comando que permite dizer ao flash que vai começar uma condição de loop é o while, que
pode funcionar isoladamente, exemplo:

While (a<10){
Acções
a=a+1;
}

Página 70
Action Script “e-Learning”

Ou então, pode ser usado da seguinte forma:

do{
Acções
a=a+1;
} While (a<10);

A diferença da primeira para a segunda forma de se escrever as condições de loop, é que a


primeira condição de loop primeiro verifica se é verdadeira e só depois executa as acções,
enquanto que na segunda primeiro são executadas as acções, pelo menos uma vez e só
depois é testada a condição de loop.
Deve-se tomar as devidas precauções de forma a evitar criar condições de loop intermináveis,
pois o resultado levaria a aplicação a bloquear.
Outro comando que permite criar condições de loop é o comando for, este comando é útil,
sempre que se pretendam escrever condições de loop que terminem após se terminar uma
sequência de valores, em vez de se ter mais duas linhas de código, que seriam necessárias
utilizando o comando while, recorrendo ao comando for conseguem-se evitar essas duas
linhas de código, exemplo:

contador = 0
while ( contador < 10 ) {
Acções
contador++;
}

A alternativa seria:

for ( contador = 0; contador < 10; contador++ ){


Acções
}

7- Arrays

Um Array é uma variável que contém uma sequência numérica para localizações de memória.
Em cada uma dessas localizações de memória, podem ser guardados diversos tipos de
dados, na prática uma variável do tipo Array assemelha-se a um armário com gavetas, a
variável identifica o armário e cada localização de memória corresponde a cada gaveta que
contém dados armazenados.
A sintaxe de uma variável do tipo Array é variavel[posição de memória], por exemplo se
quisermos guardar um valor na posição de memória 1 da variável numeros faríamos da
seguinte forma:

numeros[1] = 4;

Ao valor correspondente à posição de memória do Array costuma-se dar a designação de


offset.
Sempre que se atribui um valor a uma posição de memória do Array, o flash cria essa entrada,
portanto se existir uma variável que lhe tenham sido atribuídos valores para a posição 1 e 4,
só essas posições de memória é que foram criadas, não existe a posição de memória 2 e 3.

Página 71
Action Script “e-Learning”

Caso se pretenda definir à prior todas as posições de memória que se pretendam, então deve-
se utilizar o comando new Array(número de entradas), por exemplo:
numeros = new Array(5); // Foram criadas 6 entradas no array numeros, sim 6
entradas porque o zero também conta no flash.
Também se podem passar valores automaticamente para a variável a criar da seguinte forma:
numeros = new Array(1, 6, 4, 6);
nomes = new Array(“casa”, “carro”, “mobília”);
numeros = new Array(); // Neste caso, apenas se define que a variável vai ser do tipo
Array.

8- Exemplos

Vou exemplificar a utilização dos conceitos anteriores através da construção de um exercício


que tem como finalidade calcular o factorial de um número.
Relembrando o que é o factorial de uma número, corresponde a multiplicar esse número pelo
seu correspondente anterior sucessivamente até chegar ao valor 1.
Por exemplo, para calcular o factorial de 4 deve-se fazer os seguintes cálculos:

4 * 3 * 2 * 1 = 24

Para escrever um script simples que calcule o factorial de um número vou recorrer à
recorrência, ou seja, vou chamar consecutivamente uma função enviando-lhe todos os valores
que vão ser calculados, e ela me devolverá o resultado do ultimo valor a multiplicar pelo
anterior. Os valores seriam passados da seguinte forma:
1- O resultado será: 4 * B, em que B = Calcula (4–1)
2- O resultado de B será: 3 * C, em que C = Calcula (3-1)
3- O resultado de C será: 2 * D, em que D = Calcula(2-1)
4- O resultado de D será: 1
5- Logo o resultado de C será 2 * 1 = 2
6- O resultado de B será 3 * 2 = 6
7- O resultado final será 4 * 6 = 24

Estas vão ser todas as iterações que a função que vou escrever vai realizar, e o processo
ilustrado anteriormente chama-se recorrência, em que se pode verificar que utilizei sempre a
mesma designação “Calcula”.

Um outro conceito novo que vou utilizar é o recurso a funções, vou criar uma função chamada
factorial que recebe como parâmetro um valor que vai ser guardado na variável numero.

A função pode ser escrita da seguinte forma:

function factorial(numero){
if(numero > 0){
return numero * factorial(numero – 1);
}
else
{
return 1;
}
}

Página 72
Action Script “e-Learning”

Para além da função vou criar uma variável de input denominada de “numero” e uma variável
de output denominada de “res”.
Por fim, crio um botão que vai conter o script:

on (release) {
res = factorial(numero);

function factorial(numero){
if(numero > 0){
return numero * factorial(numero – 1);
}
else
{
return 1;
}
}
}

Se não quisesse recorrer a recursividade, a função teria de ser escrita de outra forma, por
exemplo:

on (release) {
res = factorial(numero);

function factorial(numero){
res = 1;
while(numero > 0){
res = res * numero;
numero = numero–1;
}
return res;
}
}

Página 73
Action Script “e-Learning”

9- Resumo

Nesta aula foi dado um passo importante na clarificação entre o flash e a programação em
ActionScript, foram dados conceitos importantes sobre a utilização de condições e sobre a
utilização de mecanismos de loop. Testou-se o primeiro exemplo de programação de alto
nível.

10- Exercício

Pretende-se que o aluno escreva uma aplicação que dado um número, consiga determinar se
esse número é ou não um número primo, ou seja, se apenas é divisível por ele próprio e pela
unidade (1).

Página 74
Action Script “e-Learning”

AULA IX – “ActionScript - Interactividade avançada”


1- Introdução

Nesta aula vão ser explicados conceitos sobre classes, como manipular de objectos e qual a
importância de se criar mecanismos de pré carregamento de páginas.
Como já vimos em aulas anteriores, todo o conceito do flash gira à volta de objectos, quer
sejam movieclips, botões ou gráficos, vimos também que cada um desses objectos possui
propriedades e métodos, vimos também que em alguns casos tivemos de atribuir um nome
aos movieclips de forma a os podermos manipular, a esse nome chama-se instanciação.

2- Instanciação

Quando se começa a aprender na escola a ler e a escrever, primeiro aprendem-se as palavras


e gradualmente vai-se passando para os conceitos de verbos e de gramática, com o flash
acontece o mesmo, instancias são apenas mais um passo num processo de aprendizagem
que vai ficando cada vez mais complexo. No flash, quase tudo pode ser alterado, chamando-
se a esse modelo de modelo orientado para objectos.
Como é que o flash funciona?
Considerando os objectos elementares como gráficos, botões e movieclips, que após serem
instanciados com nomes que os representem, passam a poder ser totalmente manipulados
através de ActionScript, pois passaram a ter uma referencia que os identifica, a sua instancia.
Sabendo que objectos do tipo botões e gráficos não podem ser instanciados a menos que se
altere o seu tipo de comportamento para movieclip dá-nos a sensação que o mais importante é
a instanciação, mas não é totalmente verdade. Na realidade todos os movieclips têm nomes
instanciados, mesmo que não lhe tenhamos atribuído um.
O flash atribui nomes automaticamente começando em instance1, ... a instancen. Se
experimentarmos criar 3 movieclips e chamar o debuger, consegue-se visualizar que cada
movieclip tem o seu nome instanciado.

Página 75
Action Script “e-Learning”

OK, então se o processo de se instanciar um nome aos objectos não é o mais importante, o
que é?
É o facto de se saber que o que se está a controlar é um movieclip, ou seja, um objecto.
Sempre que existirem objectos similares, podem ser agrupados em classes.

3- Classes – métodos, propriedades, comportamentos

Uma classe corresponde a um termo de programação que descreve um template para um


objecto, corresponde a descrever uma lista de coisas que todos os objectos pertencentes a
essa classe conseguem fazer.
Uma classe chamada planta deve corresponder a um template que deve ter:
O nome da planta
A altura da planta
A cor da flor
O mês em que a flor desabrocha
O tipo de solo para a planta

Um objecto em particular do tipo planta deve ter como características todas as propriedades
descritas na classe, por exemplo: roseira, 10cm, vermelha, Maio, normal.
No flash cada classe tem três categorias que nos interessam:
Métodos
Propriedades
Comportamentos

Os métodos são instruções que se podem passar aos objectos de uma determinada classe
de algo que se pretende que eles venham a realizar.
Já se sabe o que esperar quando se invoca o método nome_da_instancia.play(); trata-se de
um método que só se pode invocar a um objecto do tipo movieclip, não pode ser usado em
botões nem em gráficos, neste caso o método a invocar chama-se play().
Já Som.setVolume(100); e numero_de_letras=frase.length; tratam-se de métodos que só
podem ser invocados a objectos de certas classes. No primeiro caso o método setVolume
serve para alterar o volume do som de um objecto pertencente á classe chamada som, no
segundo caso trata-se de obter o número de caracteres de um objecto pertencente à classe
string.

Como se pode constatar pelos exemplos anteriores, a invocação de métodos processa-se


sempre da mesma forma, nome_da_instancia.<método><argumentos>;
A única complicação no meio disto tudo, é que para se poder invocar alguns métodos em
alguns movieclips, é necessário escrever o caminho até ao objecto.
Relembrando as paths dadas nas primeiras aulas, alguns movieclips para poderem invocar
métodos de outros movieclips que estejam fora da árvore geneológica a começar no movieclip
que pretende invocar o método, torna-se necessário escrever o caminho todo até ao movieclip
pretendido, exemplo: root.nome_do_movieclip.metodo.
Resumindo: path.nome_da_instancia.<método><argumentos>

As propriedades são pedaços de informação que juntos definem tudo o que pretendemos
saber sobre um membro da classe. Relembrando a classe planta, era composta por 5 valores,
em programação as propriedades podem dar mais informações para além daquelas que foram
criadas na classe. Uma propriedade pode representar um determinado valor de um objecto ou
pode representar algo que pretendemos que o objecto realize.

Página 76
Action Script “e-Learning”

Por exemplo, se definirmos uma classe denominada sprite, podendo ter como propriedades, o
nome, a posição no eixo dos xx, yy, a velocidade e direcção sobre o eixo dos xx e yy, se o
sprite atingiu outro e o nome do outro sprite que foi atingido, podemos obter facilmente os
valores dessas propriedades, atribuindo-os a variáveis e/ou escrever outras propriedades que
alterem esses valores.
O flash possui uma lista de propriedades que se podem obter e/ou manipular acedendo à
janela das Properties -> Actions. Importa referir que a maior parte dessas propriedades só
podem ser usadas em objectos do tipo movieclip.

Os Comportamentos correspondem à forma como os objectos realizam determinadas


acções, no flash todos os objectos da mesma classe possuem o mesmo tipo de
comportamentos o que torna o processo de programação bastante simplificado, pois espera-
se que um objecto do tipo movieclip se comporte como um filme, com frames, que corra a x
frames por segundo etc...

Não á muito mais a dizer sobre os comportamentos, excepto se pretendermos animar um


objecto do tipo gráfico, face às suas características, a única forma é a de alterar o seu tipo de
comportamento de botão para movieclip.

4- Definição de objectos (Movieclips, objectos não gráficos)

Um objecto em flash corresponde a uma classe que foi inicializada para incluir uma série de
propriedades que a torna única.

Página 77
Action Script “e-Learning”

Por exemplo, enquanto um movieclip se encontra na libraria de objectos, apesar de ser uma
classe não possui quaisquer propriedades, mas assim que é arrastado para o stage, são lhe
atribuídas automaticamente uma série de propriedades (ganha logo as propriedades
correspondentes à classe sprite, “posição x, y”), o mais importante é o nome da instancia que
não se sabe qual é até se lhe atribuir um nome, enquanto não se atribuir uma instancia ao
objecto, não se pode invocar os seus métodos, portanto instancias são diferentes de objectos,
é importante ter essa noção bem presente.
Para além dos objectos que já foram apresentados anteriormente, existem outro tipo de
objectos, objectos que podem ser criados através de ActionScript, a esses objectos costumam
chamar-se objectos não gráficos.
Objectos não gráficos podem ser por exemplo:
letras = new Array(10);
som = new Sound();

Ambos os comandos seguem a mesma regra, um objecto passa a existir assim que lhe for
atribuído um nome.
Agora que já se adquiriram conhecimentos sobre classes, objectos, propriedades, métodos e
comportamentos, pode-se começar a criar realmente bom material.

5- Interactividade Avançada e propriedades dos objectos

Podemos usar todo o conhecimento adquirido sobre a estrutura do flash de forma a ter
controlo directo sobre o que acontece no interior do flash através de ActionScript. Já não é
necessário preocuparmos com “tween animations” porque tudo pode ser feito através de
código com garantias de um controlo mais elevado usado ActionScript.
Começando por exemplificar o poder deste método vejamos com dois exemplos, preloads e
cache.

6- Preloads e Cache

A maior parte dos iniciantes gosta de ter preloads nos seus sites, mas na maior parte das
vezes confundem o preload com um intro, inserindo os preloads dentro de intros pesados
levando muitas vezes o utilizador a não esperar pelo botão de skip intro e a abandonar o site.
Então o ideal é ter um intro que enquanto decorre, o flash vai carregando o menu do site.
Mas o que acontece se o utilizador clicar no botão de skip intro, ou porque não lhe apetece
visualizar o intro, ou porque já o viu anteriormente e o menu ainda não ter carregado?
É para evitar que isso aconteça que deve existir o preload, mas no menu principal e que
informe do progresso do carregamento desse mesmo menu.
Desta forma, evita-se fazer preload do intro e do menu, tornando o preload demorado,
consegue-se que durante o intro o menu vá carregando para a cache e caso o utilizador clique
no botão de skip intro antes do menu estar totalmente carregado em cache, entra em
funcionamento o preload.

Como na maior parte das vezes os designers não conseguem manipular formas de fazer
preload de objectos no flash gradualmente, optam por fazer um site em que apenas o menu
principal é feito em flash e cada link redirecciona para uma janela em html ou flash, o que
torna as coisas um pouco confusas.
Para dar a volta a esta questão o truque é muito simples:
Deve-se criar um menu bastante leve, apenas com objectos que representem a zona dos
menus e da informação, esses objectos devem ser do tipo movieclips.

Página 78
Action Script “e-Learning”

Depois insere-se nessa página um préload para garantir que todo o flash é carregado em
cache e todos os scripts vão funcionar nos respetivos sítios.
E por fim faz-se o load de cada movie para os respectivos locais.

7- Exemplos

Um dos processos mais simples de se programar um mecanismo de préload numa página, é


por exemplo ter uma animação a dizer “a carregar, aguarde .....” e um keyframe no frame 1,2 e
3 respectivamente.
Na timeline, no keyFrame 2 coloca-se o script:

ifFrameLoaded (<número máximo de frames>){


gotoAndPlay(4);
}

E no frame 3, o script:

gotoAndPlay(2);

Página 79
Action Script “e-Learning”

Outro processo mais profissional, é através da utilização de processos de loading com


informação ao utilizador da percentagem de elementos carregados estimando o tempo que
falta para terminar de carregar o resto da página.

Página 80
Action Script “e-Learning”

Por exemplo, se na frame 1 tiver-mos o script

/:time0 = getTimer();
/:loaded0 = _root.getBytesLoaded();
/:total0 = _root.getBytesTotal();

Passamos a ter nessas 3 variáveis respectivamente o tempo de inicio da aplicação de flash na


variável time0, a variável loaded0 vai sendo actualizada constantemente com o numero de
bytes já lidos para a cache e a variável total0 vai conter o numero total de bytes que vão ser
necessários carregar para cache, quando a variável loaded0 for igual à variável total0, a
aplicação de flash já está toda em cache e pode prosseguir com as restantes animações.

Página 81
Action Script “e-Learning”

No frame 2 pomos o script:

/:iteration = number(/:iteration)+1;

Esta variável vai contar o numero de loops que já decorreram, para que através dessa variável
e do tempo já decorrido se possa estimar o restante tempo que falta para carregar o resto do
movie.

Página 82
Action Script “e-Learning”

No Frame 3 é que vai ser necessário inserir o maior conjunto de scripts:

/:timer1 = getTimer();
/:loaded1 = _root.getBytesLoaded();
/:loaded2 = int(number(/:loaded1)/1000);
/:timesum = number(/:time1)-number(/:time0);
/:loadsum = number(/:loaded1)-number(/:loaded0);
/:avtimesum = number(/:timesum)/number(/:iteration);
/:avloadsum = number(/:loadsum)/number(/:iteration);
/:conectionspeed = int((number(/:avloadsum)/number(/:avtimesum))*10)/10;
/:percent = int((_root.getBytesLoaded()/_root.getBytesTotal())*100);
setproperty(“_root.loadbar”,_yscale,number(/:percent));
setproperty(“_root.loadbar2”,_xscale,number(/:percent));
/:timerleft = (int((number(/:total)-
number(/:loaded1))/number(/:connectionspeed)/100))/10;
if(_root.getBytesLoaded()==_root.getBytesTotal()){
_root.gotoAndPlay(“site”);
}else{
gotoAndPlay(“loop”);
}

Todas estas linhas de código servem para actualizar o valor das variáveis identificadas por /:
que podem ser utilizadas como se desejar.

Página 83
Action Script “e-Learning”

E por fim, na frame 5 põe-se por exemplo o script gotoAndPlay(“20”); para avançar para as
animações propriamente ditas.

8- Resumo

Nesta aula deram-se conceitos sobre instanciação, objectos, métodos, propriedades e como
manipular a cache programando mecanismos de préload.

9- Exercício

Pretende-se que o aluno crie uma nova scene numa das aplicações já desenvolvida em aulas
anteriores e que programe um mecanismo de préload nessa scene.

Página 84
Action Script “e-Learning”

AULA X – “ActionScript – ActionScript Modular, processos de


clonagem, teoria dos jogos”
1- Introdução

Nesta aula vou apresentar um exemplo em veremos o flash a funcionar em todo o seu
potencial, vou explicar como se podem criar objectos que tenham comportamentos diferentes
simultaneamente no mesmo espaço de tempo e que ao mesmo tempo o utilizador tenha
controlo absoluto sobre um desses objectos. O exemplo que vou usar para exemplificar todos
os passos necessários para o efeito, será o da realização de um jogo que consiste em ter
várias naves inimigas e uma nave que possa ser controlada pelo utilizador.
Durante a explicação de cada passo a realizar para a concepção do jogo irá permitir ao aluno
ficar a conhecer mais algumas características do flash para manipulação de objectos.
O exemplo vai ser enviado ao aluno por email, para que o possa testar e melhor compreender
todo o processo.

2- Conceitos sobre jogos, Exemplo:

Existem vários conceitos sobre esta matéria, mas vou explicar apenas o necessário para se
compreender como se vai realizar o jogo.
Praticamente vão existir dois grandes comportamentos no jogo, aqueles que são
desencadeados pela acção do utilizador e aqueles que são desencadeados automaticamente
pelo sistema.
Relativamente aos acontecimentos que vão ser desencadeados pelo utilizador temos a
mudança de posição da nave boa e o disparo de balas, relativamente aos acontecimentos
desencadeados pelo sistema temos a mudança de posição de cada nave inimiga e o disparo
de balas.
Podemos partir do pressuposto de que se o utilizador mover o rato, a nave boa deve mover-se
sobre o eixo dos xx na medida correspondente ao deslocamento do rato e se o utilizador clicar
no rato deve ser criado um objecto bala boa.
Quando a bala boa é criada, deve ter como propriedades a sua posição no eixo dos xx yy e a
qual a próxima acção que deve realizar.
O mesmo se passa em relação a cada nave inimiga, quando o sistema as cria pela primeira
vez deve-lhes atribuir propriedades correspondentes à sua posição no eixo dos xx yy e qual a
próxima acção a desempenhar.
Tudo isto é muito interessante, mas como fazer com que cada nave e balas interajam ao
mesmo tempo?
O processo é muito simples, imagine-se que cada acção acontece num determinado espaço
de tempo, a bala e as naves alteram as suas posições simultaneamente, criando nesse
mesmo momento a sua próxima acção a realizar que pode ser mover ou morrer ou criar um
novo objecto.
Pode estar a parecer um pouco confuso, será mais fácil começar a visualizar-se algo.

3- Criar os objectos

Vamos começar por criar os actores do nosso filme


A nave boa
A nave inimiga
A bala boa
A bala inimiga

Página 85
Action Script “e-Learning”

4- Criar o script que coloque todos os objectos nas posições correctas e que iniciasse
todas as variáveis que vão ser utilizadas:
// inimigo = 3,2,1
// bala = 5

var obj_num;
var objectos_number;
var number_objectos;
var n_obj_inimigos;

Esta função vai permitir que a função Initialize() só seja executada uma vez
if (!initialized) {
Initialize();
initialized = true;
}

Esta função vai inicializar as variáveis e criar as naves inimigas


function Initialize () {
n_obj_inimigos = 0;
obj_num = 0;
objectos_number = [];
// num + tipo + accao
number_objectos = 0;
// A função cria_inimigo vai criar uma nave inimiga e põe-na na posição
cria_inimigo(30, 50);
x/y relativamente ao stage, passada por parâmetro
cria_inimigo(100, 50);
cria_inimigo(170, 50);
cria_inimigo(240, 50);
}

Esta função vai criar uma bala boa, nesta função vai-se ver pela primeira vez que todos os
objectos devem ter uma instancia e essa instancia deve ser guardada num repositório de
objectos. Neste caso o repositório trata-se de um vector que por cada objecto deve guardar 3
valores, o primeiro valor deve corresponder a um número único, para isso uso uma variável
obj_num que por cada objecto criado é incrementada um valor.
Deve existir uma variável que guarde o número de objectos que já foram criados e estão
guardados no repositório de objectos, trata-se da variável number_objectos, é essa variável
que vai permitir evitar que se guardem objectos no vector objectos_number em posições onde
já existam outros objectos.

Define-se também que todas as balas boas devem ter a instancia igual a b1, b2, b5, ..., bn
Para isso, atribui-se a uma variável auxiliar o nome que se pretende utilizar para identificar o
objecto bala que vai ser criado, chamei-lhe name.
Portanto se fizer name=”b”+obj_num; a variável name poderá ficar com o valor “b7” por
exemplo.
Depois vou duplicar o movieclip que corresponde ao objecto bala e que lhe atribui uma
instancia chamada “b”, o método que vou utilizar para esse efeito é o método
“duplicateMovieClip(<nome da instancia a criar>, <Numero do objecto>)”.

Página 86
Action Script “e-Learning”

Então, através do código b.duplicateMovieClip(name,obj_num); vou obter um novo movieclip,


colonado a partir do movieclip “b” e dou-lhe o nome passado por parâmetro na variável
“name”, bem como um identificador único passado pela variável “obj_num”.

Depois de criar o objecto, necessito de criar uma variável que possa manipular as
propriedades desse objecto, então para criar essa variável o flash fornece a função eval(),
fazendo var newPiece = eval(name); corresponde a criar uma variável chamada newPiece que
instancia com o objecto chamado “b7” se for esse o valor da variável “name”.
Depois de ter a variável “newPiece” já posso invocar os métodos do objecto e alterar as suas
propriedades.
As propriedades que me interessam alterar, são a posição da bala relativamente ao eixo dos
xx e yy e como eu quero criar a bala a partir da posição actual da nave boa, tenho de atribuir
as propriedades do objecto nave à bala, para isso faço newPiece._x = nave._x e newPiece._y
= nave._y-10 .

Como vimos em lições anteriores, a propriedade _x e _y correspondem a propriedades de


movieclips que nos dão a posição do movieclip em relação ao stage.
Depois de criar a bala e de a colocar na posição correcta, só falta guardar esse novo objecto
no repositório de objectos, para isso uso o código:
“objectos_number[number_objectos*3]=obj_num;” para guardar o numero do objecto.
“objectos_number[number_objectos*3+1]=5;” para guardar o tipo de objecto.
“objectos_number[number_objectos*3+2]=1;” para guardar qual deve ser a próxima acção que
o objecto deve realizar.
O valor 5 passado como segundo parâmetro corresponde a dizer ao sistema quando estiver a
percorrer o repositório de objectos, que o objecto é uma bala, cada tipo de objecto tem o seu
número próprio.
O valor 1 passado como terceiro parâmetro corresponde à acção que o objecto deve realizar
quando o motor do sistema as pretender realizar, cada objecto pode ter a sua linguagem
própria, neste caso o valor 1 corresponde a dizer que a bala deve deslocar-se na posição
vertical ascendente um determinado número de pixels.
// Bala = 5
function cria_bala () {
obj_num++;
number_objectos++;
var name = "b"+obj_num;
b.duplicateMovieClip(name, obj_num);
var newPiece = eval(name);
newPiece._x = nave._x;
newPiece._y = nave._y-10;
newPiece.PieceNumber = obj_num;
objectos_number[number_objectos*3] = obj_num;
objectos_number[number_objectos*3+1] = 5;
objectos_number[number_objectos*3+2] = 1;
}

Esta função vai criar uma bala inimiga, todo o processo é semelhante ao usado para criar a
bala boa, vejamos que as diferenças apenas se baseiam no nome das instancia para o objecto
bala inimiga que é “bala_inimiga” e o número que identifica o tipo de objecto que é “6”.
// Bala inimiga = 6
function cria_bala_inimiga (inimigo) {
obj_num++;
number_objectos++;
var name = "bala_inimiga"+obj_num;
bala_inimiga.duplicateMovieClip(name, obj_num);
var newPiece = eval(name);
newPiece._x = inimigo._x;
newPiece._y = inimigo._y;
newPiece.PieceNumber = obj_num;

Página 87
Action Script “e-Learning”

objectos_number[number_objectos*3] = obj_num;
objectos_number[number_objectos*3+1] = 6;
objectos_number[number_objectos*3+2] = 1;
}

Esta função vai criar uma nave inimiga.


// inimigo = 3
function cria_inimigo (x, y) {
n_obj_inimigos++;
obj_num++;
number_objectos++;
var name = "inimigo"+obj_num;
inimigo.duplicateMovieClip(name, obj_num);
var newPiece = eval(name);
newPiece._x = x;
newPiece._y = y;
newPiece.PieceNumber = obj_num;
objectos_number[number_objectos*3] = obj_num;
objectos_number[number_objectos*3+1] = 3;
objectos_number[number_objectos*3+2] = 1;
}

5- No mesmo frame as funções que correspondem aos métodos de cada objecto


Esta função vai executar os métodos do objecto bala inimiga e devolver um valor que identifica
a acção a executar da próxima vez.
O valor “j” passado por parâmetro corresponde ao identificador para o objecto, que permite
saber a sua posição automaticamente do repositório de objectos.
Uma função nova é a função check_perigo() que vai tentar saber se a bala acertou ou não na
nave boa.
function f_bala_inimiga (j) {
// 1 - Desce
// 2 - Desaparece
var name = "bala_inimiga"+objectos_number[j*3];
var newPiece = eval(name);
newPiece._y = newPiece._y+20;
if (newPiece._y>500) {
return -1;
}
if (newPiece._y>435) {
return check_perigo(newPiece._x);
}
return 0;
}

Esta função vai executar os métodos do objecto bala boa tal como a função anterior para as
balas inimigas.
function f_bala (j) {
// 1 - Sobe
// 2 - Desaparece
var name = "b"+objectos_number[j*3];
var newPiece = eval(name);
newPiece._y = newPiece._y-20;
if (newPiece._y<20) {
return -1;
}
if (newPiece._y<100) {
return check_colisao(j, newPiece._x);
}
return 0;
}

Esta função recebe dois identificadores para dois objectos e vai tentar calcular se esses
objectos colidiram ou não, se sim devolve um valor se não devolver 0. Esta função apenas se
aplica à bala boa em conjunto com as naves inimigas.
function check_colisao (j, x) {
for (l=1; l<=number_objectos && l<>j; l++) {
if (objectos_number[l*3+1]<=3) {

Página 88
Action Script “e-Learning”

var name = "inimigo"+objectos_number[l*3];


var newPiece = eval(name);
if (newPiece._x-x<15 && newPiece._x-x>-15) {
objectos_number[l*3+1] = objectos_number[l*3+1]-1;
objectos_number[l*3+2] = objectos_number[l*3+2]+10;
return -1;
}
}
}
return 0;
}

Esta função vai tentar calcular se alguma bala inimiga acertou na nave boa, se sim executa o
método play() do objecto instanciado pelo nome “vidas” que corresponde a um movieclip que
vai decrementando o número de vidas e quando chegar a zero o jogo acaba com uma
mensagem de “perdeu”. Simultaneamente para dar a sensação de explosão, também se
invoca o método gotoAndPlay(6) da instancia “nave”, o que provoca um efeito de flash.
function check_perigo (x) {
if (nave._x-x<15 && nave._x-x>-15) {
// levou um tiro
nave.gotoAndPlay(6);
vidas.play();
return -1;
}
return 0;
}

Esta função contém os métodos de cada nave inimiga, desde levar um tiro a mover-se a criar
aleatoriamente uma bala através da função random(), não é necessário explicar o resto da
função, é muito idêntica às funções anteriores.
function f_inimigo (j) {
if (objectos_number[j*3+1]<=0) {
n_obj_inimigos--;
if (n_obj_inimigos<=0) {
gotoAndPlay (3);
}
return -1;
}
// Morre
var name = "inimigo"+objectos_number[j*3];
var newPiece = eval(name);
var numero = random(20);
if (numero == 3) {
cria_bala_inimiga(newPiece);
}
if (objectos_number[j*3+2]>10) {
// esta a mover e levou um tiro
newPiece.gotoAndPlay(6);
objectos_number[j*3+2] = objectos_number[j*3+2]-10;
}
// Desloca para a direita
if (objectos_number[j*3+2] == 1) {
if (newPiece._x+20<620) {
newPiece._x = newPiece._x+20;
} else {
objectos_number[j*3+2] = 2;
}
}
// Desloca para a esquerda
if (objectos_number[j*3+2] == 2) {
if (newPiece._x-20>20) {
newPiece._x = newPiece._x-20;
} else {
objectos_number[j*3+2] = 1;
}
}
return 0;
}

Esta função é executada quando o utilizador clica com o rato.


function Click () {

Página 89
Action Script “e-Learning”

cria_bala();
}

6- Funções auxiliares
Para simplificar o código criaram-se algumas funções auxiliares que ajuda a compreender
todas as linhas de código.
As acções são “Acção()” que invoca os métodos do objecto passado por parâmetro e devolve
a próxima acção desse objecto.
function Accao (j) {
if (objectos_number[j*3+1] == 5) {
return f_bala(j);
}
// Bala boa
if (objectos_number[j*3+1] == 6) {
return f_bala_inimiga(j);
}
// Bala inimiga
if (objectos_number[j*3+1]<=3) {
return f_inimigo(j);
}
return 0;
// inimigo
}

“Delete()” que remove um objecto através do método removeMovieClip(), é útil para remover
naves inimigas que tenham sido atingidas e balas que já não interessem.
function Delete (x) {
// Remove bala
if (objectos_number[x*3+1] == 5) {
var name = "b"+objectos_number[x*3];
var newPiece = eval(name);
newPiece.removeMovieClip();
}
// Remove bala inimiga
if (objectos_number[x*3+1] == 6) {
var name = "bala_inimiga"+objectos_number[x*3];
var newPiece = eval(name);
newPiece.removeMovieClip();
}
// Remove inimigo
if (objectos_number[x*3+1] == 0) {
var name = "inimigo"+objectos_number[x*3];
var newPiece = eval(name);
newPiece.removeMovieClip();
}
remove(x);
}

Para além de se removerem os objectos do stage, também é necessário remover o seu registo
do repositório de objectos, é o que faz a próxima função.
function remove (Pos) {
posicao = Pos;
for (j=Pos; j<=number_objectos-1; j++) {
objectos_number[j*3] = objectos_number[j*3+3];
objectos_number[j*3+1] = objectos_number[j*3+4];
objectos_number[j*3+2] = objectos_number[j*3+5];
}
objectos_number[j*3] = "null";
objectos_number[j*3+1] = "null";
objectos_number[j*3+2] = "null";
number_objectos--;
}

Página 90
Action Script “e-Learning”

7- Motor do jogo
A função mais importante é esta, é a função que faz com que tudo funcione e, como se pode
constatar são apenas 4 linhas de código.
Esta acção está constantemente em loop, quanto mais rápido melhor, ela invoca os métodos
de todos os objectos e só depois é que é feito o refresh ao ecrã passando para o frame
seguinte, desta forma, sempre que o ecrã é actualizado todos os objectos já foram
actualizados o que dá a sensação de que todos se movem ao mesmo tempo.
function Accoes () {
for (j=1; j<=number_objectos; j++) {
if (Accao(j) == -1) {
Delete(j);
}
}
}

8- Variáveis e funções que devem ser invocadas sempre que se entra no frame
Para que tudo funcione, é necessário que sempre que o flash entra neste frame execute a
função Accoes() e actualize as variáveis pos_x e mouseh e actualize a posição do objecto
nave em relação aos valores lidos pela variável mouseh correspondente à posição do rato em
relação ao eixo dos xx
pos_x = getProperty("/cenario", _x);
mouseh = getProperty("/cenario", _x);
setProperty ("/nave", _x, mouseh);
Accoes();

9- Resumo

No final desta aula o aluno já adquiriu todos os conhecimentos necessários para desenvolver
boas soluções em flash.
Através da manipulação de objectos em tempo real, torna-se possível manipular o flash em
tempo de execução, sem ser necessário recompilar o projecto.

10- Exercício

Pretende-se que o aluno com base no exemplo do jogo anterior, faça o seu próprio jogo em
que vários objectos sejam criados por ActionScript através da clonagem de MovieClips e que
ambos se movam simultaneamente.

Página 91
Action Script “e-Learning”

Página 92
Action Script “e-Learning”

AULA XI – “ActionScript - PHP”


1- Introdução

Actualmente o futuro dos Sites, passa pelo dinamismo e por manter a informação
constantemente actualizada, para isso existem várias linguagens de programação que
permitem gerar páginas HTML a partir de conteúdos retirados de Bases de Dados. De entre
todas as linguagens, as mais conhecidas são o ASP da Microsoft, JSP, XML e PHP. A que vou
utilizar para explicar as potencialidade que o flash tem na construção de conteúdos dinâmicos,
vai ser o PHP devido à sua compatibilidade entre vários sistemas operativos e por não ter
custos de licenças.
Como é conhecido, a maioria dos sites que podem ser actualizados a partir de bases de
dados, tem de apresentar as páginas em HTML ficando algo limitadas em termos de
animação. Ora isso já não tem de ser verdade, o flash já dispõe de todas as ferramentas
necessárias, para que os seus conteúdos possam também ser actualizados a partir de bases
de dados, que se tratem de conteúdos de texto ou imagem.

2- Interacção entre o Flash e o PHP

Como é que se actualiza então um pedaço de texto no flash, após ter sido compilado?
O processo é simples e único, o flash dispõe de um método que lhe permite enviar e receber
valores de variáveis através de POST ou GET.
Quando se chama uma página HTML através do método POST, todos os valores contidos nas
variáveis do flash, são passadas para essa página, e todos os valores dessa página podem
ser passados para o flash. Desta forma, conseguem-se passar valores e receber valores, é
tudo o que é necessário para tornar os conteúdos do flash, actualizáveis após a sua
compilação.

3- O que é o PHP

Antes de avançar mais convém transmitir alguns conhecimentos básicos de PHP para que
mais facilmente se possa tirar o total partido das suas potencialidades.
Um página de php é equivalente uma página HTML apenas difere na extensão .php que
permite ao servidor web chamar o plugin correspondente que irá interpretar todos os
comandos de php que estejam embebidos no ficheiro.
Para que o servidor saiba distingir os comandos de php do resto da página, é necessário que
esses comandos estejam inseridos na página entre dois comandos especiais que dão a
indicação de começo de código php e de fim de código php. Esses comandos são
respectivamente <?php para dar indicação de inicio de código php e ?> para dar a indicação
de fim de código php.
Portanto, se tivermos uma página HTML e lhe pretendamos adicionar comandos de php, teria
de se alterar a extensão do ficheiro para .php e inserir o código php da seguinte forma:
<html>
<body>
.....
<?php
// instruções de php
?>
</body>
</html>

Página 93
Action Script “e-Learning”

As instruções de php podem ser inseridas em qualquer região da página, não tem de ficar
dentro das tags <body> </body>.

4- Comandos básicos de PHP

De entre todos os comandos do php, aquele que mais interessa é o que permite escrever
dados na página, esse comando é echo ”qualquer coisa”;
Todos os comandos de php devem terminar com ponto e virgula ; .
O comando php permite escrever na página a string que lhe é dada por parâmetro, ou os
valores contidos em variáveis, por exemplo:
$a=”texto”;
echo $a;
Mais uma novidade, as variáveis são definidas com o caracter $, sempre que se pretenda
utilizar uma variável, deve começar por $.
Tal como vimos na definição de variáveis para o ActionScript, também o php não necessita
que se definam os tipos de variáveis, pode-se perfeitamente atribuir o que se quiser a uma
variável, desde números, caracteres a objectos sem que se tenha de definir o tipo de variável.
Relativamente ao php pouco mais será necessário abordar para se começar a criar páginas
em flash que interajam com o php.

5- Exemplos

Se quisermos ter uma página que envie uma string para uma página de flash, bastaria fazer:
No flash ter uma variável chamada nome.
Criar um botão no flash que executasse o script: loadVariables("nomes.php", "/", "POST");
Em que a página nomes.php teria apenas o seguinte código:
&nome=<?php echo “Meu nome”; ?>
O &nome corresponde à variável que é enviada da página de php para o flash e “Meu nome”
é a string que é passada como parâmetro. Portanto, o flash vai receber uma variável chamada
nome como o valor “Meu nome”, como o flash já dispõe de uma variável com esse nome,
então essa variável é instanciada com a variável passada por parâmetro.
Por outro lado, se essa variável já contivesse algum valor, após a chamada da função
loadVariables, o php receberia o valor da variável que podia utilizar bastando por exemplo
fazer echo $nome;.
Como vimos é muito fácil enviar valores do flash para o php e vice versa.
Na próxima aula será dado um exemplo da passagem de parâmetros entre o flash e o PHP

6- Resumo

Nesta aula deram-se conceitos básicos sobre linguagens de programação dinâmicas, no caso
concreto do PHP, deram-se ainda algumas luzes sobre a passagem de valores entre o flash e
o PHP

7- Exercício

Propõe-se que o aluno escreva em PHP uma função que calcule o factorial de um número,
esse número é dado como parâmetro ao abrir a respectiva página, por exemplo:

http://localhost/factorial.php?numero=4

Página 94
Action Script “e-Learning”

CAPITULO XII – “ActionScript – troca de informação com Bases


de Dados”
1- Introdução

Vimos na aula anterior como transferir valores entre o flash e uma página de php e vice-versa,
mas essa troca de informação só é realmente útil de o objectivo for o de actualizar páginas de
flash com dados dinâmicos, que estejam em constante actualização. Estou a falar por exemplo
num site de comércio electrónico em que o preço dos produtos pode mudar a qualquer
momento, a solução para um site desse género, actualmente, passa por criar páginas em
tempo real, que podem ser por exemplo em php, caso se pretendesse que o site fosse em
flash, sempre que necessitasse de se alterar os preços dos produtos tinha de se gerar
novamente os swfs, mas com a possibilidade de troca de informações entre o flash e uma
página de php isso já não é verdade, pode-se ter um site de comércio electrónico totalmente
desenvolvido em flash e sempre que o preço dos produtos se altera numa base de dados,
também eles se alteram na página.

2- Como utilizar o PHP para trocar informações com Bases de Dados

A troca de informações entre o php e o flash, como vimos anteriormente é feita de uma forma
muito simples, basta escrever na página a variável que vai ser actualizada e o respectivo
parâmetro &variavel=”parâmetro”. Todo o trabalho de obter os valores da base de dados é
realizado pelo php, para exemplificar esse processo, vou recorrer a exemplos com bases de
dados MySql.
Considerando que já existe uma base de dados mysql e uma tabela de nomes com o campo
ID e o campo nome.

SITE
BD
nome PHP FLASH

Para se criar uma página php que leia valores de uma base de dados MYSQL, basta ter uma
página com o seguinte código:

<?php
$hostname_t = "127.0.0.1:3306";
$database_t = "nome_da_base_de_dados";
$username_t = "root";
$password_t = "password";
$t = mysql_pconnect($hostname_t, $username_t, $password_t) or
die(mysql_error());
mysql_select_db($database_t, $t);
$query_Recordset1 = "SELECT * FROM nome";

Página 95
Action Script “e-Learning”

$Recordset1 = mysql_query($query_Recordset1, $t) or die(mysql_error());


$row_Recordset1 = mysql_fetch_assoc($Recordset1);
$totalRows_Recordset1 = mysql_num_rows($Recordset1);
?>
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<?php echo $row_Recordset1['Nome']; ?>
</body>
</html>
<?php mysql_free_result($Recordset1); ?>

Para se passar o valor obtido pela variável Nome para o flash, como se viu em aulas
anteriores basta escrever echo &nome=$row_Recordset1['Nome'];

3- Cuidados a ter com o delay das comunicações

No meio deste processo todo existe um factor que pode pôr em causa o bom funcionamento
das comunicações entre o flash e as bases de dados, trata-se nomeadamente do delay das
comunicações.
Para evitar que o programa de flash mostre uma página antes de ter recebido os valores da
base de dados, tem de se garantir que essa página só aparece depois do flash receber todos
os valores da página de php. Para isso deve-se iniciar uma variável com um valor 0 e que
ficará em loop até que o php lhe envie essa variável com o valor 1 junto com os valores das
outras variáveis, a melhor forma de se entender o processo é através de exemplos

4- Exemplos

Vou exemplificar como receber um texto que esteja dum ficheiro de texto.

Primeiro vou criar um ficheiro de texto onde vou escrever o seguinte código:

&texto=bla bla bla


&fim=1

o “&” representa uma variável, a variável texto será usada pela aplicação de flash para
apresentar o texto passado por parâmetro que neste caso é “bla bla bla” e a variável fim
devolve o valor 1 para que o flash saiba que já recebeu todos os valores que tinha a receber.

Página 96
Action Script “e-Learning”

Depois de escrever o código indicado em cima, grava-se esse ficheiro com o nome “texto.txt”
para a mesma pasta onde será guardado o ficheiro compilado .swf

Depois cria-se um ficheiro em flash, pode-se lhe dar o nome de browser e criam-se keyframes
nas frames 1,2,3,4 e 5

Na primeira frame inicia-se a variável fim com o valor 0

Na segunda frame chama-se a função interna do flash chamada:


loadVariables (<nome do ficheiro>,<destino>,<método>)

Página 97
Action Script “e-Learning”

É através desta função que podem ser passados os valores das variáveis do flash para uma
outra página ou dessa página para o flash.

Na frame 4 verifica-se se já se receberam os valores das variáveis e enquanto não se


receberem fica em loop.

Por fim atribui-se à nossa variável o valor recebido por parâmetro identificado pela variável
“texto”.

Pelo exemplo anterior constata-se que é muito fácil enviar valores entre o flash e uma página
de texto, se em vez da página de texto texto.txt fosse um página de php o processo era
exactamente o mesmo, apenas se teria de ter o cuidado de que o php para enviar valores para
o flash deveria fazer echo “&nome_da_variável=”.$valor_pretendido;
Simultaneamente todas as variáveis que estivessem na aplicação de flash ficariam disponíveis
no flash, por exemplo, a variável $fim no php já teria o valor 0 que foi anteriormente
instanciado no flash.

Página 98
Action Script “e-Learning”

5- Resumo

Nesta aula foram dados conceitos de PHP e como é fácil enviar valores entre o flash e o PHP
e vice-versa.
A partir de agora é só por a imaginação a funcionar em que tudo é possível, o aluno já possui
conhecimentos para construir um site todo em flash, mesmo que os textos sejam actualizados
dinâmicamente.

6- Exercício

Para testar os conhecimentos adquiridos, propõe-se ao aluno que escreva uma solução que
permita mostrar numa página de flash, os valores que constem numa base de dados, por
exemplo mysql.
Para facilitar propõe-se que seja criada uma tabela em mysql de nomes com o campo ID do
tipo autonumber e o campo nome do tipo “blob” que quer dizer “binário”.
O layout da aplicação de flash fica ao critério do aluno.

Página 99
Action Script “e-Learning”

Página 100
Action Script “e-Learning”

AULA XIII – “Action Script – Compatibilidade/Conflitos”


1- Breve introdução

Nesta aula, a matéria a apresentar será um pouco mais ligeira e genérica, pois o aluno já
adquiriu todos os conhecimentos de base para desenvolver qualquer solução em flash, serão
apresentados alguns pontos de carácter genérico e falar-se-á sobre as novas plataformas de
comunicação via internet.

2- Compatibilidade entre diferentes sistemas operativos e browsers

Como se sabe, existem aplicações que só são compatíveis com Windows 98 outras com
Windows NT outras com sistemas Linux e outras com sistemas Macintosh. Relativamente ao
Flash ActionScript, a compatibilidade entre sistemas operativos está à partida garantida, basta
compilar a aplicação para swf e abrir esse swf num Web browser. É necessário no entanto que
o browser tenha instalado o respectivo plugin para poder mostrar a aplicação de flash.

Para garantir que os browsers que não disponham desse plugin, o possam instalar
automaticamente, convém indicar na página o endereço onde a instalação do plugin está
disponível.

Normalmente custuma-se usar dois processos em conjunto para garantir que a instalação é
feita.

O primeiro é que na página de html esteja um flash onde seja indicado o endereço
onde o plugin pode ser encontrado:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#v
ersion=6,0,29,0" width="100%" height="100%">
<param name="movie" value="site.swf">
<param name=quality value=high>
<embed src="site.swf" width="100%" height="100%" quality=high
pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_
Version=ShockwaveFlash" type="application/x-shockwave-flash"></embed>
</object>

O segundo passo a dar é fazer uma página de index.html que tenha apenas um flash
que chame outra página, e a mesma página de html tenha um script feito em
JavaScript que abra outra página ao fim de 5 segundos. Desta forma, se o browser
não tiver o plugin do flash instalado, não consegue abrir a página indicada pelo flash,
logo, ao fim de 5 segundos vai chamar outra página que será a versão sem flash.

No entanto, apesar das técnicas indicadas em cima, podem existir browsers que tenham
instalados plugins de versões anteriores àquela que é necessária para que a aplicação de
flash corra na perfeição. Nesses casos é necessário que no flash se detecte a versão do
plugin e então decidir se é ou não necessário instalar uma versão mais recente.

O script que permite detectar a versão do flash é:

Página 101
Action Script “e-Learning”

_root.versao = getVersion().split(",",1);
if(string(_root.versao) == "WIN 6" || string(_root.versao) == "MAC 6"){
getURL("site.html");
}
else{
getURL("noFlash.html");
}

3- Problemas com alguns browsers

Em relação à utilização do flash em browsers que possuam o plugin instalado, não são
conhecidos problemas, no entanto o mesmo já não acontece quando se pretende criar
interactividade entre o flash e bases de dados.
O processo de passagem de parâmetro é feito através da função:
loadVariables (<nome do ficheiro>,<destino>,<método>), por exemplo:
loadVariables (“texto.php”,”/”,”post”);

Este processo funciona para a maioria dos browsers, mas foi detectado que se o broser fôr o
Nestacape, então em vez de o método ser “post” deverá ser “get” o que obriga ou a ter duas
versões uma para o Netscape e outra para os outros browsers ou então acrescentar algo ao
script que permita identificar qual o browser que está a suportar a aplicação de flash antes de
invocar a função loadVariabels

4- Novos interfaces (Pocket PC)

Cada vez mais o acesso à Internet deixa de ser obrigatório ser feito através de um PC, já
existem inúmeras soluções que permitem navegar em páginas Web, desde os Pocket PCs, à
Web TV.
Face a estes novos meios de comunicação, torna-se necessário adaptar os conteúdos já
existentes na Internet para as plataformas tradicionais para estas novas plataformas. O
mesmo acontece relativamente ao Flash, dado já existirem plugins do flash para estas
plataformas.
Os cuidados a ter não são muitos, passam mais pelo aspecto da página e pelo peso da
mesma, ou seja, em vez de se ter uma écran 800x600 ou 1024x768 passa a ter um ecrã
320x400 que é mais alto que largo, isto implica que o design das aplicações seja feito de
forma a ser compatível com estes novos meios de comunicação.

Página 102
Action Script “e-Learning”

Outro aspecto a ter em consideração é a questão da largura de banda que é muito inferior em
sistemas wirless relativamente aos sistemas de cabo, logo convém não ter páginas muitos
pesadas, é um pouco como regressar às origens da Internet em que tudo era mais lento do
que actualmente.

Alguns exemplos de plataformas:

5- Resumo

Cada vez mais a Internet vai-se tornar num mundo novo e é necessário estar atento a todos os
novos meios de comunicação, o flash pode dar uma ajuda em só é necessário ter
preocupações ao nível do design.

7- Exercício a resolver

Propõe-se ao aluno que escreva uma aplicação em flash que permita reconhecer
o browser e a versão do plugin instalado, caso não detecte o plugin do flash,
deverá abrir automaticamente a página onde o plugin pode ser encontrado.

Página 103
Action Script “e-Learning”

Página 104
Action Script “e-Learning”

AULA XIV – “Fim do curso”


1- Notas Finais

No fim do curso cabe ao orientador fazer a avaliação final e atribuir uma nota ao aluno, pode
ser sugerido a realização de um exercício final ou não, essa decisão será tomada pela
entidade responsável pela viabilização do curso.

2- Disponibilizar em PDF o curso

Também deve ser disponibilizado o curso ao aluno para que mais tarde possa recorrer a esse
documento de forma a esclarecer alguma duvida pontual que venha a surgir.

3- Entrega de Certificado

Deverá ser entregue também um certificado ao aluno, desta vez em mãos, que permita ao
aluno, perante o mercado de trabalho, apresentar um documento que confirme os
conhecimentos por este adquiridos.

Página 105
Action Script “e-Learning”

e-Learning
“Action Script”

4. Conclusão

Página 106
Action Script “e-Learning”

4.1. Breve nota do autor

Depois de um aluno percorrer todas as aulas dadas tal como foram descritas neste relatório,
fica apto a desenvolver qualquer tipo de solução em flash, independentemente da dificuldade
que possam ter, ficando apenas mais ou menos limitado dependendo das capacidades
criativas de cada um.
Existem mais alguns pormenores que não foram abordados neste relatório, mas são aspectos
tão específicos que considero que devam ser explorados pelos alunos que desejem
especializar-se em alguma matéria relativa à Internet, como por exemplo, manipulação de
base de dados em ambiente Web, neste caso haveria muito por falar, desde a utilização de
bases de dados Mysql a bases de dados SqlServer e Oracle.

Página 107
Action Script “e-Learning”

e-Learning
“Action Script”

5. Glossário
Página 108
Action Script “e-Learning”

5.1 Conjunto de termos mais usados

FLA Este é o termo utilizado para descrever o


ficheiro que é criado pelo utilizador durante o
desenvolvimento de uma aplicação em flash.

Flash Flash é um plug-in e um ambiente de


desenvolvimento Web criado pela Macromedia.
O ficheiro desenvolvidos em Flash combinam
animação, som e interacção tirando vantajem
de um formato baseado em desenho vectorial
minimizando assim o tamanho dos ficheiros.

Html Hiper Text Markup Language. Formato no qual


se programam as páginas Web. É capaz de dar
formato a texto, acrescentar vínculos a outras
páginas, chamar imagens, sons e outros
complementos. Editável com um editor de
textos ou software específico.

Jpg arquivo de imagem comprimido, pode ser


editado em qualquer editor de imagens.

Plugin Um plug é considerado um “third-party software”


que permite ao browser mostrar um
determinado conteúdo multimédia.

.SWF ShockWave para Flash, representa o ficheiro


final compilado do flash que pode ser
visualizado que no browser que no flashplayer.

Action Representa uma instrução de ActionScript


exolada.

ActionScript Representa a linguagem de programação usada


pelo flash, trata-se de um desdobramento da
linguagem já conhecida javascript.

Argumento Iformção passada por parâmetro necessária


para que uma determinada acção possa realizar
a tarefa que lhe foi destinada.

Behavior Representa um comportamento de algo.

Texto dinâmico Represeenta o texto que pode ser alterado pelo


utilizador ou pelo sistema operativo sem ser
necessário recompilar a aplicação de flash

Página 109
Action Script “e-Learning”

Evento Representa um qualquer acontecimento

Inteiro Representa um conjunmto de números naturais


de 0 a infinito

JavaScript Linguagem baseada em script criada pela


Netscape e pela Sun MicroSystem

Sintaxe Estrutura de uma linguagem que também é


aplicada à linguagem humana.

.PHP arquivos de páginas Web dinâmicas. É, por sua


vez, uma linguagem de programação que
permite transladar para a Web conteúdo
armazenado em bases de dados.

MYSQL Servidor de base de dados nativo para linux.

.txt arquivo de texto que se abre com qualquer


editor de texto.

Página 110
Action Script “e-Learning”

e-Learning
“Action Script”

6. Referências
Página 111
Action Script “e-Learning”

6.1. Referências mais Relevantes

[1] Macromedia
http://www.macromedia.com/
[2] PHP
www.php.net

Página 112

Você também pode gostar