Conhecendo o Adobe Flex 2

658 visualizações

Publicada em

Apresentação sobre o Adobe Flex.

Publicada em: Tecnologia
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Conhecendo o Adobe Flex 2

  1. 1. Rich Internet Applications Conhecendo o Adobe Flex 2
  2. 2. Quem? <ul><li>Maurício Linhares </li></ul><ul><ul><li>Phoebus Tecnologia </li></ul></ul><ul><ul><li>Synapse Tech </li></ul></ul><ul><ul><li>PBJUG </li></ul></ul><ul><ul><li>guj.com.br </li></ul></ul><ul><li>Contato </li></ul><ul><ul><li>[email_address] </li></ul></ul><ul><ul><li>http://maujr.org/ </li></ul></ul>
  3. 3. Quais são as palavras da moda hoje?
  4. 4. RIA - AJAX <ul><li>RIA – Rich Internet Applictions </li></ul><ul><li>AJAX – Assynchronous JavaScript & XML </li></ul>
  5. 5. “RIA” de quê? <ul><li>Aplicações complexas, com interfaces de extrema interatividade; </li></ul><ul><li>Normalmente executando em cima de um ambiente de execução específico (plugin de navegador); </li></ul>
  6. 6. Exemplos mais comuns <ul><li>Flash </li></ul><ul><ul><li>Lazslo </li></ul></ul><ul><ul><li>Adobe Flex </li></ul></ul><ul><li>Applets Java (dinossauros?) </li></ul><ul><li>AJAX </li></ul><ul><ul><li>Scriptaculous </li></ul></ul><ul><ul><li>DOJO </li></ul></ul><ul><ul><li>... </li></ul></ul>
  7. 7. Mas e aí? O que é que é isso? <ul><li>Ambiente para desenvolvimento de aplicações RIA usando Flash; </li></ul><ul><li>Plugin disponível para a maioria dos sistemas operacionais (será?) e navegadores; </li></ul><ul><li>SDK gratuito, mas ferramentas e IDE são pagos; </li></ul>
  8. 8. Vantagens? <ul><li>Alguém aí não tem o Flash instalado? </li></ul><ul><li>Faz acesso a serviços externos via HTTP (comum, REST e Web Services) e Sockets puros; </li></ul>
  9. 9. Vantagens? <ul><li>Interface padrão muito bem definida (perfeito para programadores que não tem a mínima noção de design); </li></ul><ul><li>Muita, mas muita, muita documentação mesmo (toda em inglês, claro); </li></ul>
  10. 10. Nada e perfeito né meu filho... <ul><li>SDK fechado e sem previsões de liberação como software livre; </li></ul><ul><li>Ferramenta de geração de relatórios e gráficos também é paga; </li></ul><ul><li>Muito recente para ter formado uma comunidade de desenvolvimento; </li></ul>
  11. 11. Bora dar uma olhada no bixo <ul><li>http://examples.adobe.com/flex2/inproduct/sdk/flexstore/flexstore.html </li></ul>
  12. 12. Mas e a Concorrência? <ul><li>O Laszlo só tem como vantagem ser software livre... </li></ul><ul><li>A Microsoft está liberando a ferramenta que pretende concorrer com isso, o Windows Presentation Foundation (antes tarde do que nunca...); </li></ul>
  13. 13. O que é que ele usa? <ul><li>ActionScript 3.0 </li></ul><ul><li>Flash 9 </li></ul>
  14. 14. Cadê o código?
  15. 15. Tá aqui! <ul><li><?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?> </li></ul><ul><li><mx:Application xmlns:mx= http://www.adobe.com/2006/mxml </li></ul><ul><li>layout=&quot;absolute&quot;> </li></ul><ul><li><mx:Panel </li></ul><ul><li>title=&quot;My Application&quot; </li></ul><ul><li>width=&quot;200&quot; </li></ul><ul><li>height=&quot;300&quot;> </li></ul><ul><li><mx:Label </li></ul><ul><li>text=&quot;Welcome to Flex!&quot; mouseDownEffect=&quot;WipeRight&quot;/> </li></ul><ul><li></mx:Panel> </li></ul><ul><li></mx:Application> </li></ul>
  16. 16. Como é? <ul><li>Mais outro arquivo XML (tá contando aí quantos são?); </li></ul><ul><li>Define-se os componentes iniciais da interface e seus serviços; </li></ul><ul><li>Implementam-se scripts que acessam e fazem outros serviços; </li></ul>
  17. 17. O que é que se faz com isso? <ul><li>O arquivo salvo (sempre com a extensão “.mxml”) é compilado para um arquivo SWF; </li></ul><ul><li>O arquivo SWT pode ser então carregado num navegador comum que tenha o plugin do Flash; </li></ul>
  18. 18. Fazendo uma animação <ul><li><? xml version = &quot;1.0&quot; encoding = &quot;utf-8&quot; ?> </li></ul><ul><li>< mx:Application xmlns:mx = &quot;http://www.adobe.com/2006/mxml&quot; layout = &quot;absolute&quot; > </li></ul><ul><li>< mx:Glow </li></ul><ul><li>id = &quot;buttonGlow&quot; color = &quot;0x99FF66“ alphaFrom = &quot;1.0&quot; </li></ul><ul><li>alphaTo = &quot;0.3“ duration = &quot;1500&quot; /> </li></ul><ul><li>< mx:Panel </li></ul><ul><li>x = &quot;10&quot; y = &quot;10&quot; width = &quot;200&quot; height = &quot;300&quot; </li></ul><ul><li>layout = &quot;absolute&quot; > </li></ul><ul><li>< mx:Button </li></ul><ul><li>x = &quot;40&quot; y = &quot;60&quot; label = &quot;View&quot; id = &quot;myButton&quot; </li></ul><ul><li>mouseUpEffect = &quot;{buttonGlow}&quot; </li></ul><ul><li>click = &quot;BlurMoveShow.play(); </li></ul><ul><li>myLabel.visible=true;&quot; /> </li></ul><ul><li>< mx:Label x = &quot;40&quot; y = &quot;100&quot; text = &quot;4 8 15 16 23 42&quot; id = &quot;myLabel&quot; visible = &quot;false&quot; /> </li></ul><ul><li></ mx:Panel > </li></ul><ul><li></ mx:Application > </li></ul>
  19. 19. Exemplo <ul><li>Lendo o RSS de um Blog </li></ul>
  20. 20. Preste atenção!
  21. 21. Exemplo <ul><li>Acessando um Web Service REST na Amazon </li></ul>
  22. 22. Dúvidas?
  23. 23. Mais informações <ul><li>REST-> http://en.wikipedia.org/wiki/Representational_State_Transfer </li></ul><ul><li>Flex 2 -> http://www.adobe.com/products/flex/ </li></ul><ul><li>Laszlo -> http://www.openlaszlo.org/ </li></ul>
  24. 24. E agora? <ul><li>Programar; </li></ul><ul><li>Mostrar pro cliente; </li></ul><ul><li>Ver o cliente babar; </li></ul><ul><li>Vender o produto pro cliente; </li></ul><ul><li>Botar a mão na grana do cliente ( porque quem tem usuário é traficante ); </li></ul>
  25. 25. Então...

×