Entradas Recentes »

ClickTag é um termo bastante conhecido pelas lojas virtuais, principalmente quando usam o flash para divulgação em grandes portais. Na verdade, clickTag é uma variável no html que pode ser lida pelo flash, são as famosas flashVars.
As FlashVars permitem a comunicação do arquivo swf com o html sem o uso de javascript ou xml. Nesse post vamos criar um arquivo flash usando Actionscript 3 para ler uma flashVar dentro do html e direcionar para um link.

Primeiro declaramos a flashVar no html, basicamente ela vai ser um parâmetro dentro da tag object.

Código do Html

</pre>
<object width="728" height="90" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="flashVars" value="clickTAG=http://www.disantinni.com.br" /><param name="src" value="meuArquivo.swf" /><param name="flashvars" value="clickTAG=http://marceloneil.wordpress.com/" /><embed width="728" height="90" type="application/x-shockwave-flash" src="meuArquivo.swf" flashVars="clickTAG=http://www.disantinni.com.br" flashvars="clickTAG=http://marceloneil.wordpress.com/" />/*carregando o arquivo swf*//*criando parametro clickTAG*/  /* embed passa os mesmos parametros, no caso do usuário usar browser diferente do IE*/</object>
<pre>


Posteriormente, buscamos o valor dessa flashVar e executamos o função de direcionamento do link através do clique.
Código do Flash

var link:String = root.loaderInfo.parameters.clickTAG; //buscando o valor da flashVar "clickTAG" e armazenando na variável
btn_click.addEventListener(MouseEvent.CLICK,navegarSite); //chamando a função
function navegarSite(evt:MouseEvent):void {
	var minhaUrl:URLRequest  = new URLRequest(link);
	navigateToURL(minhaUrl,'_blank');
}

No exemplo utilizei a flashvar para linkar o flash a um site, semelhante ao dos anuncios nos portais. Entretanto, podemos usá-la para fazer verificações, disparar funções dentre outras.
Espero que tenham gostado, um abraço e até o próximo post!

Linha do Tempo Tecpar

O Projeto linha do Tempo visa contar os 70 anos da Tecpar, importante Instituto de Tecnologia do Paraná. O projeto contou com a produção visual e integração do flash com banco de Dados, e claro, teve a participação especial do Actionscript e Xml.

Este post eu escrevi com o objetivo de dar continuidade ao assunto de carregamento de arquivo externo e para tanto vou utilizar o arquivo do post anterior (Carregando arquivo externo Actionscript 3) . Você pode fazer o download dos arquivos no final do post.

Inicialmente, vamos fazer um upgrade no nosso designer, crie um retângulo usando a ferramenta Rectangle Toll (tecla de atalho R) com 150 de largura e 10 de altura,  retire a borda .

Converta a imagem para MovieClip, selecione o retângulo e pressione F8, na tela de propriedade (convert to Symbol), selecione a opção movieclip e  mude o ponto de registro para a esquerda, assim a barra vai aumentando sua escala da esquerda para direita, depois instancie como barraStatus_mc.

Pra finalizar a parte do designer, vamos criar um caixa de texto dinâmico, configure a fonte com tamanho 12px cor #66666 e instancie como status_txt.

Feito isso, posicione os dois objetos no canto direito inferior do palco e vamos ao código.  Selecione o primeiro frame da camada AS e pressione F9,  como estamos usando o arquivo do post passado já temos algumas ações e objetos predefinidos e vamos usá-los pra criar o nosso preloader.

O arquivo responsável pelo carregamento é o  meuCarregador, isso significa que ele vai ser o objeto responsável por chamar as funcões que irão indicar o status do carregamento e apontar algum possível erro no carregamento do arquivo.

Começamos por indicar o status do carregamento:

meuCarregador.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, statusCarregamento);

Através da classe contentLoaderInfo, pode-se obter informações do evento, como por exemplo,bytes carregados e bytes total. Com isso montarmos o preloader, nesse caso a função statusCarregamento será responsável por exibir ao usuário o nosso preloader como vc pode ver no código abaixo

function statusCarregamento(evt:ProgressEvent):void {
 var bTotal:Number = evt.bytesTotal; //atribuindo o valor total de Bytes do arquivo externo
 var bLoader:Number = evt.bytesLoaded; //atribuindo o valor de bytes carregados
 var percentual:Number =  Math.round(bLoader*100/bTotal); //criando percentual de carregando para exibir na tela
 barraStatus_mc.scaleX = percentual /100; //equacionando a escala da barra para acompanhar o percentual de bytes carregados
 status_txt.text = String(percentual); //atribuindo valores para o  texto de saída (output)
}

Ao pressionar ctrl+enter o filme deve carregar o arquivo externo rapidamente, dificultando a visualização  do crescimento da barra de status, pra poder visualizar após pressionar ctrl+enter no menu superior selecione view > Download Settings > 56k. Depois pressione  ctrl+enter novamente.  Para retirar  a barra do palco após o carregamento iremos chamar uma nova função,  também baseada na classe contentLoaderInfo ela irá executar assim que o carregamento for executado

chamando a função fimCarregamento

meuCarregador.contentLoaderInfo.addEventListener(Event.COMPLETE, fimCarregamento);

executando a função

function fimCarregamento(evt:Event):void {
status_txt.text = ""; //limpando a caixa texto
 barraStatus_mc.scaleX = 0; //zerando a scala da barra
}

Agora a idéia é apontar ao usuário que houve um erro na tentativa de carregar o arquivo externo, para isso vamos criar uma função que irá identificar o erro na tela usando o  status_txt.

chamando a função

meuCarregador.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, indicarErro);

executando

function indicarErro(evt:IOErrorEvent):void {
 status_txt.text = "Erro no carregamento!";
}

Para simular o erro,  mude o nome da pasta onde esta  o meuarquivo.swf e depois execute o filme. No texto de output vai aparecer a frase “Erro no carregamento!”, isso vai mostrar ao usuário ou mesmo o desenvolvedor que algo não saiu como o planejado.

Espero que tenham gostado! Segue link com os arquivos fontes, abraços e até a próxima!

Arquivos fontes

Blog no WordPress.com. | Tema: Motion até volcanic.
Seguir

Obtenha todo post novo entregue na sua caixa de entrada.