DClick

Arquivos da categoria "Flex"

Problema de foco com Flash/Flex no Firefox

Categorias relacionadas: Flash Player, Flex
Twitter!

Estou trabalhando em um projeto atualmente em que o cliente solicitou que o aplicativo pudesse ser controlado por teclas de atalho. Elas funcionam perfeitamente no Google Chrome e no IE mas, por algum motivo, o Firefox não trabalha muito bem com o foco em objetos "embedados" as vezes.

Depois de muitos testes, encontrei uma maneira bem simples de "resolver" esse problema. Primeiro você precisa abrir sua aplicação em algum navegador e olhar o código fonte de página. Procure pela tag <object> e olhe o valor do atributo "id" dela. Se você estiver no Flex usando o template padrão, esse valor deverá ser o nome da sua Application. No meu caso esse valor é "index". Então escrevi essa linha em JavaScript para colocar o foco novamente no Flash:

JAVASCRIPT:
  1. document.getElementById('index').focus();

Para usar esse código em sua aplicação Flex sem precisar mudar nada no template, faça:

ACTIONSCRIPT:
  1. navigateToURL(new URLRequest("javascript:try{ document.getElementById('index').focus(); void(0); }catch(err){}"), "_self");
  2. algumComponente.setFocus();

Funcionará melhor se você tentar encontrar onde sua aplicação está perdendo o foco (ao abrir alguma popup, no meu caso) e colocar o código logo em seguida. Usei um try/catch para evitar problemas, como no caso do usuário abrir o SWF diretamente.

Espero que seja útil,
Abraços!

Por André Gil em 26/August/2010
Nenhum Comentário »


No Translations

Como desenvolver e debugar Flex no Google Chrome

Categorias relacionadas: Eclipse, Flex
Twitter!

Desenvolver e debugar aplicações Flex no Google Chrome as vezes pode dar um pouco de dor de cabeça. Por isso, vou mostrar para vocês como resolver alguns dos problemas mais comuns.

Configurando o Eclipse


Primeiro você deve configurar o Eclipse. Abra Preferences > General > Web Browser e selecione "Use external Web Browser". Então, clique em "New" e adicione "Google Chrome" usando a seguinte "Location":

/Applications/Google Chrome.app/Contents/MacOS/Google Chrome

Suas configurações deverão ficar assim:

Se estiver usando o Windows, você deverá clicar em "Browse..." e encontrar o arquivo .EXE do Google Chrome, no local onde foi instalado.

Debug Flash Player


O Chrome tem seu próprio Flash Player, então mesmo se você instalar a versão de debug, pode ser que ela não seja usada pelo Chrome. Então primeiro, se você não tem o Player de debug, baixe ele.

Se você já instalou e reiniciou o Chrome, entre nesse endereço:

about:plugins

Se você reparar, vai ter duas versões do Flash Player instaladas. Uma delas, vai estar dentro das pastas do Chrome, e essa versão você deverá desativar. Mantenha a que você acabou de instalar. Vai ficar assim:

Update: Se você não conseguir desativar seus plugins, baixe o Chrome na versão de desenvolvimento aqui.

Depois disso, clique com o botão direito sobre o Flash de qualquer site e veja se você tem a opção "Show Redraw Regions". Se tiver, você já está usando o player de debug.

Problemas com Cache


Se ficar atualizando a aplicação o tempo todo, você pode ter problemas com o cache do Chrome. Como acho que não existe uma opção fácil para desativar o cache, criei um aplicativo para Mac que vai iniciar o Chrome com alguns parâmetros para remover o cache temporariamente.

Para usar, baixe o aplicativo, descompacte, e mova para a pasta Applications do Mac. Se quiser, você pode arrastar depois o app para o Dock do Mac para ter acesso rápido a ele:

Como o Chrome mantém uma instância inicial, você deverá iniciar ele pelo meu aplicativo caso não queira o Cache. Se você executar depois de já ter iniciado o Chrome, ele ainda vai manter o cache. Para ativar o cache novamente, basta fechar tudo e iniciar pelo link normal do Chrome.

Para usuários do Windows, basta copiar o atalho do Chrome, clicar com o botão direito na cópia, ir em "Propriedades" e adicionar esses parâmetros na linha de comando:

--disk-cache-size=1 --media-cache-size=1

O ícon preto do Chrome foi criado por GreasyBacon. Não deixe de conhecer os outros trabalhos dele.

Conclusão


É isso! O único problema que ainda tenho é ao usar a opção "Find in Language Reference". Se descobrir como resolver, atualizarei o post. Se você descobrir algo, não esqueça de deixar nos comentários.

Abraços!

Por André Gil em 10/May/2010
2 Comentários »


No Translations

Typesafe Enum em Action Script 3

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

O screencast abaixo é bem simples, porém muito eficiente para proteger o seu código. É importante ressaltar que isso tudo é necessário, pois o Action Script 3 não possui construtor privado e muito menos a implementação nativa de Enum.

Por Rafael Martinelli em 18/February/2010
14 Comentários »


No Translations

Oportunidade para Trabalhar com RIA no RJ

Categorias relacionadas: Flex, Notícias
Twitter!

A DClick RJ está contratando programadores RIA para trabalhar no RJ.

Se você conhece bem Adobe Flex suas chances são grandes. Senão, veja se você encaixa na filosofia abaixo.

Nota: Os dois últimos projetos do vídeo foram desenvolvidos pela em parceria com a Roundarch dos EUA.

Os interessados devem enviar um email para: oportunidade@dclick.com.br. Quem sabe no próximo DClick Team Teaser o seu nome não faça parte da lista que aparece no final do clipe.

Por Beck Novaes em 12/February/2010
6 Comentários »


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