EDUARDO WALMOTT (226 pts)

MARLOS ALVES CARMO (90 pts)

PANDOGO (82 pts)

RODRIGO AMARAL (56 pts)

NILTON BICALHO (61 pts)

AUTOR DESCONHECIDO (100 pts)

MANGOOST (80 pts)

ÉMERSON ROCHA (85 pts)

DAAFY (55 pts)

NETO LEAL (116 pts)

RICARDO FIGUEIRA (33 pts)

DENIS CARAVALHO (85 pts)
Treinamento PontoFlash de Flash e ActionScript

Como o Fireworks exporta PNG para o Flash?

Aqui vai o segredo das variáveis

Preciso configurar a formatação de um arquivo .TXT importado com load variables.

Softwares úteis para desenvolver junto ao flash:

Existe alguma forma de o flash detectar se um load movie já foi carregado e executar uma ação depois disso.

Quero que quando terminar a animação de um movieclip, comece outro e assim sucessivamente.

Como faço para ler o conteúdo de uma variável do Flash com JS?

Alguém sabe como funciona os parâmetros do startdrag? StartDrag (beleza1, false, 70, 15, 70, 180);. O que seria estas medidas?

Qual a melhor maneira de importar um swf criado no Swish para o Flash?

Como colocar elementos separados por vírgula em uma posição específica de um array?

É possível colocar um goTo como um link dentro de um texto associado a uma variável (texto rolante)?

Quero que ao clicar em um botão executar um filme que vai para 'alpha=0', tipo um 'fadeOut'.

Gostaria de saber como criar um botão voltar e avançar? Como usar âncoras no Flash?

Como fazer para mudar as cores da barra de rolagem lateral?
Relógio analógico

Editor de banco de dados (PHP-MySql) orientado a Objetos (OOP)

Abrir PopUp no Flash com JS e ASP.

Controlando alpha via actionscript

Local Shared Objects segunda parte.

Controlando MovieClip pelas teclas direcionais.

Objeto Movieclip - Propriedades

Inserir dados no ASP via formulário no Flash.

Máscara

Loop infinito

Máscara percorrendo um caminho.

Criando um Editor HTML com o MM Flash
Multiple text efects

Swirl

Create line

Digitação (6kb) - Flash4

Texto com scroll

Mapa - Países com A 2

Velocidade

Drag MC 2

SomnoFlash5

Sashacircle 2

Número de caracteres

Texto html
HOME | TUTORIAIS
Desenhando interativamente no Flash 5
por Stickman

Então, qual é a boa?

Antes que você se empolgue, é melhor esclarecer que não vou mostrar aqui como criar animações 3D em tempo real - esse é um trabalho para alguém que saiba um pouquinho de matemática (ou seja, não eu). Meu assunto é apenas desenhar formas com linhas e deixar que o Flash "complete" a forma quando terminarmos.

Para clarificar ainda mais nosso objetivo: queremos poder começar sem nenhuma linha e, clicando em algum lugar da tela, desenhar uma série de linhas conectadas. Enquanto desenhamos, veremos um esboço de linha que segue o mouse. Quando acharmos que uma linha está posicionada corretamente, poderemos clicar o mouse para fixá-la em seu lugar e começar uma nova. Quando terminarmos, daremos Enter e veremos o Flash unir o fim da última linha ao início da primeira, fechando a figura.

Pontos e linhas

A técnica que usamos para unir dois pontos com uma linha não podia ser mais simples. Praticamente não envolve cálculos matemáticos. É por isso que gosto dela.

Começamos com um movie clip (chamado Line) que contém uma única linha diagonal hairline (você vai encontrar Hairline no painel Stroke). A característica mais importante dessa linha é que ela começa no ponto 0,0 e termina no ponto 100,100 (é só criar uma linha à mão e usar o painel Info para posicionar exatamente os pontos de início e final). Porque os pontos de início e final são significativos? Porque agora podemos usar "scale" para mudar à vontade sua largura e altura.

Por exemplo: queremos que nossa linha comece em 70,60 e termine em 150,240. Posicionamos então o ponto de início de nosso movie clip Line em 70,60 e o redimensionamos para encaixar. Subtraindo os valores iniciais e finais das coordenadas x e y, temos 150 - 70 = 80 e 240 - 60 = 180. A escala opera com percentagens, o que é muito conveniente: 100 é o tamanho normal, 50 é metade do tamanho, 200 é o dobro e assim por diante. Tudo o que precisamos fazer, então, é usar os valores que acabamos de calcular (80 e 180) para determinar os valores _xscale e _yscale de nossa linha e pronto! O ponto final está agora em 150,240. Simples!

Agora o código

O próximo passo de nossa tarefa é combinar essa técnica de desenho de linha que acabamos de usar com um pouco de código ActionScript, para que de fato aconteça alguma coisa. Para simplificar, coloquei todo o código em Object Actions de um movie clip chamado Control (para acessar o código, clique no movie clip Control, que está em 0,0 na linha do tempo principal. Em seguida, clique com o botão direito do mouse e escolha Actions, ou clique na seta azul no Instance Panel. Você vai ver que foram feitos inúmeros comentários para ajudá-lo a compreender o que exatamente cada parte do código faz.

No Flash 5, os movie clips podem ser programados para responder a certos "eventos" - usando onClipEvent() - e essa é a razão da existência do filme Control. O primeiro evento ao qual ele responde é Load, o que acontece só uma vez - quando o clip aparece pela primeira vez na linha do tempo - e é usado para tornar invisível o movie clip Line original, assim como para inicializar certas variáveis.

Criando uma linha

A parte seguinte do código, a mais longa, responde a um evento mouseUp - ou seja, entra em ação a cada vez que o usuário solta o botão do mouse. Isso porque a cada vez que o botão do mouse é solto, é porque vamos começar a desenhar uma linha nova.

A primeira coisa que essa seção do código faz é saber a posição atual do mouse - com as propriedades _xmouse e _ymouse - e armazenar essa informação nas variáveis origin_x e origin_y. Esse é o ponto de partida de nossa nova linha. Em seguida, vamos aumentar em uma unidade o número de linhas registrado pelo contador (number_lines) e usar o resultado obtido para gerar o Instance Name da nova linha (a palavra "line" mais o número armazenado em number_lines, ou seja, line1, line2...line10, line11 e assim por diante) e armazená-lo no nome da variável. Agora vamos de fato criar a nova linha, duplicando a original e usando name como Instance Name e number_lines para a profundidade (todo movie clip duplicado precisa de um valor único de "depth", que determina se ele é desenhado na frente ou atrás de outros movie clips duplicados).

A parte seguinte se refere ao posicionamento e manipulação da nova linha, conforme descrito na seção "Pontos e linhas". O primeiro passo é determinar o ponto de início da linha usando as coordenadas que capturamos antes (origin_x e origin_y). A seguir, determinamos a largura e altura da linha com scale, usando os valores que resultam de subtrair as coordenadas do ponto de início da linha das coordenadas da posição atual do mouse (_xmouse - origin_x) e (_ymouse - origin_y).

As últimas linhas desse código são usadas apenas quando a linha que acabou de ser criada é a primeira de uma forma. A variável line_active está lá simplesmente para nos dizer se isso é verdade ou não: se seu valor for igual a zero, trata-se da primeira linha, se for igual a um, não. Você vai ver que o "if" fica assim:

if (!line_active) {...

O ponto de exclamação (!) aqui é uma abreviação de "não", portanto isso significa: "se line_active não tem valor (ou seja, se é igual a zero), então execute as ações a seguir". O código que se segue estabelece que o valor de line_active é 1, para mostrar que agora estamos desenhando uma linha (e antes não estávamos) e também define as variáveis start_x e start_y para os mesmos valores de origin_x e origin_y. Vamos precisar dessas variáveis mais tarde.

Atualizando uma linha

O onClipEvent seguinte - mouseMove - responde, como é de se esperar, apenas quando o mouse é movido. Nós o utilizamos para atualizar a posição de nossa linha-esboço - a linha que segue o mouse - e que logicamente só precisa mudar quando a posição do mouse é alterada.

Antes de mais nada, usamos um "if" para ter certeza de que line_active é igual a um (na verdade, esse 'if' apenas verifica se não é igual a zero, o que é informação suficiente, nesse caso) e então usamos o mesmo código para atualizar a posição de dimensões da linha como fizemos na seção acima "Criando a linha".

A última linha nessa seção usa uma pequena função muito útil, chamada updateAfterEvent(), que torna o movimento da linha muito mais suave. Assim, o Flash é forçado a redesenhar a linha não somente uma vez por frame, mas a cada vez que o mouse é atualizado - o que em geral acontece muito mais rápido que o seu filme. Se quer ver a diferença que isso faz, suprima essa linha do código e teste o filme. Viu?

Concluindo uma forma

A seção final do código se refere ao que acontece, graças ao evento keyUp, quando uma tecla é pressionada. Antes de mais nada, o Flash verifica qual foi a tecla pressionada, usando a função Key.getascii(). Essa função retorna o valor do código ASCII da última tecla pressionada (cada letra e caracter no seu teclado está representado internamente por um número entre 0 e 255 - esses números são chamados valores ASCII). Estamos interessados somente em saber se a tecla Enter foi pressionada, portanto estamos procurando pelo número ASCII 13.

Usamos um if aqui para checar esse valor e, se for o que procuramos, executamos apenas três linhas do código. Primeiro, unimos o ponto final da linha anterior ao ponto inicial da primeira linha da forma. Felizmente armazenamos aqueles primeiros valores (nas variáveis start_x e start_y) e portanto tudo o que precisamos fazer é subtrair deles os valores das coordenadas do ponto inicial da linha-esboço atual, ou seja (start_x - origin_x) e (start_y - origin_y).

Finalmente, definimos como zero a variável line_active. Isso faz com que a linha pare de ser atualizada a cada vez que o mouse se move e diz ao Flash que, da próxima vez em que o mouse for clicado, uma nova forma está começando.

Agora é com você

Isso é tudo o que eu tinha a dizer. Como já mencionei, o código está cheio de comentários que explicam o que está acontecendo, portanto, analise-o - não é tão difícil.

Copyright de todos os arquivos e textos de ©Stickman 1998 - 2001. Sobre copyright, termos de uso e informações, por favor visite www.the-stickman.com/terms.

Baixe aqui o arquivo FLA desse tutorial.



Devido à reformulação implementada no site, pode ser que você encontre alguns links quebrados. Por favor, ajude-nos a corrigir eventuais problemas nos informando links quebrados
1 comentário


Comentário de Tec House
| 13/9/2010 - 15:18 |
http://www.techouse.com.br

Excelente artigo, me ajudou bastante!