Bom, esta frase nunca teve tanto sentido, e vou passar a explicar o porque! Neste artigo vou explicar como criar uma aplicação em Adobe Flash Builder 4 (Flex4) e distribui-la para o Android, e inclusive corre-la no proprio dispositivo… este processo à algum tempo parecia impossivel, mas agora é muito facil… até tive uma discussão bem agradavel com o Janderson que estão a abri-se novas portas e aguardem que ele vai lançar ainda mais dicas na sua palestra do flexmania, não faltem!

Claro que foi preciso alguma investigação e uma ou outra ferramentas para reduzir o trabalho, mas no final temos a mesma aplicação a correr com applicação Desktop, Web e Mobile sem qualquer alteração de código, apenas com atenção a um ou outro elemento.

No momento é altamente recomendado que não usem isto para aplicações finais, porque as suas limitações e alterações no futuro podem ser muitas requerendo por completo a recompilação da aplicação com outro SDK, mas nada de grave… como é apenas para provar a teoria de que o flex já funciona no AIR dos dispositivos Android sem necessidade da tão esperada Framework Slider, aqui vamos.

Primeiro o que é necessário ter instalado na sua maquina.

1. Flash Builder 4 Instalado, podem fazer download aqui: http://www.adobe.com/products/flashbuilder/, podem escolher o trial, e se forem estudantes ou desempregados a licensa é gratuita, vejam aqui.

2. AIR SDK 2.0, podem fazer o download aqui: http://labs.adobe.com/downloads/air2.html

3. AIR SDK 2.5, actualmente apenas em pre-release, registem-se no programa aqui. Depois do registo e do login, podem fazer o dowload do SDK 2.5 (para o android 2.1 Eclair, o download deve ser da release datada do 04/06 2010, a ultima release apenas funciona no Android 2.2 froYo).

4. Package Assistant Pro, a aplicação que poupa algumas dores de cabeça de volta da linha de comandos com o compiler manual do SDK. Esta é a aplicação que torna tudo muito mais facil, acreditem! (Por vezes os antivirus ficam meios loucos com este ficheiro, se for o caso desliguem o antivirus antes do download e instalação.)

Depois disto instalado, (…)
Leia o resto de “Write Once, Deploy to many!” – Flex4 + Air + Android (661 palavras)

© msdevweb for TSW – That Should Work Blog, 2010. | Permalink |No comment | Add to del.icio.us

Post tags: air2.5, android, exemplo, flex4, nexus one, source, Tutorial

Em continuação a série de tutoriais sobre AS3…

Nesta parte do tutorial vamos usar todo o conhecimento passado nos exemplos anteriores para criar um explorador de efeitos e animações…

Começando…

6.9.1. Exemplo de explorador de efeitos / animações

Para o teste de todos estes efeitos, fiz uma class que extende um canvas e nos vai permitir testar todos estes efeitos. No flex criem um novo projecto chamado  testAS3Effects e criem uma pasta dentro da vossa raiz «src» com o nome «com» e dentro dessa uma outra com o nome «msdevstudio», depois criem uma nova class action script e coloquem o seguinte código dentro desse mesmo ficheiro…(…)
Leia o resto de Tutorial Action Script 3 – 018 (137 palavras)

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
Sem comentarios |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias: Air, animações, as3, classes, efeitos, Flash, Flex, Tutoriais, Tutorial, tween

Em continuação a série de tutoriais sobre AS3…

No ultimo tutorial falamos um pouco sobre efeitos, filtros movimentos, vamos nesta parte mostrar alguns exemplos dos mesmos efeitos, repetições, funçoes de animação, efeitos paralelos e sequenciais. Fade, Blur, Glow… Começando…

6.4. Efeitos, Exemplos e Easing Functions

Com estas funções e a com a ajuda de um eventListner podemos fazer um efeito bem agradavel de uma imagem a saltar infinitamente… vejam o código:

Esta função (customJump) fará com que a imagem esteja a fazer um efeito de salto repetivamente, o que não passa de movimentos repetidos +-5px na vertical.
Muito simples e com um aspecto bem agradável.

Dentro do package mx.effects encontram a class easing, que nada mais nada menos nos disponibiliza algumas funções de animação que introduzem efeitos durante a animação, vulgarmente chamadas easing Functions que podem ser adicionadas a qualquer elemento explicado em cima.

Se escreverem mx.effects.easing. Aparecer-vos-á uma lista das funções easing, funções estas que podem ser introduzidas nos nossos efeitos, utilizando o parametro .easingFunction como vou passar a explicar a seguir num exemplo que vai simular a queda de uma imagem(…)
Leia o resto de Tutorial Action Script 3 – 017 (1,213 palavras)

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
Sem comentarios |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias: Air, animação, animation, as3, blur, easing, effects, Flex, glow, move, parallel, sequencial, Tutorial

Um titulo carismático, mas é a pura verdade… para os menos preparados e com menos conhecimentos do flex e da sua estrutura, esta mudança vai ser muito dificil, não só pela completa remodelação da arquitectura da interface, mas sim pelas enumeras diferenças e implantações nesta nova versão.

Já à muito tempo que o flex andava nas bocas do publico e nas mãos dos mais curiosos, inclusive nas minhas, mas como tantos outros utilizadores da frameworks e IDE não quiz na altura do seu primeiro lançamento beta aprofundar muito nesta nesse nova versão porque o tempo de aprendizagem seria bem elevado, mas como tudo tem um tempo, eis que a Adobe acaba de distribuir a versão final do Flash Builder 4 e do Flex SDK 4, que alem de contar com muitas novidades, uma ótima noticia é que os componentes de apresentação grafica são agora parte do SDK como open source, ou seja, jápodemos usar graficos para apresentar visualmente os nossos dados sem ter que recorrer a bibliotecas terceiras.

Esta nova versão conta com muitas novidades, segue um pequeno resumo vindo da propria pagina no produto.

• Novas ferramente de apoio à escrita de código, melhor acesso à documentação da class e compoennte, melhor tabulação e identificação/coloração visual do código.
• Um completo novo aspecto visual, não deixando de lado os antigos componentes mx, mas assumindo já os novos “cores” visuais. Fx, spark…
• Acesso a dados, muito rapido, simples e com wizards para grande parte das linguagens backend mais populares.
• Melhoramentos a nivel de graficos, inter-agir com dados e graficos é simplesmente facil.
• Skins, styles, e temas. Agora é mais facil do que nunca implementar um tema no nosso projecto.
• Rapida integração com a Suite grafica  da adobe, Photoshop, illustrator, fireworks ou com o novo Flash Catalyst.
• Reaproveitamento do código foi agora mais amplamente implementado e é possivel re-utilizar quase todo o nosso código ou funções muito facilmente com alguns novos assistentes.
• Novos utilitarios de teste e monitoramenteo de trafego entre aplicações. (Premium)
• Nova e melhorada documentação as3 e MXML. Os compoentarios à class ou componentes são agora apresentados durante a  escrita do nosso código, facilitando a compreensão da class ou componente.
• Novos wizards automaticos e geradores de código.
• As novidades no SDk são muitas, e longe de serem facilmente entendidas, mas isso… vamos com calma

Podem ver um artigo que fiz à alguns tempos com uma analise mais em promenor a algumas das novidades desta versão aqui. Vai ajudar bastante com certeza.

Esta nova versão vai deixar muitos dos “programadores” Flex de rastos, porque existem muitas novidades, mas acreditem que para os “agarrados” ao Flex Builder, esta nova versão caiu do ceu porque vai simplificar muitaaaaaaaaa coisa….

Dêm uma vista de olhos! Que eu vou começar a pensar seriamente em adaptar-me já!!

Download do Flash Builder aqui e do SDK4 aqui.

Uma novidade em grande nao??

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
Sem comentarios |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias: artigo, as3, builder 4, Flash, flash builder, Flex, novidades

Bom, depois de alguns dias a fazer uns testes, finalmente consegui compilar alguns dos componentes que usei em alguns projectos e outros que ainda nem sequer usei, que foram criados à poucos dias. Trata-se de um conjunto de componentes visuais que estendem alguns dos componentes nativos do Flex, aqui podemos descobrir que não há limite para a extensão de componentes…

Não vou falar muito mais, apenas deixo a preview: (cliquem para ver e inter-agir com os componentes).

Estes componentes ainda não vão ser distribuidos, e provavelmente não serão código aberto, mas se os pedidos forem muitos quem sabe não sai um swf’zito para voces!

Englobam:

• Password meter, verifica se a password é considerada fraca e violavel em 2 modos, normal e paranoid
• Password input fields, 2 campos para entrada e  confirmação de password com meter e deteção automatica de passwords diferentes
• Date entry, campo de entrada de data
• Time entry, campo de entrada de hora
• Clean field, campo que permite ser apagado com um clique.
• Editable Text, text-area editavel em tempo real.
• Tooltip, um manager e devidas tooltips, permite tooltips com varias linhas e deireções em qualquer componente visual.
• Pop Window, uma janela pop que pode ser usada em qualquer situação e dimensões.
• TextInput, permite ser usado como normal, ser usado para verificação on Focus
• TextInput extendido para informações de erro, info, obrigatório, etc. Enumeras possibilidades.
• Varias opções de visibilidade. Icons incluidos.

Que acharam? encontraram algum bug??

Abraço!

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
Um comentario |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias: as3, components, date, flcustom, Flex, password verification, popup, time, web 2

Um dos serviços do qual pouco se ouviu falar, mas que no entanto pode-se tornar muito util… principalmento porque  muitas das melhores alternativas viraram comerciais.

Ja se chamou Cocomo, Adobe Flash Collaboration Services e agora LiveCycle Collaboration Service. O sistema é simples para o usuário final. Trata-se de uma “Sala” virtual que pode ser acedida por qualquer aplicação feita no Flex para que uma ou mais pessoas possam participar ativamente quer num chat, numa apresentação, partilhar documentos, webcam, um dashboard personalizado ou até um componente flex e muito mais…. infelismente ainda não possuir Partilha de ecrã… Esse serviço ainda está em poder absoluto da adobe.

O sistema parece tratar-se de um servidor FMS + LiveCycle e conta com uma administração Online. Apesar de não ser completamente gratuito ele permite o uso total do sistema segundo cotas mensais, mensalmente possuimos gratuitamente $US15 que podemos gastar em “transferencias / dados / lagura de banda” e que podem seer geridos nesta mesma conta. A conta permite a criação de salas e o acesso via connectnow para o public geral.

Para os desenvolvedores, basta acederem ao portal, registarem uma conta ou usarem a vossa conta da adobe no serviço, depois basta fazer o download do SDK (Explorer). Este SDK Explorer é uma aplicação AIR que vos apresenta passo a passo toda a informação necessária para usarem o serviço. Podem encontrar exemplos, as informações de como instalar o sdk no flex builder, videos, swc’s, um gestor de salas, permissoes e dados e mto mais…

Segue o esquema do seu funcionamento e um pequeno exemplo…(…)
Leia o resto de LCCS – Collaboration Services. (94 palavras)

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
Sem comentarios |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias: collaboration, Flash, Flex, fms, liveCycle, services, web cam chat

Em continuação a série de tutoriais sobre AS3…

No ultimo tutorial terminamos com um painel personalizado e com a aplicação dos estudos sobre a estrutura das classes. Vamos passar a um novo ponto do actionscript, ponto em que vamos falar de efeitos e animações.. segue então a continuação…

6. Efeitos e Filtros

Como vimos anteriormente foram utulizados alguns efeitos (resize, move e parallel) que fizerem com que o nosso painel aumenta-se de tamanho e se coloca-se na devida posição indicada pelo move.

O AS3 do Flash traz algumas funções de animação (tween) mas são um pouco limitadas, mas aqui vou falar das funções de animação do AS3 no Flex, bem como alguns efeitos e também como criar a nossa propria função de animação e criar efeitos paralelos e sequenciais.

Começando pelos mais simples, um simples efeito de movimento feito programaticamente sem recurso aos efeitos nativos do flex..

6.1. Move – Movimento

Pretende-se movimentar uma imagem no ‘eixo dos xx’ desde x=0 até x=100, para isso facilmente conseguiria-mos perceber o seguinte código (…)
Leia o resto de Tutorial Action Script 3 – 016 (687 palavras)

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
Sem comentarios |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias:

O Squiggly apresenta-se como um conjunto de librarias para inserção em projetos AIR ou Flex que permite adicionar um corretor ortográfico a uma area de texto ou até mesmo ao RichTextEditor do flex.

Deste pacote disponivel para download no adobe labs apenas temos que colocar os ficheiros  AdobeSpellingEngine.swc e AdobeSpellingUI.swc na pasta libs do nosso projeto flex ou air e ficamos com um conjunto de ferramentas que permitem corrigir os nossos textos. Este componente permite também a propriedade de “adicionar ao dicionário” fazendo dele também um verificador ortográfico inteligente.

O download pode ser feito aqui. Dentro do arquivo encontram alguns exemplos, um dicionário em inglês e um pequeno aplicativo AIR para criar os dicionarios, eles necessitam de uma origem em texto puro com apenas 1 palavra por linha, e isto sim foi duro de encontrar…Infelismente nao existem dicionarios para este sistema em outras linguas disponibilizados pela adobe e foi então que me dei ao trabalho de os fazer, e acreditem que não foi nada facil. Os dicionarios que em baixo vou disponibilizar são baseados nos corretores ortográficos do Mozilla Thunderbird, também nos dicionarios ispell/myspell do debian linux e ainda em algumas wordlists que encontrei pela internet, pelo que devem estar bem completos, mas por via das duvidas, se encontrarem uma melhor base me informem. O seu formato é binário e é recomendado usar essa extensão .ZWL.

Os dicionarios que compilei são:

Portuguese PT (portugues_PT.zwl), Portuguese BR (portugues_BR.zwl), English US (english_us.zwl), English GB (english_gb.zwl), Spanish (espanhol.zwl), French (french.zwl), German (german.zwl), e Italien (italien.zwl).

Pode ver uma demonstração do sistema em acção com suporte a estas 8 linguas bem como encontrar o download dos dicionários aqui.

Abraço.

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
Um comentario |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias: Adobe, Air, corretor, dicionários, dictionaries for squiggly, engine, Flex, ortografico, spell check, squiggly, zwl files

Bom, não era novidade que o AIR já permitia comunicação por sockets, mas a verdadeira novidade na versão 2.0 é que agora permite escutar também uma porta da nossa maquina para comunicações… Mas em que se traduz isto na realidade?? Fácil! A partir de agora podemos criar os nossos pequenos/médios servidores socket, que com algum trabalho até podemos criar um servidor web… claro que é um exagero, mas abre um mundo novo de possibilidades….

Então, a partir de agora as nossas aplicações passam também a poder ser servidores, quer de comunicação de dados ou até mesmo armazenamento… imaginem, podemos criar uma base de dados na nossa maquina, usando SQLLite, e expor os seus dados ao exterior usando funções locais isto através de uma qualquer porta…

Isto não era qualquer novidade nos aplicativos desktop, mas trazendo esta nova funcionalidade os aplicativos AIR passam a poder ser usados para qualquer comunicação de dados permitindo mesmo que duas aplicações AIR em diferentes maquinas possam comunicar entre si sem qualquer necessidade de aplicações/bases de dados/back-ends terceiros… claro que teriam que ter conhecimento do ip de cada uma das maquinas, mas isso com um IP fixo resolve-se rapidamente.

Decidi explorar esta nova funcionalidade, e a primeira prova de fogo foi logo para um projecto de um cliente, que consistia no desenvolvimento de um servidor que recebe-se dados de vários dispositivos através de uma porta, que grava-se esses dados numa base de dados e que envia-se uma resposta a cada dispositivo, dependendo do tipo de dados… Os dispositivos podem ser apenas 2 como 50, pelo que era uma verdadeira prova de fogo para o AIR e sua atípica gestão de memória já que o sistema receberia algumas dezenas de pedidos por minuto. Depois de dar uma vista de olhos às classes socket, percebi que era muito mais fácil  do que eu imaginava, o servidor foi feito com recurso a cerca de 50 linhas de código, tudo ficou a funcionar…. restava o teste em tempo real com os tais dispositivos….

Inicialmente apenas com 2 demonstrou ser rápido e eficaz, mas e com 20/30 dispositivos a enviar dados… foi entregue o projecto ao cliente para testes, depois de 1 semana e de mais de 40.000 ligações (apenas entradas, se contar as saídas serão 80.000) os gasto0s de memória mantiveram-se entre os 20 e 50 mb não ultrapassando este valor, e o sistema não encontrou qualquer falha, erro ou situações desconhecidas… Resumindo, sem muito tempo gasto, o AIR passou a ser o substituto de um sistema existente feito em delphi, e mantêm-se a correr quase à 2 meses 24/24h sem qualquer problema….

Os meus parabéns à adobe que realmente fez um excelente trabalho!! Agora segue a dica, como criar um servidor socket? facil… o mais complicado talvez seja instalar o SDK 2 beta para desenvolvimento, mas isso vocês descobrem facilmente nas release notes…

Segue então uma explicação de como fazer o seu servidor socket em menos de 5 minutos…(…)
Leia o resto de Air 2.0 Beta, Servidor socket em 5 minutos! (200 palavras)

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
Um comentario |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias: Air, air 2.0 beta, as3, Beta, server, servidor, socket

Em continuação a série de tutoriais sobre AS3…

Hoje vou falar pouco sobre novidades, mas vou apenas apresentar um exemplo pratico de como criar um painel personalizado usando apenas action script  3 e todos os conceitos que aprendemos até agora…

5.4. Classes, Exemplo Painel personalizado

Vamos a um exemplo prático, usando o flex o meu objectivo é fazer o seguinte:

Criar um painel personalizado que permita:

–    ser arrastado (drag & drop) na nossa aplicação
–    ter botões de maximizar, minimizar e restaurar
–    Adicionar efeitos de maximizar, minimizar e restaurar.

Vamos aplicar todos os conhecimentos adquiridos anteriormente bem como a utilização de algumas classes nativas de efeitos disponiveis no flex como efeitos que mais à frente falaremos. Este exemplo apenas funcionará no Flex, visto que o AS3 do flash ainda não suporta alguns pontos e classes de efeitos que foram adicionadas no Flex.

Vejam o seguinte código que foi devidamente comentado para perceberem facilmente toda a sua estrutura.(…)
Leia o resto de Tutorial Action Script 3 – 015 (2,458 palavras)

© Mário Santos em TSW – That Should Work, 2010. |
Link Permanente |
2 comentarios |
Adicionar ao
del.icio.us -
Stumble it -
Google Bookmark -
technorati


Mais artigos relacionados nas categorias: as3, custom, Flex, painel, Tutorial, window