Agora também no Twitter!
Sigam-me os bons!
http://twitter.com/idemax
quinta-feira, 4 de junho de 2009
terça-feira, 19 de maio de 2009
Trocadilhos Geek
Olá, hoje escutei mais um "trocadilho geek", então resolvi postá-los aqui para homenagear seus autores e mudar um pouco de assunto...
"Escreveu, não leu... Estoura o Buffer!"
(Rodrigo P. Botelho)
"O que o listener não vê, o código não sente..."
(Mateus P. Vanzo)
(Rodrigo P. Botelho)
"O que o listener não vê, o código não sente..."
(Mateus P. Vanzo)
Se você tem algum, me mande no e-mail idemax@gmail.com que eu publico aqui!
domingo, 17 de maio de 2009
Loader do Stage e de aquivos externos (Preloader)
Olá, ví alguns posts na internet sobre esse assunto mas sempre estavam faltando algo. Nesse post vou tentar mostrar os dois principais carregadores em actionscript 3.0, o carregamento do STAGE e de um arquivo externo, no caso, uma imagem JPEG.
Esse post também é dedicado ao meu amigo que está com dificuldades nesse assunto.
Segue abaixo o código da classe Main:
package
{
import fl.controls.ProgressBarMode;
import flash.display.Loader;
import flash.display.MovieClip;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.events.ProgressEvent;
import flash.net.URLRequest;
/**
* ...
* @author www.idemax.net
*/
public class Main extends MovieClip
{
private var externalLoader:Loader;
public function Main()
{
stop();
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
loaderInfo.addEventListener(Event.INIT, onStageLoaderInit);
loaderInfo.addEventListener(ProgressEvent.PROGRESS, onStageLoaderProgress);
loaderInfo.addEventListener(Event.COMPLETE, onStageLoaderComplete);
}
/**
* Iniciou o carregamento do STAGE
* @param event
*/
private function onStageLoaderInit(event:Event):void
{
event.target.removeEventListener(Event.INIT, onStageLoaderInit);
stageLoader.label.text = '0%';
}
/**
* Enquando está carregando o STAGE
* @param event
*/
private function onStageLoaderProgress(event:ProgressEvent):void
{
var pct:Number = Math.round((event.bytesLoaded / event.bytesTotal) * 100);
stageLoader.label.text = pct + '%';
}
/**
* O STAGE acabou de carregar
* @param event
*/
private function onStageLoaderComplete(event:Event):void
{
event.target.removeEventListener(Event.COMPLETE, onStageLoaderComplete);
addFrameScript(1, onFrame2);
gotoAndStop(2);
}
/**
* Linha do tempo no FRAME 2
*/
private function onFrame2():void
{
botao.label = 'carregar imagem externa';
botao.addEventListener(MouseEvent.CLICK, onButtonClick);
externalLoader = new Loader();
externalLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onExternalLoaderProgress);
externalLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onExternalLoaderComplete);
}
/**
* Quando o botão de 'carregar imagem externa' é clicaco
* É iniciado o Loader
* @param event
*/
private function onButtonClick(event:MouseEvent):void
{
botao.enabled = false;
barra.mode = ProgressBarMode.MANUAL;
externalLoader.load(new URLRequest('imagem_externa.jpg'));
}
/**
* Enquando carrega a imagem externa
* @param event
*/
private function onExternalLoaderProgress(event:ProgressEvent):void
{
barra.setProgress(event.bytesLoaded, event.bytesTotal);
}
/**
* A imagem externa está carregada
* @param event
*/
private function onExternalLoaderComplete(event:Event):void
{
event.target.removeEventListener(Event.COMPLETE, onExternalLoaderComplete);
externalLoader.width = 550;
externalLoader.height = 400;
addChild(externalLoader);
}
}
}
Clique aqui para ver um exemplo on-line ou no link abaixo para fazer o download dos arquivos:
Paint em Actionscript 3.0
Olá, fiz um protótipo bem simples de "Paint" em Actionscript 3.0. Nele você pode escolher a cor, o tamanho do pincél e limpar a tela.
Classe principal:
package
{
import fl.controls.Button;
import fl.controls.ColorPicker;
import fl.controls.Slider;
import fl.events.ColorPickerEvent;
import fl.events.SliderEvent;
import flash.display.MovieClip;
import flash.display.StageScaleMode;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.geom.Point;
import flash.text.TextField;
import flash.ui.Mouse;
/**
* ...
* @author www.idemax.net
*/
public class Main extends MovieClip
{
private var margin:Number = 10;
private var rounding:Number = 20;
private var border:Number = 5;
private var defaultWord:String = 'desenhe na área branca acima';
private var brushMinimum:Number = 1;
private var brushCurrent:Number = 10;
private var brushMaximum:Number = 100;
private var drawEnable:Boolean = false;
private var startDrawingEnable:Boolean = false;
private var container:MovieClip;
private var panel:MovieClip;
private var panelTitle:TextField;
private var infoLabel:TextField;
private var drawStage:MovieClip;
private var tools:MovieClip;
private var toolsTitle:TextField;
private var labelColorPicker:TextField;
private var colorPicker:ColorPicker;
private var currentColor:uint;
private var slider:Slider;
private var labelSlider:TextField;
private var currentBrushSize:Number;
private var brushCicle:MovieClip;
private var drawMask:MovieClip;
private var drawContainer:MovieClip;
private var lineDraw:MovieClip;
private var button:Button;
private var linesDraw:Array;
private var drawMouseInspector:MovieClip;
/**
* Construtora da Classe
* Adiciona os listeners necessários e aplica as configurações básicas
* Os eventos "MainEvents" são personalizados
*/
public function Main()
{
loaderInfo.addEventListener(Event.COMPLETE, onCompleteHandler);
stage.align = 'TL';
//stage.scaleMode = StageScaleMode.NO_SCALE;
stage.addEventListener(Event.RESIZE, onResizeStage);
addEventListener(MouseEvent.ROLL_OUT, onRollOutApplication);
addEventListener(MainEvents.CREATE_PANEL, onCreatePanelHandler);
addEventListener(MainEvents.CREATE_TOOLS, onCreateToolsHandler);
addEventListener(MainEvents.UPDATE_INFO_LABEL, onUpdateInfoLabelHandler);
addEventListener(MainEvents.UPDATE_BRUSH, onUpdateBrushHandler);
addEventListener(MainEvents.UPDATE_COMPLETE_BRUSH, onUpdateCompleBrushHandler);
addEventListener(MainEvents.UPDATE_COMPLETE_INFO_LABEL, onUpdateCompleInfoLabelHandler);
addEventListener(MainEvents.DRAW_START, onDrawStartHandler);
addEventListener(MainEvents.DRAWING, onDrawingHandler);
addEventListener(MainEvents.DRAW_COMPLETE, onDrawCompleteHandler);
}
/**
* Inicia a criação da aplicação quando a mesma foi totalmente carregada
* @param e
*/
private function onCompleteHandler(e:Event):void
{
dispatchEvent(new MainEvents(MainEvents.CREATE_PANEL));
}
/**
* Re-cria a aplicação quando as dimensões do STAGE são alteradas
* OBS.: Se houver desenho, ele será perdido
* @param e
*/
private function onResizeStage(e:Event):void
{
dispatchEvent(new MainEvents(MainEvents.CREATE_PANEL));
}
/**
* ANTI-BUG: Se o usuário rolar para fora da aplicação ele para de desenhar se estiver do modo DESENHO
* @param e
*/
private function onRollOutApplication(e:MouseEvent):void
{
dispatchEvent(new MainEvents(MainEvents.DRAW_COMPLETE));
}
/**
* Cria e configura os listeners dos elementos visuais, exceto os componentes das ferramentas
* @param e
*/
private function onCreatePanelHandler(e:MainEvents):void
{
if (container != null)
{
removeChild(container);
container = null;
}
container = new MovieClip();
addChild(container);
panel = new MovieClip();
panel.graphics.beginFill(0xcccccc);
panel.graphics.drawRoundRect(0, 0, stage.stageWidth - (margin * 2), stage.stageHeight - (margin * 2), rounding, rounding);
panel.graphics.endFill();
panel.x = panel.y = margin;
container.addChild(panel);
panelTitle = new TextField();
panelTitle.autoSize = 'left';
panelTitle.htmlText = 'Desenhando com o actionscript 3.0';
panelTitle.x = panelTitle.y = margin;
panel.addChild(panelTitle);
infoLabel = new TextField();
infoLabel.autoSize = 'left';
infoLabel.text = defaultWord;
infoLabel.x = margin;
infoLabel.y = panel.height - infoLabel.textHeight - margin;
panel.addChild(infoLabel);
drawStage = new MovieClip();
drawStage.graphics.lineStyle(border, 0x000000, .25);
drawStage.graphics.beginFill(0xffffff);
drawStage.graphics.drawRoundRect(0, 0, stage.stageWidth / 100 * 75, infoLabel.y - (panelTitle.y + panelTitle.textHeight + (margin * 2)), rounding, rounding);
drawStage.graphics.endFill();
drawStage.x = margin;
drawStage.y = panelTitle.y + panelTitle.textHeight + margin;
panel.addChild(drawStage);
drawContainer = new MovieClip();
panel.addChild(drawContainer);
drawMask = new MovieClip();
drawMask.graphics.beginFill(0x000000);
drawMask.graphics.drawRoundRect(0, 0, stage.stageWidth / 100 * 75, infoLabel.y - (panelTitle.y + panelTitle.textHeight + (margin * 2)), rounding, rounding);
drawMask.graphics.endFill();
drawMask.x = margin;
drawMask.y = panelTitle.y + panelTitle.textHeight + margin;
panel.addChild(drawMask);
drawContainer.mask = drawMask;
drawMouseInspector = new MovieClip();
drawMouseInspector.addEventListener(MouseEvent.ROLL_OVER, onRollOverMouseInspector);
drawMouseInspector.addEventListener(MouseEvent.ROLL_OUT, onRollOutMouseInspector);
drawMouseInspector.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDownMouseInspector);
drawMouseInspector.addEventListener(MouseEvent.MOUSE_UP, onMouseUpMouseInspector);
drawMouseInspector.graphics.beginFill(0xff0000, 0);
drawMouseInspector.graphics.drawRoundRect(0, 0, stage.stageWidth / 100 * 75, infoLabel.y - (panelTitle.y + panelTitle.textHeight + (margin * 2)), rounding, rounding);
drawMouseInspector.graphics.endFill();
drawMouseInspector.x = margin;
drawMouseInspector.y = panelTitle.y + panelTitle.textHeight + margin;
panel.addChild(drawMouseInspector);
tools = new MovieClip();
tools.graphics.lineStyle(border, 0x000000, .25);
tools.graphics.beginFill(0xffffff);
tools.x = drawStage.x + drawStage.width + margin;
tools.y = drawStage.y;
toolsTitle = new TextField();
toolsTitle.autoSize = 'left';
toolsTitle.htmlText = 'Ferramentas';
toolsTitle.x = toolsTitle.y = margin;
tools.addChild(toolsTitle);
container.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDownContainer);
container.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMoveContainer);
container.addEventListener(MouseEvent.MOUSE_UP, onMouseUpContainer);
dispatchEvent(new MainEvents(MainEvents.CREATE_TOOLS));
}
/**
* Crias e configuras os listeners dos componentes das ferramentas
* @param e
*/
private function onCreateToolsHandler(e:MainEvents):void
{
linesDraw = new Array();
labelColorPicker = new TextField();
labelColorPicker.autoSize = 'left';
labelColorPicker.text = 'Selecione a cor:';
labelColorPicker.x = margin;
labelColorPicker.y = toolsTitle.y + toolsTitle.textHeight + (margin * 3);
tools.addChild(labelColorPicker);
colorPicker = new ColorPicker();
colorPicker.addEventListener(ColorPickerEvent.CHANGE, onColorPickerChange);
colorPicker.x = labelColorPicker.x + labelColorPicker.textWidth + margin;
colorPicker.y = labelColorPicker.y;
tools.addChild(colorPicker);
currentColor = colorPicker.selectedColor;
labelSlider = new TextField();
labelSlider.autoSize = 'left';
labelSlider.text = 'Tamanho do pincel:';
labelSlider.x = margin;
labelSlider.y = colorPicker.y + colorPicker.height + (margin * 3);
tools.addChild(labelSlider);
slider = new Slider();
slider.addEventListener(SliderEvent.CHANGE, onSliderChange);
slider.minimum = brushMinimum;
slider.maximum = brushMaximum;
slider.x = margin * 2;
slider.y = labelSlider.y + labelSlider.textHeight + margin;
slider.value = brushCurrent;
tools.addChild(slider);
currentBrushSize = slider.value;
button = new Button();
button.addEventListener(MouseEvent.CLICK, onClickButtonCleanScreean);
button.label = 'limpar tela';
button.x = margin;
button.y = slider.y + slider.height + (margin * 3);
tools.addChild(button);
tools.graphics.drawRoundRect(0, 0, stage.stageWidth - drawStage.width - (margin * 5), button.y + button.height + margin, rounding, rounding);
tools.graphics.endFill();
panel.addChild(tools);
}
/**
* O usuário rolou para dentro da área de desenho
* @param e
*/
private function onRollOverMouseInspector(e:MouseEvent):void
{
var mc:MovieClip = e.target as MovieClip;
mc.addEventListener(Event.ENTER_FRAME, onEnterFrameDrawStage);
}
/**
* O usuário rolou para fora da área de desenho
* @param e
*/
private function onRollOutMouseInspector(e:MouseEvent):void
{
var mc:MovieClip = e.target as MovieClip;
mc.removeEventListener(Event.ENTER_FRAME, onEnterFrameDrawStage);
dispatchEvent(new MainEvents(MainEvents.UPDATE_COMPLETE_BRUSH));
dispatchEvent(new MainEvents(MainEvents.UPDATE_COMPLETE_INFO_LABEL));
}
/**
* O usuário começa a desenhar na área de desenho
* @param e
*/
private function onMouseDownMouseInspector(e:MouseEvent):void
{
startDrawingEnable = true;
}
/**
* O usuário parou de desenhar
* @param e
*/
private function onMouseUpMouseInspector(e:MouseEvent):void
{
startDrawingEnable = false;
}
/**
* O usuário soltou o botão esquerdo do mouse dentro da aplicação
* @param e
*/
private function onMouseUpContainer(e:MouseEvent):void
{
dispatchEvent(new MainEvents(MainEvents.DRAW_COMPLETE));
}
/**
* O usuário está movimentando o mouse dentro da aplicação
* @param e
*/
private function onMouseMoveContainer(e:MouseEvent):void
{
dispatchEvent(new MainEvents(MainEvents.DRAWING));
}
/**
* O usuário tenta desenhar dentro da aplicação
* A aplicação verifica se o usuário está tentando
* dentro da área de desenho
* @param e
*/
private function onMouseDownContainer(e:MouseEvent):void
{
if (!startDrawingEnable) return;
dispatchEvent(new MainEvents(MainEvents.DRAW_START));
}
/**
* Dispara enquanto o usuário está com o mouse dentro da área de desenho
* @param e
*/
private function onEnterFrameDrawStage(e:Event):void
{
dispatchEvent(new MainEvents(MainEvents.UPDATE_INFO_LABEL));
dispatchEvent(new MainEvents(MainEvents.UPDATE_BRUSH));
}
/**
* Posiciona o ponteiro de desenho na mesma posição do mouse do usuário
* enquanto o mesmo se encontra na área de desenho
* @param e
*/
private function onUpdateBrushHandler(e:MainEvents):void
{
if (infoLabel == null) return;
if (brushCicle != null) drawContainer.removeChild(brushCicle);
Mouse.hide();
brushCicle = new MovieClip();
brushCicle.graphics.lineStyle(border, 0x000000, .5);
brushCicle.graphics.beginFill(currentColor);
brushCicle.graphics.drawCircle(drawContainer.mouseX, drawContainer.mouseY, currentBrushSize);
brushCicle.graphics.endFill();
drawContainer.addChild(brushCicle);
}
/**
* Atualiza o LOG de posição cartesiana do ponteiro do mouse na área de desenho
* enquanto o mesmo se encontra na área de desenho
* @param e
*/
private function onUpdateInfoLabelHandler(e:MainEvents):void
{
if (infoLabel == null) return;
infoLabel.text = 'x: ' + drawStage.mouseX + ' - y: ' + drawStage.mouseY;
}
/**
* Seta a mensagem padrão quando o usuário não está com o
* ponteiro do mouse sobre a área de desenho
* @param e
*/
private function onUpdateCompleInfoLabelHandler(e:MainEvents):void
{
infoLabel.text = defaultWord;
}
/**
* Quando o ponteiro do mouse sai da área de desenho, o ponteiro de desenho some
* e da lugar novamente ao ponteiro do mouse
* @param e
*/
private function onUpdateCompleBrushHandler(e:MainEvents):void
{
if (brushCicle != null)
{
drawContainer.removeChild(brushCicle);
brushCicle = null;
}
Mouse.show();
}
/**
* Fecha a linha desenhada pelo usuário e deixa a variável preparada para uma nova
* @param e
*/
private function onDrawCompleteHandler(e:MainEvents):void
{
drawEnable = false;
if (lineDraw == null) return;
lineDraw.graphics.endFill();
lineDraw = null;
}
/**
* Desenha as linhas referente ao ponteiro do mouse
* @param e
*/
private function onDrawingHandler(e:MainEvents):void
{
if (!drawEnable) return;
lineDraw.graphics.lineTo(drawContainer.mouseX, drawContainer.mouseY);
}
/**
* Cria um ponto caso o usuário somente queira pontilhar
* e inicia a nova linha
* @param e
*/
private function onDrawStartHandler(e:MainEvents):void
{
var dot:MovieClip = new MovieClip();
dot.graphics.beginFill(currentColor);
dot.graphics.drawCircle(drawContainer.mouseX, drawContainer.mouseY, currentBrushSize);
linesDraw.push(drawContainer.addChild(dot));
lineDraw = new MovieClip();
lineDraw.graphics.moveTo(drawContainer.mouseX, drawContainer.mouseY);
lineDraw.graphics.lineStyle(currentBrushSize * 2, currentColor);
linesDraw.push(drawContainer.addChild(lineDraw));
drawEnable = true;
}
/**
* Guarda a cor escolhida
* @param e
*/
private function onColorPickerChange(e:ColorPickerEvent):void
{
var cp:ColorPicker = e.target as ColorPicker;
currentColor = cp.selectedColor;
}
/**
* Guarda o tamanho do pincel escolhido
* @param e
*/
private function onSliderChange(e:SliderEvent):void
{
var sld:Slider = e.target as Slider;
currentBrushSize = sld.value;
}
/**
* Limpa os desenho feitos
* @param e
*/
private function onClickButtonCleanScreean(e:MouseEvent):void
{
for (var i:int = 0; i < linesDraw.length; i++)
{
var mc:MovieClip = linesDraw[i] as MovieClip;
drawContainer.removeChild(mc);
}
linesDraw = new Array();
}
}
}
Classe de eventos:
package
{
import flash.events.Event;
/**
* ...
* @author www.idemax.net
*/
public class MainEvents extends Event
{
public static const CREATE_PANEL:String = 'createPanel';
public static const CREATE_TOOLS:String = 'createTools';
public static const UPDATE_INFO_LABEL:String = 'updateInfoLabel';
public static const UPDATE_BRUSH:String = 'updateBrush';
public static const UPDATE_COMPLETE_INFO_LABEL:String = 'updateCompleteInfoLabel';
public static const UPDATE_COMPLETE_BRUSH:String = 'updateCompleteBrush';
public static const DRAW_START:String = 'drawStart';
public static const DRAWING:String = 'drawing';
public static const DRAW_COMPLETE:String = 'drawComplete';
public function MainEvents(type:String, bubbles:Boolean=false, cancelable:Boolean=false)
{
super(type, bubbles, cancelable);
}
}
}
Clique aqui para ver um exemplo on-line ou no link abaixo para fazer o download dos arquivos:
domingo, 5 de abril de 2009
Portal Pró-Amendoim
Participação: Estruturação de elementos e conteúdo com tabless, flash e javascript (Mootools).
Agência: Labclick
Link: www.proamendoim.com.br
domingo, 29 de março de 2009
Trigonometria com Actionscript
"Trigonometria (do grego trigōnon "triângulo" + metron "medida") é um ramo da matemática que estuda os triângulos, particularmente triângulos em um plano onde um dos ângulos do triângulo mede 90 graus (triângulo retângulo). Também estuda especificamente as relações entre os lados e os ângulos dos triângulos; as funções trigonométricas, e os cálculos baseados nelas. A abordagem da trigonometria penetra outros campos da geometria, como o estudo de esferas usando a trigonometria esférica".
Não tenho certeza, mas acho que os grausº no actionscript são dessa forma para facilitar a conversão para radianos. Sendo o positivo e negativo os controladores de hemisfério, o positivo +y e negativo -y.
Programando...
Pronto! Agora é só usar a imaginação...
Fonte: Wikipédia - 29/03/2009 - http://pt.wikipedia.org/wiki/Trigonometria
Olá, hoje irei explicar alguns conceitos básicos de como usar a trigonometria com actionscript. Vou levar em conta que você já tem algum conhecimento em actionscript 3, ok?! Então vamos lá...
No final desse post, você vai entender facilmente como se faz:
Radianos
"O ângulo definido no centro de um círculo por um arco de circunferência com o mesmo comprimento que o raio do círculo é 1 radiano".
Fonte: Wikipédia - 29/03/2009 - http://pt.wikipedia.org/wiki/Radianos
"O ângulo definido no centro de um círculo por um arco de circunferência com o mesmo comprimento que o raio do círculo é 1 radiano".
Fonte: Wikipédia - 29/03/2009 - http://pt.wikipedia.org/wiki/Radianos
Um radiano equivale a 57,29º, ou seja, uma círcuferência tem
6,28 radianos (360º).
6,28 radianos (360º).
No actionscript, o 0º (grau zero) começa no ponto (raio, 0) e cresce em sentido horário até (-raio, 0) formando 180º, após esse ponto, torna-se negativo (-180º) e vai diminuindo em sentido horário até o ponto (raio, 0) que é 0º (grau zero).
Tanto que se você fizer:
meuMc.rotation = 270;
trace(meuMc.rotation);
//Retorna: -90
Círculo Trigonométrico
Depois dos radiano, fica mais fácil entender a imagem acima assim...
O ponto em que a hipotenusa cruza com o perímetro da circunferência, vamos chamá-lo de P. Para calculá-lo, usamos as formulás:
Px = cosseno(radiano) * raio;
Py = seno(radiano) * raio;
Para podermos desenhar uma simples circunferência no palco, podemos fazer assim:
var radius:Number = 100;
var circle:Shape = new Shape();
circle.graphics.lineStyle(1);
circle.graphics.moveTo(radius, 0);
for (var i:int = 0; i <= 360; i++)
{
var radian:Number = i * (Math.PI / 180);
var xPoint:Number = Math.cos(radian) * radius;
var yPoint:Number = Math.sin(radian) * radius;
circle.graphics.lineTo(xPoint, yPoint);
}
circle.graphics.endFill();
circle.x = stage.stageWidth / 2;
circle.y = stage.stageHeight / 2;
addChild(circle);
Abaixo o link para o download dos fontes:
clique aqui
clique aqui
terça-feira, 10 de fevereiro de 2009
Binding no Flash e no Flex
Olá, vou mostrar algumas diferenças do Flash para Flex.
Como primeiro exemplo, vou ligar dois TextFields, o que você digita no de cima, é copiado para o de baixo em tempo real.
No Flash:
package
{
import fl.controls.Label;
import fl.controls.TextInput;
import flash.display.Sprite;
import flash.events.Event;
public class Flash extends Sprite
{
private var textInput1:TextInput;
private var textInput2:TextInput;
private var labell:Label;
private var label2:Label;
public function Flash()
{
criaLabels();
criarTextInputs();
criaBindable();
}
private function criarTextInputs():void
{
textInput1 = new TextInput();
textInput2 = new TextInput();
textInput1.move(70, 10);
textInput2.move(70, 40);
addChild(textInput1);
addChild(textInput2);
}
private function criaLabels():void
{
labell = new Label();
label2 = new Label();
labell.move(10, 10);
label2.move(10, 40);
labell.text = "Campo 1:";
label2.text = "Campo 2:";
addChild(labell);
addChild(label2);
}
private function criaBindable():void
{
textInput1.addEventListener(Event.CHANGE, binding);
}
private function binding(e:Event):void
{
textInput2.text = textInput1.text;
}
}
}
No Flash tive que criar uma classe para meu SWF, usei o Sprite pois no Flex também não existe "timeline". Importei as classes necessárias para eu trabalhar com TextFields e Labels. Criei, configurei e adicionei no palco os componentes que queria usar.
Depois tive que fazer o "binding", criei um "listener" para ouvir quando o valor do campo de cima fosse alterado e um "callBack" para pegar o valor do campo de cima e atribuir ao de baixo.
Pronto, só isso... UFA!
Agora vamos ao Flex:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:TextInput id="campo1" x="79" y="10"/>
<mx:TextInput x="79" y="40" text="{campo1.text}"/>
<mx:Label x="10" y="12" text="Campo 1:"/>
<mx:Label x="10" y="42" text="Campo 2:"/>
</mx:Application>
Fiz tudo denovo, com excessão dos "imports" e que no Flash eu tive que arrastar os componetes na mão para a biblioteca. No Flex, por se tratar de um framework, ele já entende o que você está fazendo e importa os componentes e classes que serão necessários.
O "binding" são os "{" e "}", isso diz ao framework que quando o valor do "campo1" for atualizado, o valor do "campo2" será atualizado também.
Outra forma de fazer é programar actionscript 3 direto Flex, mas isso é assunto para outro post...
Download do arquivos:
quinta-feira, 29 de janeiro de 2009
Adobe Flex Builder 3
Estou respirando novos ares, o cheiro de MXML está no ar!
Conheço esse framework mais ou menos desde 2006 através de um amigo. E agora com o actionscript 3 mais difundido, me interessei novamente em aprender sobre essa ferramenta, que na minha opnião, pode mudar muita coisa no futuro.
Em breve, alguns labs que estou fazendo para aprender... E talvez alguns jobs!
quinta-feira, 18 de dezembro de 2008
segunda-feira, 15 de dezembro de 2008
Bebidas Ipiranga - Cartão Natal 2008
segunda-feira, 1 de dezembro de 2008
Funpet (Jogo Quebra-Cabeça)
Participação: Jogo de quebra-cabeça, flash, actionscript e layout para o jogo.Agência: Labclick
Link: www.funpet.com.br
Assinar:
Postagens (Atom)