SODA Flash | Tutoriais Flash AS3

Everything Changes | Befter, Before and After Pictures

2010-01-19T14:29:00.000-02:00

Everything Changes | Befter, Before and After Pictures

Sobre o Adobe Flash CS5

2009-10-28T18:06:00.005-02:00

Este texto é uma referencia. O original você pode ler aqui

O beta do Adobe Flash CS5 estará disponível no Adobe Labs antes do final de 2009 e já foram divulgadas novidades muito interessantes.

Integração ao Flash Builder, o editor de Actionscript atual do Flash comparado ao Flash Builder é muito inferior. A partir do Flash CS5 será possível editar as classes no Flash Builder.
Melhorias no Editor de Actionscript, code hinting e auto-completar para nossas próprias classes.
Code Snippets panel, podemos escrever códigos, como templates, e estes códigos ficam armazenados para podermos inseri-los nos projetos a qualquer momento.
XML based FLA files, novo formato de projetos baseado em XML visando facilitar o trabalho em equipe para gerenciamento e alterações.
Text Layout Framework (TLF), grandes melhorias para se trabalhar com textos; estilos e layouts avançados, textos em colunas, inline images, trabalho junto a moldes.
Aplicativos para iPhone, criar aplicativos para o iPhone a partir do Flash CS5.

Realmente muito animador saber que através do Flash CS5 será possível desenvolver em AS3 para o iPhone, e ainda mais interessante é que não serão swfs e sim apps nativas do iPhone.

A questão sobre swf não poder rodar no iPhone é pelo fato do Adobe Flash Player consumir muita memória e bateria do aparelho. A Adobe está trabalhando junto a Apple para solucionar isto no futuro.

Portifólio - Sarneytion

2009-10-27T10:48:00.001-02:00

Novo projeto: Sarneytion é um jogo desenvolvido em Flash, idealizado e produzido pela SODA.

Tween

2009-10-23T15:09:00.006-02:00

Sempre usei Tweener do Zeh Fernando.

Comecei a usar GreenSock, e dia 20 passado, eles lançaram a nova versão.

Melhorias: TweenNano, que é uma versão enxuta do TweenLite. e O TimelineLite e TimlineMax, agora podemos controlar a timeline de forma bem mais intuitiva via actionScript.

O pessoal da GreenSock tá de parábens, belo trabalho, vale a pena conferir, o site deles é o http://blog.greensock.com/

Portifólio - Gadget Befter

2009-10-22T09:49:00.005-02:00

Criação de um gadget para o Befter ele carrega as imagens de um feed.

Ex.: A partir deste feed... http://www.befter.net/feeds/user/tecabravo1/

Gero esse flash (ainda beta).

Até usei no meu blog.

Abraços!

Portifolio

2009-09-08T16:15:00.006-03:00

Programção AS3 em Flash feita para uma agencia web de Pelotas, RS, Brasil.
Visitar on-line - www.sitionet.com.br

Classe para carregar imagens externas

2009-07-06T13:57:00.004-03:00

Olá, esses dias me dediquei aos estudos de AS3, pricipalmente voltado para o uso de POO + FlashDevelop, estou alcançando um nível muito bom de velocidade de desenvolvimento, criei algumas classes auxiliares, talvez já existam por ai, mas enfim, criei a minha, ela pode ser instancionada quantas vezes for necessária. Ajuda muito na velocidade do desenvolvimento.

Para chamar a classe:

Primeiro importe a classe, depois...

//Imagem é o nome da classe
var ima:Imagem = new Imagem();
ima.Imagem_("caminhodaimagem.jpg");

A classe tá aqui.

package {
import flash.display.Loader;
import flash.display.Sprite;
import flash.net.URLRequest;
import flash.events.ProgressEvent;
import flash.events.Event;
import caurina.transitions.Tweener;
import flash.display.DisplayObjectContainer;
/**
* ...
* @author Huayna tejo
*/
public class Imagem extends Sprite{
var imageLoader:Loader;
public function Imagem_(path:String)
{
imageLoader = new Loader();
imageLoader.load(new URLRequest(path));
imageLoader.contentLoaderInfo.addEventListener( ProgressEvent.PROGRESS, progressoDeCarregamento);
imageLoader.contentLoaderInfo.addEventListener( Event.INIT, mostraImagem);
addChild(imageLoader);
}
function progressoDeCarregamento(evento:ProgressEvent ):void {
var loader:Loader = Loader(evento.target.loader);
var t:int = (int(evento.bytesLoaded) * 100 / int(evento.bytesTotal));
}

function mostraImagem(evento:Event ):void {
var loader:Loader=Loader(evento.target.loader);
loader.alpha = 0;
Tweener.addTween(loader, { alpha:1, time:2 } );
}

}

}

Portifólio - Fix

2009-06-26T16:18:00.002-03:00

Site feito através da Qualitare
viste: http://www.fixsuamarca.com

Portifólio - Vernier

2009-06-10T15:30:00.002-03:00

Novo site vernier, mais infomações em http://blog.sodavirtual.com.br/2009/06/vernier-inverno-2009/.

Painel Flash Simples - AS3 + XML

2009-05-29T11:54:00.011-03:00

Umas das coisas mais usadas mundo afora é o painel flash puxando dados de um arquivo XML, é muito rápido e simples de fazer, vou postar um aqui com o codigo-fonte, muita gente vai gostar.

import caurina.transitions.Tweener;

var posL:int = 1;
var xmlSite:XML;
var xmlListSite:XMLList;
var xmlLoaderSite:URLLoader = new URLLoader();
//xmlLoaderSite.load(new URLRequest("/xml/imagens-empresa-produtos.xml"));
xmlLoaderSite.load(new URLRequest("http://65.254.56.211/~soda/sodaflash/painel_simples/xml.xml"));
xmlLoaderSite.addEventListener(Event.COMPLETE, xmlLoadedSite);

function xmlLoadedSite(event:Event):void {
xmlSite=XML(event.target.data);
xmlListSite=xmlSite.children();

desmonta(0)

}
var imageLoader:Loader
function desmonta(n:int){
Tweener.addTween(local,{alpha:1,time:1, onComplete:function() { monta(n); }});
// Tweener.addTween(porcentagem,{alpha:1,time:1});
}

function monta(n:int){

imageLoader = new Loader();
imageLoader.load(new URLRequest(xmlSite.picture[n].attribute("miniature_url")));

local.addChild(imageLoader);
imageLoader.contentLoaderInfo.addEventListener( Event.INIT, mostraImagem );

}

function mostraImagem(event:Event ):void {

var loader:Loader=Loader(event.target.loader);
loader.alpha=0;
Tweener.addTween(loader,{alpha:1,time:2});

Tweener.addTween(local,{alpha:1,time:2});

// iniciando o Timer
meuTempo.start();
}

var meuTempo:Timer = new Timer(4000);
meuTempo.addEventListener("timer", FuncaoDoTimer);

//funcao será chamada a cada 500ms
function FuncaoDoTimer(e:TimerEvent){
meuTempo.stop();
trace(posL);
if(posL >= xmlListSite.length()-1){

desmonta(posL);
posL=0;
}else{

desmonta(posL);
posL++;
}
trace("Timer chamado " + meuTempo.currentCount + " veses.");
}

Tweener.addTween(gira,{rotation:359,time:.52,transition:"linear",onComplete:repete});
function repete(){
gira.rotation = 0;
Tweener.addTween(gira,{rotation:359,time:.52,transition:"linear",onComplete:repete});
}

A pasta de todos os arquivos é aqui
(arquivos flash CS4);

Como ativar o smoothing em imagens dinâmicas.

2009-05-22T15:51:00.004-03:00

Isso é muito útil quando precisamos scalar ou rotacionar uma imagem dinâmica.

Aqui vai o source.

package {

import flash.display.Sprite;

import flash.display.Loader;

import flash.net.URLRequest;

import flash.events.*;

import flash.display.Bitmap;

public class Thumbnail extends Sprite {

private var url:String;

private var loader:Loader;

private var urlRequest:URLRequest;

function Thumbnail(source:String):void {

url=source;

drawLoader();

}

private function drawLoader():void {

urlRequest=new URLRequest(url);

loader=new Loader;

loader.load(urlRequest);

//O evento listener voce deve usar o contentLoaderInfo

loader.contentLoaderInfo.addEventListener(Event.COMPLETE,done)

}

private function done(e:Event){

//aqui pegamos a imagem e transformamos em bitmap

var bit:Bitmap = e.target.content;

//se tiver correto

if(bit != null)

bit.smoothing = true;

}

addChild(loader);

}

getURL no Actionscript 3 / Iniciante

2009-05-14T09:30:00.004-03:00

Uma das grandes mudanças no ActionScript 3 é o modo como voce chama um link.

Isso mudou a mais de 1 ano, mas como sempre me perguntam sobre isso resolvi escrever, é algo bem básico.

O modo antigo de fazer isso em AS2 era:

getURL("url", "target");

Com o AS3 isso mudou para:

var url:String = "http://site";
var request:URLRequest = new URLRequest(url);
try {
  navigateToURL(request, '_blank'); // segundo argumento é o target
} catch (e:Error) {
  trace("Erro encontrado!");
}

A mais óbvia diferença foi o mode de chamar a classe URLRequest para o método navigateToURL().

Normalmente chamamos essa função através de um botão(button) segue um exemplo simples:

movieClipName.addEventListener(MouseEvent.CLICK, clickLink);
function clickLink:void {
  var url:String = "http://site";
  var request:URLRequest = new URLRequest(url);
  try {
    navigateToURL(request, '_blank');
  } catch (e:Error) {
    trace("Erro encontrado!");
  }
}

É isso, abraços!

Video para celular.

2009-05-04T09:22:00.004-03:00

Estava em casa, olhei pro meu celular e pensei em fazer algo pra personaliza-lo, abri o AfterEffects e fiz uma coisa bem rápida(cerca de 1hora e meia).

Há, precisava ser em 320 x 240px, e ter 15FPS(frames por segundo), o que faz a qualidade cair um pouco para ver via YouTube, mas de qualquer forma está ai. A música é Incubus - Paper Shoes.

Creditos para arte de Diego Costa(site) - Soda Virtual

ComboBox

2009-04-29T14:55:00.010-03:00

Olá, todos sabemos(eu espero que sim) que o FLash/AS3 já vem com varios componentes prontos para editar, uma deles é o "comboBox", mas ele possui algumas limitações, como por exemplo colocar imagens no lugar de texto. Estou trabalhando num projeto e me deparei com uma dessas limitações, então resolvi fazer meu próprio ComboBox.
Os dados estão nesse XML, é bom dar uma olhada nele.

Escolha uma opção.

O código comentado:

//importando a casse Tweener.
import caurina.transitions.Tweener;

//criando os objetos XML
var xml1:XML;
var xmlList1:XMLList;
//carregando o XML
var xmlLoader1:URLLoader = new URLLoader();
xmlLoader1.load(new URLRequest("http://65.254.56.211/~soda/sodaflash/select/sel.xml"));
xmlLoader1.addEventListener(Event.COMPLETE, xmlLoaded1);

//ao carregar o XML entra nessa função
function xmlLoaded1(event:Event):void {
//preparando o XML
xml1=XML(event.target.data);
xmlList1=xml1.children();

//for para ler os nós do XML
for (var i:int = 0; i < style="color: rgb(153, 153, 153);">//criando o objeto Nome
Nome = new nome();
//adicionando ao comboBox
sel.aqui.addChild(Nome);
Nome.name=String(i); Nome.texto.text=xmlList1[i]; Nome.y=Nome.height*i; Nome.addEventListener(MouseEvent.MOUSE_OVER,overNome); Nome.addEventListener(MouseEvent.MOUSE_OUT,outNome); Nome.addEventListener(MouseEvent.CLICK,clickNome);
}
}
//criando o objeto Nome
var Nome:nome;

//variavel que pega o local Y do objeto clicado
var seguraY:int=0;
//mascara do comboBox
sel.aqui.mask=sel.mascara;

//função para quando o mouse passa em cima do objeto do combobox
function overNome(e:Event) {
sel.aqui.y=0;
//tween para abrir o comboBox
Tweener.addTween(sel.fundo,height:sel.aqui.height,time:1}); Tweener.addTween(sel.mascara,height:sel.aqui.height,time:1});
//um jeito rapido de mudar a cor do objeto do comboBox
e.target.parent.bg.alpha=.8;
}
//função para quando o mouse sai de cima do objeto do combobox
function outNome(e:Event) {
//a "cor"
e.target.parent.bg.alpha=0;
//o seguraY é usado para voltar para o ultimo objeto clicado
sel.aqui.y=seguraY;
//tween para fechar o comboBox
Tweener.addTween(sel.fundo,{height:Nome.height,time:1}); Tweener.addTween(sel.mascara,{height:Nome.height,time:1});
}
//função para quando clicar no objeto do comboBox
function clickNome(e:Event) {
//chama a função que exibe o resultado
mostraResultado(e.target.parent.name);
//adiciona um objeto para para não atrapalhar na animação
sel.addChild(square);
//faz com que esse objeto suma depois de 1seg.
meuTempo.start();
//guarda a posição do clicado
seguraY = -(e.target.parent.y);
Tweener.addTween(sel.aqui,{y:-(e.target.parent.y),time:1});
var t:int=e.target.parent.name;
}

//função de mostra o resultado como o próprio nome já diz.
function mostraResultado(s:String){
trace(s);
resultado.text = xmlList1[int(s)];
}

//o objeto mágico criado para ajudar...
var square:MovieClip = new MovieClip();
square.graphics.beginFill(0xFF);
square.graphics.drawRect(0,0, 200, 5000);
//troque esse parametro para 1, para descobrir a mágica
square.alpha=0;
square.graphics.endFill();

//função do timer, já falei sobre isso no post passado.
var meuTempo:Timer=new Timer(1000); meuTempo.addEventListener("timer", FuncaoDoTimer);

function FuncaoDoTimer(e:TimerEvent) {
sel.removeChild(square);
meuTempo.stop();
trace("Timer chamado " + meuTempo.currentCount + " veses.");
}

Ufa, essa foi grande, por favor, qualquer dúvida comenta ai!.

Baixar fonte aqui

A Classe Timer AS3

2009-04-22T10:32:00.005-03:00

Na versão anterior do ActionScript, havia dois jeitos diferentes para acionar eventos baseados em tempo.As funções setInterval() e a setTimeout() foram as duas funções mais usadas para chamar uma função após um determinado período de tempo. No ActionScript 3(AS3), temos agora uma classe no pacote flash.utils . Esta categoria inclui todas as funcionalidades que você precisa para aplicações baseadas em tempo. Para utilizar a classe, primeiro você deve importar o pacote flash.utils , uso no exemplo a seguir. O "Timer construtor" espera um argumento que representa o atraso desejado em milissegundos. Um segundo argumento opcional determina o número de vezes para chamar a função. O padrão para este valor é 0, o que significa que ele irá chamar a função infinitamente.

No exemplo abaixo estou criando um temporizador que irá disparar duas vezes por segundo. Na minha aplicação abaixo estou simplesmente fazendo um trace () para o "output panel" mostrando quantas vezes ela disparou. Para obter este valor estou lendo a propriedade Timer.currentCount .

Chega de papo e vamos direto ao AS3.

//precisamos importar o pacote flash.utils
import flash.utils.*;

//criando um objeto new Timer com delay de 500ms
var meuTempo:Timer = new Timer(500);
meuTempo.addEventListener("timer", FuncaoDoTimer);

// iniciando o Timer
meuTempo.start();

//funcao será chamada a cada 500ms
function FuncaoDoTimer(e:TimerEvent){
trace("Timer chamado " + meuTempo.currentCount + " veses.");
}

Menu com balão acompanhando o mouse

2009-04-20T16:44:00.013-03:00

Passe o mouse nos quadrados. (link do fonte no final do post)

O balão cresce, mas não distorce, isso acontece por causa do "9-slice scaling" está habilitado, ele não aumenta as áreas marcadas com vermelho na imagem abaixo, uso apenas o scaleX no exemplo, mas se usasse o scaleY ele só iria crescer o que está em verde.

Para habilitar o "9-slice scaling", vá na propriedade do movieClip e marque a caixinha do "Enable guides for 9-slice scaling.

Código comentado

//importando a classe Tweener, ver mais em http://code.google.com/p/tweener/
import caurina.transitions.Tweener;

//adicionando o elemento balao, da library
var Balao:balao;
Balao = new balao;
//adicionando o balao ao palco
addChild(Balao);
//alpha = 0 =]
Balao.alpha = 0;

//ativando a famosa maozinha do botao
preto.buttonMode = true;
vermelho.buttonMode = true;

//criando um listener para escutar o movimento do mouse
addEventListener(MouseEvent.MOUSE_MOVE,mouseMover);

//funcao que é chamada sempre que o mouse se move
function mouseMover(e:Event):void{
//o movieclip balao segue o mouse de perto =]
Balao.x = mouseX;
Balao.y = mouseY;
}

//criando os listener dos botoes
preto.addEventListener(MouseEvent.MOUSE_OVER,pretoOver);
vermelho.addEventListener(MouseEvent.MOUSE_OVER,vermelhoOver);
preto.addEventListener(MouseEvent.MOUSE_OUT,pretoOut);
vermelho.addEventListener(MouseEvent.MOUSE_OUT,vermelhoOut);

function pretoOver(e:Event){
Tweener.addTween(Balao,{alpha:1,time:1});
//diminuindo o tamanho do balao para 80%
Tweener.addTween(Balao.bg,{scaleX:.8,time:1});
//adicionando o texto ao balao
Balao.texto.text = "PRETO";
}
function vermelhoOver(e:Event){
Tweener.addTween(Balao,{alpha:1,time:1});
//aumentando o tamanho do balao para 170%
Tweener.addTween(Balao.bg,{scaleX:1.7,time:1});
Balao.texto.text = "VERMELHO FERRARI";
}

//quando o mouse sair de cima de um botao o balao some
function pretoOut(e:Event){
Tweener.addTween(Balao,{alpha:0,time:1});
}
function vermelhoOut(e:Event){
Tweener.addTween(Balao,{alpha:0,time:1});
}

Baixar Fonte - clique aqui

Segundo vídeo feito em After Effects

2009-04-16T15:51:00.002-03:00

É uma exibição de clientes, pra um segundo trabalho ficou legal.

Depois vou colocar uns tutoriais de After Effects aqui.

Como saber o sistema operacional do cliente. AS3

2009-04-15T12:35:00.009-03:00

O exemplo abaixo

O código.

import flash.system.Capabilities;

CapabilitiesExample();
function CapabilitiesExample() {
showCapabilities();
}

function showCapabilities():void {
sis.text="Seu OS é: "+Capabilities.os;
}

Para baixar o fonte: clique aqui

Button AS3

2009-04-08T11:05:00.012-03:00

Para criar vários botões que usam uma só função com AS3 é mais fácil do que parece.

Sempre me perguntam sobre isso, até agora o jeito mais saudavel que encontrei de fazer está no código as3 a baixo, qualquer dúvida estou a disposição.

Se fosse um menu em flash + as3, poderíamos criar um array para facilitar as coisas e pegar o "índice" do objeto que chama a função, assim nem precisamos passar algum parametro para o objeto(seria um post interessante?).


//adicionando propriedades ao objeto
caixaAzul.teste=  "1";
caixaVermelha.teste= "2";
//adicionando os listeners
caixaAzul.addEventListener(MouseEvent.CLICK, mudaCor);
caixaVermelha.addEventListener(MouseEvent.CLICK, mudaCor);

function mudaCor( e:Event ):void
{
trace(e.target.teste);
}

Imprimir página no Flash , as3

2009-04-08T10:31:00.001-03:00

Cá estava eu fazendo um trabalho, uma calculadora/orçamento para uma empresa de fora, até ai tudo bem, no final dos cálculos precisava imprimir os resultados na impressora do cliente.

Existe uma classe para isso, PrintJob, muito fácil de usar, até imprimi a primeira pagina(imagem).
O único problema foi na hora de mostrar pro cliente que usa Mac, e descobri que a classe PrintJob não funciona bem no Mac OS, os desenvolvedores da Adobe já estão tentando corrigir, https://bugs.adobe.com/jira/browse/FP-307

Para ver a calculadora, http://65.254.56.211/~soda/pixily/

Agora é só esperar.

Primeiro video After Effects

2009-03-25T15:42:00.004-03:00

O trabalho foi feito a apartir de uma imagem PNG, ficou legal.

Site Aquarela

2009-03-24T16:33:00.001-03:00

Site feito através da Qualitare
visite: http://sandaliasaquarela.com.br/

Vernier Verão 2009

2009-03-21T09:25:00.000-03:00

Novo site da Vernier, gostei do loarder.

Visitar o site

Site mágico

2009-03-20T16:59:00.000-03:00

Site feito através da Qualitare, viva a mágica.
=]

Visite o site

Site de arquitetura.

2009-01-24T17:57:00.000-02:00

visite: http://2lsarquitetura.com/

Site Larissa Uchoa

2009-01-24T16:30:00.000-02:00

Site feito através da Qualitare
viste: http://larissauchoa.com/

Cartões da seleção 1997

2008-09-11T12:27:00.000-03:00

Acabei de chegar na casa da minha mãe, ela encontrou umas relíquias.

Olhem a foto de "Capitão" o cara era feio mas era clássico d+.

Trabalhos | Fina Fatia

2008-08-30T13:34:00.006-03:00

Site gigantesco feito através da Qualitare, um dos destaques é o "Click Fatia" que é uma galeria de galeria de fotos, onde o cliente poderá publicar suas galerias.
O outro grande destaque é o "Cardápio" onde o cliente pode visualizar todos os produtos da loja, colocar no carrinho de compras, escolher o bairro para entrega, e o sistema te dá o valor final.
Só faltou gerar o boleto para pagamento.
Tudo isso em flash.
=]

Visitar o site

Créditos:
Agência: Qualitare.
Flash: eu, Huayna Tejo.
Sistema: Philipe Maia
Arte: Diego Costa

Trabalhos | Sandra Moura

2008-08-30T13:17:00.007-03:00

Site em flash feito através da Qualitare, já faz um tempo, nem lembro a data.
Tive que criar um "menu tree", bom aprendizado.

Visite o site

Trabalhos | Brado

2008-08-30T13:01:00.007-03:00

Trabalho de Março de 2008, resolvi postar agora.
Uma parte legal do site é a galeria da fotos, e modo de exibir a foto maior.

Visitar o site

Créditos:
www.sodavirtual.com.br
Arte: Diego Costa.
Flash: eu, Huayna Tejo.

Trabalhos | Vernier

2008-07-09T19:04:00.004-03:00

O que fazer quando o cliente pede um site pra ontem?
Comprar uma cartela de DorFlex!
O resultado ta ai:

Feito em 5 dias, 4 horas por dia.

Visitar o site.

Créditos:
SODA
Arte: Diego Costa.
Flash: eu, Huayna Tejo.

ROCKParty

2008-07-08T09:54:00.000-03:00

Achei uma relíquia aqui, nem lembro em que ano foi(2004, talvez), se alguém souber me avisa.

teste

2008-05-28T08:58:00.001-03:00