DClick

Uma palestra por R$3,00 e um sorriso que não se paga

Categorias relacionadas: (Sem Categoria)
Twitter!

Uma palestra do Flex For Kids: R$ 3,00.
O evento Flex For Kids: R$ 30,00.
Ver o incrível vídeo do Flex For Kids. Apenas 3 minutos.
Ajudar uma criança a sorrir: Não tem preço.

Por Rubens Albuquerque em 1/February/2010
Nenhum Comentário »


No Translations

Como pegar o BitmapData e o ByteArray de um Embed no Flex?

Categorias relacionadas: Flex
Twitter!

Quando você quer manipular imagens e outros tipos de arquivos no Flex, geralmente você precisa do BitmapData ou o ByteArray desse arquivo. A maioria das pessoas já sabe como fazer isso usando o Loader, mas é um pouco mais difícil encontrar informações sobre como fazer isso com arquivos "Embedados". Por isso, vou mostrar aqui como fazer!

Se você quer embedar uma imagem (JPEG, GIF ou PNG) no Flex, você precisa embedar em uma variável do tipo Class. O que a maioria das pessoas não sabe é que o tipo dessa classe será BitmapAsset e que BitmapAsset é uma subclasse da classe Bitmap. Então, você pode fazer isso:

Actionscript:
  1. [Embed(source="image.png")]
  2. public var MyEmbed:Class;
  3.  
  4. private function getBitmapData():BitmapData
  5. {
  6.     var bitmapAsset:BitmapAsset = new MyEmbed();
  7.     return bitmapAsset.bitmapData;
  8. }


Agora, para pegar o ByteArray, você precisa de uma pequena alteração. Você deve adicionar o parâmetro mimeType="application/octet-stream" para a metadata Embed. Com esse parâmetro, a variável Class será do tipo ByteArrayAsset, que é uma subclasse do ByteArray. Então, você poderá fazer isso:

Actionscript:
  1. [Embed(source="image.png",mimeType="application/octet-stream")]
  2. public var MyEmbed:Class;
  3.  
  4. private function getByteArray():ByteArrayAsset
  5. {
  6.     var byteArrayAsset:ByteArrayAsset = new MyEmbed();
  7.     return byteArrayAsset;
  8. }


Dessa maneira, você pode até usar o Embed em algum arquivo TXT ou XML para sua aplicação e lê-lo facilmente! O ByteArray pode ser convertido para String dessa maneira:

Actionscript:
  1. [Embed(source="myTextFile.txt",mimeType="application/octet-stream")]
  2. public var MyEmbed:Class;
  3.  
  4. private function readEmbeddedTxt():String
  5. {
  6.     var byteArrayAsset:ByteArrayAsset = new MyEmbed();
  7.     return byteArrayAsset.toString();
  8. }


Fácil, hein?

Por André Gil em 28/January/2010
1 Comentário »


No Translations

Flex For Kids

Categorias relacionadas: Adobe, Flex, RIA
Twitter!

A DClick está patrocinando o Flex for Kids. Este é um evento muito especial para todos que trabalham não apenas com RIA, mas com desenvolvimento de Software em geral. Eu não preciso escrever muito neste post. Basta você clicar aqui e ver (sentir) o vídeo de menos de três minutos.

Por Beck Novaes em 26/January/2010
Nenhum Comentário »


No Translations

Passando parâmetros para Event Handlers – Parte 2

Categorias relacionadas: ActionScript, Flex, Otimização, Programação
Twitter!

Ano passasdo perguntei ao Beck como passar parâmetros para Event Handlers adicionados dinamicamente, porque quando você adiciona Event Listener usando myComp.addEventListener(...), o handler deve esperar apenas o parâmetro do evento. O Beck deu uma solução para isso, mas deixou claro que é apenas uma solução "alternativa", não a melhor delas.

Alguns dias atrás eu estava trabalhando com requisições simultâneas para o servidor e queria guardar o parâmetro da chamada, mas não queria ter que retornar ele do Java, então pensei em uma outra solução para isso. Considerando que seu Event Handler está esperando uma Function que tem somente um parâmetro Event, eu criei uma outra Function que retorna uma Function esperando um parâmetro Event. Mas o segredo é que o escopo de Function Closure permite que você acesse parâmetros tanto da primeira quanto da segunda Function, então você pode fazer isso:

XML:
  1. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" height="100%" width="100%"
  2.     initialize="initApp()">
  3.  
  4.     <mx:Script>
  5.         <![CDATA[
  6.             private function initApp():void
  7.             {
  8.                 buttonA.addEventListener(MouseEvent.CLICK, buttonHandler(0x0000FF));
  9.                 buttonB.addEventListener(MouseEvent.CLICK, buttonHandler(0xFF0000));
  10.             }
  11.  
  12.             private function buttonHandler(color:uint):Function
  13.             {
  14.                 return function(event:MouseEvent):void
  15.                 {
  16.                     box.setStyle("backgroundColor", color);
  17.                 }
  18.             }
  19.         ]]>
  20.     </mx:Script>
  21.  
  22.     <mx:HBox>
  23.         <mx:Button id="buttonA" label="Blue"/>
  24.         <mx:Button id="buttonB" label="Red"/>
  25.     </mx:HBox>
  26.  
  27.     <mx:Box id="box" height="80" width="200" backgroundColor="#FFFFFF"/>
  28.  
  29. </mx:Application>


Mas e agora se você quiser usar esse Event Handler diretamente no MXML? Bem, você não pode fazer isso:

XML:
  1. <mx:Button label="Green" click="buttonHandler(0x00FF00)"/>


Isso não vai funcionar porque a Function que retorna da primeira Function está esperando um parâmetro Event. Então, você pode fazer assim:

XML:
  1. <mx:Button label="Green" click="buttonHandler(0x00FF00)(event)"/>


Estranho, não? Talvez mais um patter do FreaktionScript?

Por André Gil em 19/January/2010
7 Comentários »


No Translations

Flashcamp Brasil: “O dia seguinte”

Categorias relacionadas: Notícias
Twitter!

Sempre depois de um evento como o Flashcamp Brasil fica aquela sensação de "que pena que acabou". Mas no meu caso este sentimento é confuso. Ao mesmo tempo em que sentirei falta também me sinto aliviado. Eu tinha um grande receio que a minha apresentação não fosse bem recebida e, para ser sincero, assim como em tudo que eu faço, tinha a expectativa de estar fazendo algo de real valor.

Geralmente neste tipo de evento as pessoas esperam apresentações técnicas, demonstrações e coisas do tipo. E eles tiveram isso com excelentes apresentações tanto dos americanos quanto dos brasileiros. Mas eu tomei um rumo totalmente contrário abordando assuntos muitos mais humanos do que tecnológicos, embora a relação entre um e outro fosse reforçada em alguns pontos da apresentação. E parece que foi uma boa abordagem pelo feedback que tive das pessoas que vieram me cumprimentar depois da palestra.

Eu fico extremamente feliz de perceber que no fundo as pessoas puderam sentir e não apenas ouvir o que eu falei. Afinal de contas, uma apresentação também é uma experiência. E para mim, este primeiro Flashcamp, foi um verdadeiro marco.

Por Beck Novaes em 18/January/2010
12 Comentários »


No Translations

DClick no Flashcamp Brasil

Categorias relacionadas: Notícias, RIA
Twitter!

Nos dias 15/01/10 e 16/01/10 será realizado em Maceió o Flashcamp Brasil e eu estarei lá como palestrante representando a DClick e falando das ideias do OUTBOX. Mas eu não poderia simplesmente falar de algo que alguns já conhecem, embora, provavelmente, não seja a maioria presente no evento.

Quando falamos em RIA inevitavelmente estamos falando de Experiência do Usuário. Mas deixando o "tecniquês" de lado, eu vejo experiência do usuário como um caso de empatia. Pensar em experiência do usuário é, num certo sentido, se colocar no lugar do outro; é fazer algo para alguém esperando que ele goste do que foi feito. Por encarar isto desta forma eu vejo muitas das outras coisas que eu faço sob a perspectiva da experiência do meu publico. Seja um Software, seja um post, seja um screencast, seja um vídeo, seja um treinamento ou uma apresentação, eu sempre me coloco no lugar das pessoas para conseguir oferecer a elas uma experiência que as marque de alguma forma. A frase abaixo sintetiza muito bem esta minha maneira de pensar:

"As pessoas esquecerão o que você disse, as pessoas esquecerão o que você fez, mas as pessoas nunca esquecerão como você as fez sentir." - Maya Angelou

Espero, desta forma, marcar o publico presente no Flashcamp Brasil proporcionando-lhes bons momentos com uma palestra útil, agradável e, por que não, divertida. E se você ver um maluco com a camiseta da foto abaixo saberá que sou eu (e para você que estará no Flashcamp, saiba que a minha palestra já começou).

OUTBOX Shirt

Por Beck Novaes em 13/January/2010
5 Comentários »


No Translations

Tamanho de Container com Base nos Filhos

Twitter!

Quando criamos um Container no Flex e não especificamos seu tamanho, o tamanho será calculado com base nos filhos que são adicionados ao Container. Porém, caso você especifique um tamanho para ele, o tamanho passa a ser o que você especificou e, caso ele seja menor do que o tamanho dos filhos, o componente exibirá uma ScrollBar.

Mas e se você quiser que ele volta a calcular o tamanho para você? Existem alguns casos em que precisamos que isso seja feito, porém não podemos atribuir "null" ou -1 como valor na propriedade para que o Container volte ao comportamento inicial.

Conversando com o Beck Novaes a muito tempo atrás, ele me apontou uma solução para isso. Se vocês olharem no código de alguns componentes do Flex (como o Container ou o UIComponent), vocês encontrarão várias referências para a função isNaN() e, como muitos de vocês devem saber, NaN é o valor atribuído a variáveis numéricas quando não estão com algum valor numérico atribuído.


Portanto, para que o componente calcule o tamanho para você, faça o seguinte:

Actionscript:
  1. myContainer.height = NaN;


Um exemplo completo:

XML:
  1. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" height="100%" width="100%">
  2.  
  3.     <mx:Script>
  4.         <![CDATA[
  5.             private function sizeChanged():void
  6.             {
  7.                 if (group.selection == rbFixed)
  8.                 {
  9.                     myVBox.height = 100;
  10.                 }
  11.                 else
  12.                 {
  13.                     myVBox.height = NaN;
  14.                 }
  15.             }
  16.         ]]>
  17.     </mx:Script>
  18.  
  19.     <mx:HBox>
  20.         <mx:RadioButtonGroup id="group"
  21.             change="sizeChanged()"/>
  22.         <mx:RadioButton id="rbFixed" label="Fixed Size" selected="true"
  23.             group="{group}"/>
  24.         <mx:RadioButton id="rbAuto" label="Auto Size"
  25.             group="{group}"/>
  26.     </mx:HBox>
  27.  
  28.     <mx:VBox id="myVBox" height="100" width="150" backgroundColor="#FFFFFF" horizontalAlign="center">
  29.         <mx:Button label="Botão 1"/>
  30.         <mx:Button label="Botão 2"/>
  31.         <mx:Button label="Botão 3"/>
  32.         <mx:Button label="Botão 4"/>
  33.         <mx:Button label="Botão 5"/>
  34.     </mx:VBox>
  35.  
  36. </mx:Application>


Estranho, não? Seria esse mais um pattern do FreaktionScript?

Por André Gil em 11/January/2010
Nenhum Comentário »


No Translations