Posts tagged with: AS3

Garbage Collector – Gambiarra para forçar a passagem – AS3

Acho que todo mundo que programa em action script 3 sabe como é chato o lance de Garbage Collector, ele passa quando quer e olhe lá.
Você pode remover os Listeners, remover o child mas mesmo assim o objeto fica na memória, se der um trace dentro do movieclip ele ainda aparece, mas temos uma gambiarra que pode ajudar a remover esses lixos da memória, basta utilizar o código abaixo:

try {
new LocalConnection().connect('foo');
new LocalConnection().connect('foo');
} catch (e:*) {}

O que ele faz é tentar um localConnection 2 vezes seguidas, como irá falhar nas 2 vezes, na segunda vez ele chama o garbage collector, não me pergunte porque isso funciona, mas funciona.
Esse código não causa erro nem nada e é muito útil.

Abaixo um exemplo disso:

O código usado foi o seguinte:

import flash.events.Event;
import flash.display.MovieClip;

criarBTN.addEventListener(MouseEvent.CLICK , onCriar);
removerBTN.addEventListener(MouseEvent.CLICK , onRemover);
gambiarraBTN.addEventListener(MouseEvent.CLICK , onGambiarra);

function onCriar(event:Event):void
{
       //cria um moviclip de estrela e passa o campo de saida como argumento apenas para dar saída no texto
	var temp:EstrelaMC = new EstrelaMC();
	temp.saida = saidaTXT;
	areaMC.addChild(temp);
	temp.x = Math.random() * 350;
	temp.y = Math.random() * 100;
	temp = null;
}
function onRemover(event:Event):void
{
        //Remove todas as estrelas
	while (areaMC.numChildren > 0)
	{
		areaMC.removeChildAt(0);
	}
	saidaTXT.text = "Limpando os movieclips \n";
}
function onGambiarra(event:Event):void
{
        //Chama a gambiarra para limpar a memória
	saidaTXT.text = "Gambiarra Executada - Memória Limpa\n";
	try
	{
		new LocalConnection().connect('foo');
		new LocalConnection().connect('foo');
	}
	catch (e: * )
	{
	}
}

Como mostrado, mesmo retirando as estrelas, os movieclips ainda continuam na memória, executando as instruções.
É isso ae, até a próxima, espero que não demore mais um ano.

Share

Minha estrutura de projeto básica para sites e apps em flash

Sempre que começo um projeto em flash, uso sempre o mesmo conjunto de arquivos padrão, que engloba a estrutura de pastas e arquivos do loading, já que isso tem em todos os projetos em flash.

Não sei se essa é a maneira mais correta de se fazer, mas para mim está dando certo.

Uso seguinte estrutura de pastas:

src- onde guardo os arquivos *.as

deploy- onde é gerado os arquivos *.swf, *.html e onde ficam todas as imagens que serão lidas, arquivos de scripts *.php etc…

O objetivo dessa pasta é separar os arquivos fonte os arquivos compilados, isso facilita na hora de fazer o upload, bastando selecionar todos os arquivos que estão dentro dela e enviar.

fla- onde guardo os arquivos *.fla

Como utilizo a IDE eclipse para programar no flash, o eclipse cria algumas pastas e arquivos de ajuda .

Na pasta fla contém um arquivo chamado Main.fla, que tem um movieclip chamado carregador, com uma animação de 100 frames para ser tocada de acordo com a porcentagem de carregamento, quando termina de carregar esse movieclip some usando a biblioteca TweenLite.

Lembrando que todos os movieclips que usarem LINKAGE devem ser colocados no frame 2 e desabilitado a opção de “Export in frame 1″, para entrarem na contagem do loading.

Estou colocando para download o projeto básico e as actions de loading e lógica de reposicionamento quando se altera o tamanho do stage.

Downloads

Projeto Básico

TweenLite

Share

Tutorial Flash – Arrastando MovieClips – AS3

Hoje vou mostrar quatro modos de arrastar objetos no flash, mais conhecido como “DRAG”.
Drag é quando você clica sobre o objeto, segura o botão apertado e move o mouse, o objeto segue seu movimento, soltando o botão o objeto deixa de seguir.
O objeto pode seguir a partir do ponto que foi clicado ou do ponto (0,0) de si mesmo.

Primeiro modo de DRAG – (BOLA AMARELA)
startDrag() e stopDrag() a partir do ponto clicado;

Esse é o modo mais fácil de fazer, primeiro se adiciona um ouvinte para o evento MOUSE_DOWN que é quando você está com o mouse sobre o objeto e pressiona o botão esquerdo do mouse, depois adiciona outro ouvinte para o evento MOUSE_UP que captura quando você solta o botão esquerdo do mouse sobre o objeto.
O evento MOUSE_UP foi colocado no stage pois dependendo do tipo de drag o mouse nem sempre estará sobre o objeto quando o botão esquerdo for solto.
Esses dois eventos chamam a função controleBola que verifica o event.type, verifica se foi o MOUSE_DOWN ou MOUSE_UP que foi executado, claro que poderia ter sido feito de outra forma, como por exemplo duas funções diferentes, uma para cada tipo de evento , mas assim o código fica mais curto.
Se o evento foi MOUSE_DOWN usamos o startDrag() que manda o objeto seguir o mouse.
Se o evento foi MOUSE_UP usamos o stopDrag() que manda o objeto parar de seguir o mouse.

bolaMC.addEventListener(MouseEvent.MOUSE_DOWN , controleBola);stage.addEventListener(MouseEvent.MOUSE_UP , controleBola);
function controleBola(event:MouseEvent):void {
	switch (event.type) {
		case "mouseDown" :
			bolaMC.startDrag();
			break;
		case "mouseUp" :
			bolaMC.stopDrag();
			break;
	}
}

Segundo modo de DRAG – (ESTRELA AZUL)
startDrag() e stopDrag() a partir do seu ponto (0,0);

Para fazer isso apenas coloque true no parâmetro lockCenter do startDrag():

bolaMC.startDrag(true);

O objeto se deslocará colocando o seu ponto(0,0) na posição do mouse.

Terceiro modo de DRAG – (QUADRADO VERDE)
Coloca o ponto (0,0) do objeto no valor x e y do mouse, similar ao startDrag(true).

Como no primeiro iniciamos pegando os eventos MOUSE_DOWN e MOUSE_UP do objeto, mas agora iremos também usar o evento ENTER_FRAME para executar a função que moverá o objeto para a posição do mouse.
Primeiro declaramos a variável booleana quadradoDrag que nos dirá se o objeto deverá ou não seguir o mouse.
Na função controleQuadrado dizemos para a variável quadradoDrag que deve seguir quando o evento for MOUSE_DOWN e que não deve quando for o evento MOUSE_UP.
Na função loop que é chamada a cada frame devido ao evento ENTER_FRAME, verificamos se o quadradoDrag está sinalizando para mover e atribuímos o valor x e y do mouse para o valor x e y do objeto respectivamente.

quadradoMC.addEventListener(Event.ENTER_FRAME , loopQuadrado);
quadradoMC.addEventListener(MouseEvent.MOUSE_DOWN , controleQuadrado);
stage.addEventListener(MouseEvent.MOUSE_UP , controleQuadrado);
var quadradoDrag:Boolean = false;
function controleQuadrado(event:MouseEvent):void {
	switch (event.type) {
		case "mouseDown" :
			quadradoDrag = true;
			break;
		case "mouseUp" :
			quadradoDrag = false;
			break;
	}
}
function loopQuadrado(event:Event):void{
	if(quadradoDrag){
		quadradoMC.x = mouseX;
		quadradoMC.y = mouseY;
	}
}

Quarto modo de DRAG – (TRIÂNGULO VERMELHO)
Calculando a posição do mouse e subtraindo a posição de onde foi clicado sobre o objeto, similar ao startDrag().

Funciona da mesma forma que o terceiro tipo, mas agora ao invés de uma variável dizer que deve seguir, usaremos um objeto Pointer, que serve para armazenar dois pontos, x e y, acessível via ponto.x e ponto.y
Iniciamos com a variável offset do tipo Point setada em null, que quer dizer que não tem nada armazenado nela.
Quando a função de controle é chamada pelo evento MOUSE_OVER, pegamos a posição do mouse relativa ao ponto (0,0) do objeto, como mostra a imagem abaixo.

Quando a função de controle é chamada pelo evento MOUSE_UP, setamos null novamente, para offset para zerar o objeto.
E na função de loop verificamos se o offset não é null, se for não fazemos nada, se tiver valores dentro dele, pegamos a posição do mouse e subtraímos a posição do mouse relativa que foi setada no evento MOUSE_OVER e passamos para o objeto.

trianguloMC.addEventListener(Event.ENTER_FRAME , loopTriangulo);
trianguloMC.addEventListener(MouseEvent.MOUSE_DOWN , controleTriangulo);
stage.addEventListener(MouseEvent.MOUSE_UP , controleTriangulo);
var offset:Point = null;
function controleTriangulo(event:MouseEvent):void {
	switch (event.type) {
		case "mouseDown" :
			offset = new Point(event.localX , event.localY);
			break;
		case "mouseUp" :
			offset = null;
			break;
	}
}

function loopTriangulo(event:Event):void{
	if(offset != null){
		trianguloMC.x = mouseX - offset.x;
		trianguloMC.y = mouseY - offset.y;
	}
}

No exemplo coloquei mais um função que faz o objeto clicado ficar sobre os demais, não vou explicar isso, pois não é o foco deste post, mas está aplicado no .fla que está para download abaixo.

DOWNLOAD
startDrag.zip

Share

Eventos AddEventListener e RemoveEventListener

Nessa vídeo aula tento demonstrar de forma simples como funciona o básico do sistema de eventos do actionscript 3, abordo apenas a adição e remoção de ouvintes de eventos (AddEventListener e RemoveEventListener), em um próximo vídeo falarei do disparo de eventos. Iremos colocar ação em um botão em actionscript 3.

Sempre que faço uma vídeo aula tento escrever um roteiro, mas dessa vez transcrevi a vídeo aula e vou colocar em modo texto também, para que preferir ler do que ver o vídeo.

TRANSCRIÇÃO

Entender o que é evento no actionscript 3 é muito importante, pois a maioria das classes que usamos responde utilizando os eventos.
Por exemplo, o click do mouse em um botão, o click é um evento que o botão sofre, o botão por sua vez avisa que foi clicado, o programa ouvindo esse grito reage de acordo com o que deve ser feito.
Existem diversos tipos de eventos, como finalização de um carregamento, mouse sobre um movieclip, redimensionamento da tela, etc…
Vou tentar explicar de uma forma simples, vamos imaginar um general e um soldado no campo de batalha, o soldado está na luta com um rádio enquanto o general está no comando no quartel, o soldado ficou incumbido de reportar para o general quando uma bomba explodir no campo de batalha.
Quando um bomba explode ele grita, explodiu uma bomba, o ato da bomba explodir é um evento, o soldado percebendo esse evento chama o general, agora se o general vai escutar esse chamado é outra coisa.
E no actionscript3 é igual, sempre que acontece um evento, ele é disparado, mas só é ouvido se esse evento for cadastrado para ser ouvido.
Voltando ao exemplo do soldado, ele está lá gritando quando as bombas explodem, ai o general vê que seu rádio está desligado, ele liga o rádio e diz, soldado agora estou te ouvindo.
Pronto agora sim, todos os eventos de explosão de bombas serão ouvidos pelo general, e quando o general escuta um grito do soldado ele ordena mais contra-atraques.
No actionscript3 quando é cadastrado um ouvinte de evento é preciso informar quem será ouvido, no nosso caso é o soldado, qual evento será ouvido, que é a explosão e qual função reagirá quando esse evento for ouvido, desempenhado pelo nosso general.
Vamos partir para o código, quando clicarmos no soldado ele vai dar o avisa da bomba que explodiu , primeiramente vamos criar a função que reagirá ao chamado.

import flash.events.Event;

function explodiuBomba(event:Event):void{
 mensagem.text = "explodiu uma bomba ";
}

Agora cadastramos o soldado para ser ouvido pelo general.

soldado1.addEventListener(MouseEvent.CLICK , bombaExplodiu);

Pronto , tem gente ouvindo, tem gente gritando e tem gente reagindo ao evento.
Tem eventos para tudo, abaixo tem alguns links para maior aprofundamento no assunto.
Vamos incrementar mais um pouco isso, imagina que temos 2 soldados no campo com essa mesma função de ouvir as explosões, podemos utilizar informações passadas pelo evento para saber qual foi o soldado que avisou, vamos também cadastrar o soldado2.

import flash.events.Event;
function explodiuBomba(event:Event):void{
 mensagem.text = "explodiu uma bomba - " + event.target.name;
}

soldado1.addEventListener(MouseEvent.CLICK , explodiuBomba);
soldado2.addEventListener(MouseEvent.CLICK , explodiuBomba);

Sempre que um evento acontece é passado um objeto com informações sobre o evento, como o nome de quem sofreu o evento, o tipo de evento e diversas outras informações.
Nesse caso nós pegamos o evento e extraímos o seu alvo, quem foi que sofreu o evento usando o target, e pegamos o seu nome com o name.
Em uma próxima vídeo aula vou falar como disparar um evento customizado, passando um objeto com as informações que quiser.
Mas beleza, você deve estar pensando e seu eu não quiser mais ouvir esse soldado gritando na minha orelha?
É fácil, basta parar de ouvi-lo.
Da mesma forma que cadastramos para ouvir nós podemos descadastrar.
Vamos fazer assim, clicando no general manda o soldado 2 ficar quieto.

function calarSoldado(event:Event):void{
 mensagem.text = "cala a boca soldado 2";
 soldado2.removeEventListener(MouseEvent.CLICK , explodiuBomba);
}
general.addEventListener(MouseEvent.CLICK , calarSoldado);

Pronto, agora não escutamos mais esse mala gritando e deixamos ele morrer no campo de batalha.
Bom era isso que eu queria falar, não deixe de dar uma olhada nos links que estão ai embaixo.
Até a próxima.

Download do .fla.

DOWNLOAD

Links úteis

Documentação da adobe em português sobre eventos – LINK

Share

Código comentado – Inversor de URL

Esses dias um amigo reclamou comigo de que tudo que vai baixar na internet estava com o URL invertido e com sites de celulares para liberar o link, me pediu ajuda para criar uma lógica que desinverta a URL.
Então fiz uma lógica básica que inverte uma string.
Basta colocar a URL que está invertida e clicar em inverter.



O código é simples:

import flash.events.Event;

var url:String;

function inverterFN(event:Event):void
{
	
	var saida:String = "";
	//pega o que foi digitado
	url = entradaTXT.text;
	//caso for um URL que inverte busca o sinal de = 
	//e pega apenas os parametros
	url = url.slice(url.indexOf("url=")+1 , url.length);
	//percorre do fim para o inicio a url e coloca na saida
	for (var i:int = url.length; i > 0; i--){
		//vai somando letra a letra
		saida += (url.slice(i-1,i));
	}
	//mostra a saída
	saidaTXT.text = saida;
	
}

function limparFN(event:Event):void{	
	entradaTXT.text = saidaTXT.text = "";
}

inverterBTN.addEventListener(MouseEvent.CLICK , inverterFN);
limparBTN.addEventListener(MouseEvent.CLICK , limparFN);

Abaixo tem o download do .fla.
DOWNLOAD

Share

Flash e Papervision 3D

Iniciei na área de interatividade trabalhando com o flash a alguns anos atrás, desde o flash 4,  sempre foi limitado a 2D, mas isso começou a mudar com a adobe inserindo algumas funcionalidades 3D no flash e também com bibliotecas auxiliares, como a Away 3D e Papervision 3D.

Em alguns de meus trabalhos utilizei o Papervision 3D, é uma boa biblioteca mas ainda com muitas coisas a serem corrigidas e aprimoradas, mas com uma gambiarra aqui e outra ali nos viramos muito bem com ela.

Sites que fiz com Papervision

Hipno T-Shirt

Clarus Digital

Segue alguns links sobre Papervision

http://blog.papervision3d.org/

http://www.madvertices.com/

http://www.papervision3d.org/docs/as3/

http://www.maximized.co.uk/tutorials/

e como 3D é tudo matemática..

Flash e Math

Share