logo
  • Home
  • Acerca
  • Autores
  • Faq
  • Rede
  Twitter   Feed-me! RSS!
Mar 8

TUTORIAL JAVA + FLEX + IREPORT NA PRÁTICA (10)

Escrito por Janderson Cardoso em código fonte Flex, Código Fonte java, Flex, Java, pratica java flex, pronunciamento, Ria’s Geral, Swiz Framework, TUTORIAL FLEX, TUTORIAL JAVA @ 03 8th, 2010 | via http://www.jandersonfc.com/ | Sem comentários
Janderson Cardoso
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »


 TUTORIAL JAVA + FLEX + IREPORT NA PRÁTICA (10)

Olá galera, aqui estou eu mais uma vez para passar um conteúdo para vocês que acredito ser de grande ajuda para quem tem que fazer relatórios com java + flex…

Desde de agosto de 2009 tenho trabalhado intensamente com relatórios, na verdade criei um gerador de relatório em flex que assim como  ireport gera um xml válido para o JasperReport, então acredito ter muito a ensinar para vocês e espero que hoje seja só o começo desse assunto por aqui ;)

Tenho recebido muitos emails pedindo “como trabalhar com relatórios java+flex” e ultimamente depois que comentei que iria falar sobre o assunto a cobrança aumentou, e como estou em fase de mudança e sem tempo para escrever um post grande cheio de explicações resolvi criar o meu primeiro screencast para mostrar o que fiz, assim acho que é mais rápido e compreensível, então aí vai o screencast, espero que gostem e me perdoem por falta de experiência com screencast, no mais bons estudos ;)

espero o feedback de vcs ;)

Caso queira o projeto java é só baixar aqui.(com as libs incusive as do ireport).

Caso queira o projeto flex é só baixar aqui.

as libs necessárias do ireport ficam localizadas:

local instalado o ireport ( ex: C:Arquivos de programasJaspersoftiReport-3.7.1 ) + ireportmodulesext

dentro dessa pastas os arquivos .jar

commons-digester-1.7.jar, groovy-all-1.5.5.jar, iText-2.1.0.jar, jasperreports-3.7.1.jar, jasperreports-chart-themes-3.6.2.jar, jasperreports-extensions-3.5.3.jar, jasperreports-fonts-3.6.1.jar.

Cumps.

  • Share this on del.icio.us
  • Digg this!
  • Share this on Reddit
  • Share this on Technorati
  • Share this on Facebook
  • Tweet This!
  • Subscribe to the comments for this post?
  • Share this on FriendFeed
  • Send this page to Print Friendly

Similar Posts:

  • TUTORIAL JAVA + FLEX NA PRÁTICA (9) – Atualizando o Swiz
  • TUTORIAL JAVA + FLEX NA PRÁTICA (8) – Datas
  • criar um Gerador de Relatório
  • TUTORIAL JAVA + FLEX NA PRÁTICA 6/6
  • Bem Vindo a SaberProgramar.com

 TUTORIAL JAVA + FLEX + IREPORT NA PRÁTICA (10)

Jan 26

TUTORIAL JAVA + FLEX NA PRÁTICA (9) – Atualizando o Swiz

Escrito por Janderson Cardoso em #JAVA + FLEX NA PRÀTICA, Action Script 3.0, Adobe Flex, código fonte Flex, Código Fonte java, Dicas, mvc, pratica java flex, Ria’s Geral, Swiz Framework, TUTORIAL FLEX, TUTORIAL JAVA @ 01 26th, 2010 | via http://www.jandersonfc.com/ | 3 comentários
Janderson Cardoso
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

 TUTORIAL JAVA + FLEX NA PRÁTICA (9)   Atualizando o Swiz

Outra dúvida muito solicitada por email pela galera é a respeito da atualização do swiz, quando atualiza o framework logo de kara dá erro,confesso que esse tempo todo não trabalhei com projetos usando o swiz, só quando fiz esse Tutorial, e também por falta de tempo, não atualizei o framework, mas esse final de semana para minha surpresa tentei migrar e foi super tranquilo, então vou passar a dica para vocês agora.

Esse artigo é continuação do

TUTORIAL JAVA + FLEX NA PRÁTICA 1/6

TUTORIAL JAVA + FLEX NA PRÁTICA 2/6

TUTORIAL JAVA + FLEX NA PRÁTICA 3/6

TUTORIAL JAVA + FLEX NA PRÁTICA 4/6

TUTORIAL JAVA + FLEX NA PRÁTICA 5/6

TUTORIAL JAVA + FLEX NA PRÁTICA 6/6

TUTORIAL JAVA + FLEX NA PRÁTICA 7/6 – Bônus

TUTORIAL JAVA + FLEX NA PRÁTICA 8 – Datas

Caso queira o projeto java é só baixar aqui (sem as libs).

Caso queira o projeto java é só baixar aqui.(com as libs).

Caso queira o projeto flex é só baixar aqui.

ATUALIZANDO O SWIZ FRAMEWORK

Primeira coisa que vamos fazer é baixar a última versão stable e atualmente (25/01/2009) é a swiz-0.6.4-flex3.swz. Digo isso porque vi no site da swiz que existe a versão alpha 1.0 do framework, esse sim pelo que vi terá algumas novidades notável, como metadata personalizado, estou migrando para essa versão 0.6.4 e quando lançar a 1.0 atualizo vocês por aqui no blog ;) . vamos ao que interessa .

  1. se ainda não baixou baixe o swiz-0.6.4-flex3.swz.
  2. na pasta libs do nosso projeto flex (CrudFlex) retiramos a antiga lib (swiz-0.0.5-010609.swc) e adicionamos a nova 0.6.4.

depois de ter feito isso vai dar erro na nossa models.delegates, isso porque a classe AbstractDelegate foi retirada do framework do swiz, basta retirar o extends AbstractDelegate que nossa classe voltará a funcionar, se vc tentar rodar agora já vai funcionar, blz.. espero que tenha ajudado muita gente.

Tô brincando galera… já que é para atualizar vamos atualizar direito..hehe assim funciona mais não está de acordo com a documentação do Swiz.

Próximo passo nosso será criar o nosso SwizConfig, no nosso projeto na index.mxml temos um preinitialize que invocava a funcção que iniciava o Swiz, agora temos o Swiz config que substitui essa antiga configuração, então nosso index.mxml era assim:

PLAIN TEXT
XML:

  1. <?xml version=“1.0″ encoding=“utf-8″?>
  2. <mx:Application xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute”
  3.     preinitialize=“{iniciar(event)}”>
  4.    
  5.     <mx:Script>
  6.         <![CDATA[
  7.             import com.saberprogramar.views.CidadeView;
  8.             import com.saberprogramar.views.EstadoView;
  9.             import mx.managers.PopUpManager;
  10.             import org.swizframework.Swiz;     
  11.             import mx.events.FlexEvent;   
  12.            
  13.             private function iniciar(event:FlexEvent):void{    
  14.                 Swiz.setStrict(false).loadBeans( [Beans] );           
  15.             }
  16.            
  17.             private function chamarCidadeView():void{
  18.                 PopUpManager.createPopUp(this,CidadeView,false);
  19.             }
  20.            
  21.             private function chamarEstadoView():void{
  22.                 PopUpManager.createPopUp(this,EstadoView,false);
  23.             }
  24.            
  25.         ]]>
  26.     </mx:Script>
  27.     <mx:Button x=“10″ y=“22″ label=“Estado” height=“52″ width=“88″ click=“{chamarEstadoView()}”/>
  28.     <mx:Button x=“10″ y=“93″ label=“Cidade” width=“88″ height=“54″ click=“{chamarCidadeView()}”/>
  29.    
  30.    
  31. </mx:Application>

ficou agora assim:

PLAIN TEXT
XML:

  1. <?xml version=“1.0″ encoding=“utf-8″?>
  2. <mx:Application xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute”
  3.     xmlns:swiz=“http://swiz.swizframework.org”>
  4.    
  5.     <mx:Script>
  6.         <![CDATA[
  7.             import mx.logging.LogEventLevel;
  8.             import com.saberprogramar.views.CidadeView;
  9.             import com.saberprogramar.views.EstadoView;
  10.             import mx.managers.PopUpManager;
  11.             import org.swizframework.Swiz;     
  12.             import mx.events.FlexEvent;   
  13.                                    
  14.             private function chamarCidadeView():void{
  15.                 PopUpManager.createPopUp(this,CidadeView,false);
  16.             }
  17.            
  18.             private function chamarEstadoView():void{
  19.                 PopUpManager.createPopUp(this,EstadoView,false);
  20.             }
  21.            
  22.         ]]>
  23.     </mx:Script>
  24.    
  25.     <swiz:SwizConfig
  26.         strict=“true”
  27.         eventPackages=“com.saberprogramar.events”
  28.         mediateBubbledEvents=“true”
  29.         viewPackages=“com.saberprogramar.views”
  30.         beanLoaders=“{[Beans]}”  
  31.         logEventLevel=“{LogEventLevel.WARN}”
  32.     />
  33.    
  34.     <mx:Button x=“10″ y=“22″ label=“Estado” height=“52″ width=“88″ click=“{chamarEstadoView()}”/>
  35.     <mx:Button x=“10″ y=“93″ label=“Cidade” width=“88″ height=“54″ click=“{chamarCidadeView()}”/>
  36.        
  37. </mx:Application>

tá, mas se funcionava antes porque vou fazer isso? explico, está vendo esse viewPackages e eventPackeges, isso é muito importante para usar uma nova Metadata do Swiz, o mediate, tinha na versão anterior mas não era interessante como agora , já que agora conseguimos passar para o nosso Mediate nosso Evento customizado, tudo isso graças a esse atributo eventPackeges. Além disso na 1.0 esse arquivo vai ser mantido pelo que vi, então você estará mais próximo para atualizar quando o mesmo for lançado.

USANDO O MEDIATE

Mas afinal o que é esse Mediate? o Mediate é uma Metadata, assim como usamos o Autowire, que serve para não precisar ficar adicionando escuta de eventos, vamos explicar na prática… vá em “views.action.CidadeAction” na função init temos duas escuta de evento

PLAIN TEXT
ACTIONSCRIPT:

  1. Swiz.addEventListener(CidadeEvent.SAVE,onSaveComplete);
  2.     Swiz.addEventListener(CidadeEvent.REMOVE,onRemoveComplete);

não precisamos fazer mais isso, pode apagar.. agora vá na função onSaveComplete e coloque o Mediate

PLAIN TEXT
ACTIONSCRIPT:

  1. [Mediate(event=“CidadeEvent.SAVE”)]
  2. public function onSaveComplete(event:CidadeEvent):void{ 
  3.     stack.selectedChild = canvasDefault;
  4.     findAll();
  5. }

o mesmo no onRemoveComplete

PLAIN TEXT
ACTIONSCRIPT:

  1. [Mediate(event=“CidadeEvent.REMOVE”)]
  2. public function onRemoveComplete(event:CidadeEvent):void{
  3.     stack.selectedChild = canvasDefault;
  4.     findAll();
  5. }

e como as duas funções fazem a mesma coisa podemos também utilizar de uma apenas assim:

PLAIN TEXT
ACTIONSCRIPT:

  1. [Mediate(event=“CidadeEvent.SAVE”)]
  2. [Mediate(event=“CidadeEvent.REMOVE”)]
  3. public function onSaveComplete(event:CidadeEvent):void{ 
  4.     stack.selectedChild = canvasDefault;
  5.     findAll();
  6. }

só observe que foi necessário modificar o “modificador de acesso” para public, caso contrário não funciona.

Agora sim é isso galera, o swiz está por enquanto atualizado, vi alguns exemplos na internet usando coisas que nunca vi no swiz(Documentação) por isso me retive e mostrei baseado na documentação… seguindo os passos do mesmo..(Os delegates não são mais necessários mas já que está aí resolvi manter). Espero que te ajude e estimule a manter o framework atualizado, porque esse merece seu carinho e atenção :)

Cumps.

  • Share this on del.icio.us
  • Digg this!
  • Share this on Reddit
  • Share this on Technorati
  • Share this on Facebook
  • Tweet This!
  • Subscribe to the comments for this post?
  • Share this on FriendFeed
  • Send this page to Print Friendly

Similar Posts:

  • TUTORIAL JAVA + FLEX NA PRÁTICA 3/6
  • TUTORIAL JAVA + FLEX NA PRÁTICA 6/6
  • TUTORIAL JAVA + FLEX NA PRÁTICA 4/6
  • TUTORIAL JAVA + FLEX NA PRÁTICA 5/6
  • TUTORIAL JAVA + FLEX NA PRÁTICA 7/6 – Bônus

 TUTORIAL JAVA + FLEX NA PRÁTICA (9)   Atualizando o Swiz

Jan 25

TUTORIAL JAVA + FLEX NA PRÁTICA (8) – Datas

Escrito por Janderson Cardoso em #JAVA + FLEX NA PRÀTICA, Action Script 3.0, Adobe Flex, código fonte Flex, Código Fonte java, Componentes, Data java flex, Dicas, pratica java flex, TUTORIAL FLEX, TUTORIAL JAVA @ 01 25th, 2010 | via http://www.jandersonfc.com/ | 2 comentários
Janderson Cardoso
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

 TUTORIAL JAVA + FLEX NA PRÁTICA (8)   Datas

“O QUE È BOM TEM QUE CONTINUAR”        “O SENTIMENTO NÂO PODE PARAR”

Ano de 2010 começa e a vontade de ajudar a comunidade java e flex aumenta, e como podem perceber reativo hoje o Tutorial mais bombado do meu blog(JAVA + FLEX NA PRÀTICA) e os Motivos para reativar esse tutorial foi:

  • Percebi que o público do meu blog é uma galera que busca um pouco além de pequenas dicas, gostaram é de tutorial.
  • É mais fácil dar continuidade neste tutorial e mostrar algumas coisas mais avançadas ou continua de que começar outra, ter que ficar explicando d+, ter que no final ficar no básico.
  • Muitas dúvidas por email que valem um novo post para explicações, atualizações e dicas.
  • Quem sabe não sai um Ebook legal aí ,hein! ;)

Então se prepara, pegue um café que no Tutorial Java + Flex Na Prática (8) – Datas você vai aprender como trabalhar com datas usando Flex e Java (já que essa é a dúvida campeão da galera por email).

Para você que ainda não leu esses artigos para facilitar lá vai

Esse artigo é continuação do

TUTORIAL JAVA + FLEX NA PRÁTICA 1/6

TUTORIAL JAVA + FLEX NA PRÁTICA 2/6

TUTORIAL JAVA + FLEX NA PRÁTICA 3/6

TUTORIAL JAVA + FLEX NA PRÁTICA 4/6

TUTORIAL JAVA + FLEX NA PRÁTICA 5/6

TUTORIAL JAVA + FLEX NA PRÁTICA 6/6

TUTORIAL JAVA + FLEX NA PRÁTICA 7/6 – Bônus

Caso queira o projeto java é só baixar aqui (sem as libs).

Caso queira o projeto java é só baixar aqui.(com as libs).

Caso queira o projeto flex é só baixar aqui.

TRABALHANDO COM DATAS NO JAVA  + FLEX

Sim, parece simples mas causa uma dúvida na galera que começa com JAVA + FLEX, seja na parte java com qual anotação usar ou seja no flex como pegar os valores em DD/MM/YYYY e converter em YYYY/MM/DD (já que é nesse formato que se armazena data no banco) . Tem muita gente que esquece que é data, se estressa e trata como se fosse string, nada contra mas se quiser pode aproveitar esse artigo para trabalhar Data como Data… vamos começar :)

A primeira coisa que vamos fazer é acrescentar um novo atributo na nossa entidade Cidade, vamos acrescentar a data de fundação(lógico que isso é redículo mas é um exemplo, ok) e com sua anotação correta.Vamos adicionar o atributo na nossa entidade:

PLAIN TEXT
JAVA:

  1. @Temporal(TemporalType.DATE)
  2.  
  3. private Date dataFundacao;
  4.  
  5. public Date getDataFundacao() {
  6.  
  7. return dataFundacao;
  8.  
  9. }
  10.  
  11. public void setDataFundacao(Date dataFundacao) {
  12.  
  13. this.dataFundacao = dataFundacao;
  14.  
  15. }

simples não, apenas vale lembrar que o Date é o “java.util.Date” e não “java.sql.Date”, vamos agora pro flex que aqui acabou, perceberam como OO ajuda… mexemos em uma classe, o resto fica do jeito que está :)

No Flex adicionamos a atributo também na nossa entidade que é nosso clone da Cidade:

PLAIN TEXT
ACTIONSCRIPT:

  1. public var dataFundacao:Date;

Agora, vamos criar um componente customizado, na verdade vamos extender o componente data Padrão do Flex (o DateField) chamei de DateFieldpt, só um detalhe, achei esse componente na net e não vou dar créditos pois não sei quem fez, então dentro do nosso projeto vamos criar um package components e vamos adicionar esse nosso componente, vamos ao código:

PLAIN TEXT
ACTIONSCRIPT:

  1. package com.saberprogramar.components
  2.  
  3. {
  4.  
  5. import com.saberprogramar.utils.Util;
  6.  
  7. import mx.controls.DateField;
  8.  
  9. import mx.events.FlexEvent;
  10.  
  11. public class DateFieldpt extends DateField
  12.  
  13. {
  14.  
  15. private const diasNomes:Array = [“D”,“S”,“T”,“Q”,“Q”,“S”,“S”];
  16.  
  17. private const mesesNomes:Array = [“Janeiro”,“Fevereiro”,“Março”,“Abril”,“Maio”,“Junho”,“Julho”,“Agosto”,“Setembro”,“Outubro”,“Novembro”,“Dezembro”];
  18.  
  19. public function DateFieldpt() {
  20.  
  21. super();
  22.  
  23. this.width=95;
  24.  
  25. dayNames=diasNomes;
  26.  
  27. monthNames=mesesNomes;
  28.  
  29. formatString=“DD/MM/YYYY”;
  30.  
  31. restrict=“0-9″;
  32.  
  33. editable=true;
  34.  
  35. showToday=true;
  36.  
  37. text = Util.dateToString(new Date());
  38.  
  39. addEventListener(FlexEvent.VALUE_COMMIT,completar);
  40.  
  41. }
  42.  
  43. private function completar(event:FlexEvent):void {
  44.  
  45. var str:String = event.target.text as String;
  46.  
  47. if ( str.charAt(2) != “/” || str.charAt(5) != “/” ) {
  48.  
  49. var mask:String;
  50.  
  51. var dataAtual:Date = new Date();
  52.  
  53. if ( str.length == 2 ) {
  54.  
  55. mask = str.substr(0, 2) + “/” +
  56.  
  57. (dataAtual.getMonth()+1).toString() + “/” +
  58.  
  59. dataAtual.getFullYear();
  60.  
  61. event.target.text = mask;
  62.  
  63. }
  64.  
  65. else if ( str.length == 4 ) {
  66.  
  67. mask = str.substr(0, 2) + “/” + str.substr(2,2) + “/” +
  68.  
  69. dataAtual.getFullYear().toString();
  70.  
  71. event.target.text = mask;
  72.  
  73. }
  74.  
  75. else if ( str.length == 6 ) {
  76.  
  77. mask = str.substr(0, 2) + “/” + str.substr(2,2) + “/” +
  78.  
  79. str.substr(4, 4);
  80.  
  81. event.target.text = mask;
  82.  
  83. }
  84.  
  85. else if ( str.length == 8 ) {
  86.  
  87. mask = str.substr(0, 2) + “/” + str.substr(2,2) + “/” +
  88.  
  89. str.substr(4, 4);
  90.  
  91. event.target.text = mask;
  92.  
  93. }
  94.  
  95. }
  96.  
  97. }
  98.  
  99. }
  100.  
  101. }

além desse componente precisamos de uma função que converta data para string e string para data, então crie mais um package utils e crie sua classe(sugeri Util.as) com essas funções, vamos ao código:

PLAIN TEXT
ACTIONSCRIPT:

  1. package com.saberprogramar.utils
  2.  
  3. {
  4.  
  5. import mx.formatters.DateFormatter;
  6.  
  7. public class Util
  8.  
  9. {
  10.  
  11. public static function stringToDate(data:String):Date{
  12.  
  13. if (data != “”) {
  14.  
  15. var novaData:String = data.substring(3,5) +“/”+ data.substring(0,2) +“/”+ data.substring(6);
  16.  
  17. return new Date(novaData);
  18.  
  19. }
  20.  
  21. else {
  22.  
  23. return null;
  24.  
  25. }
  26.  
  27. }
  28.  
  29. public static function dateToString(data:Date):String{
  30.  
  31. var format:DateFormatter = new DateFormatter();
  32.  
  33. format.formatString = “DD/MM/YYYY”;
  34.  
  35. return format.format(data);
  36.  
  37. }
  38.  
  39. }
  40.  
  41. }

pronto, agora é moleza,adicionamos um novo campo na view que é o nosso componente customizado:

PLAIN TEXT
CODE:

  1. <mx:FormItem label=“Data Fundação:” required=“true”>
  2.                     <components:DateFieldpt id=“txtDataFundcao”
  3.                         text=“{Util.dateToString(cidade.dataFundacao)}” tabIndex=“4″ />
  4.                 </mx:FormItem>

e pra finalizar em nossa action na function confirm adicionamos isso:

PLAIN TEXT
ACTIONSCRIPT:

  1. cidade.dataFundacao = Util.stringToDate(txtDataFundcao.text);

pronto, testa aí e você vai ver que já está funcionando, mas espera aí, ainda falta uma grande dica.

O HORÀRIO DE VERÂO BRASILEIRO!

Você vai testar agora, vai ver que está funcionando, vai ficar feliz e depois de um tempo pode acontecer de ter problemas com o nosso bendito horário de verão, explico, no Brazil não temos dia certo pra começar nem para terminar o bendito horário de verão, então como o sdk do java não utiliza a informaçao do sistema operacional(Windows, Linux, Mac) e sim do prório sdk, o sdk fica perdido com o nosso horário de verão. Mas como saber que estou tendo problemas?

  • Quando você mandar gravar uma data (23/01/2010)  essa data vai retroceder um dia (22/01/2010). Putz kara, é exatamente o que está me acontecendo, como eu resolvo isso?

simples :) um POG do bem..hehe quando você manda gravar uma data como fazemos aqui a data vai com o time (00:00:00), então quando chega no java o time volta, consequentemente um dia anteior com o time (22:00:00 ou as 23:00:00), então a forma mais rápida foi setar o time para 12:00:00 e por mais que o sdk volte o time ainda será o mesmo dia :) , então na nossa classe Util na função stringToDate ficará assim:

PLAIN TEXT
ACTIONSCRIPT:

  1. public static function stringToDate(data:String):Date{
  2.  
  3. if (data != “”) {
  4.  
  5. var novaData:String = data.substring(3,5) +“/”+ data.substring(0,2) +“/”+ data.substring(6);
  6.  
  7. var dateTime:Date = new Date(novaData);
  8.  
  9. dateTime.setHours(12,0,0,0);
  10.  
  11. return dateTime;
  12.  
  13. }
  14.  
  15. else {
  16.  
  17. return null;
  18.  
  19. }
  20.  
  21. }

fica aí a dica, aguardem que vem novos artigos para este tutorial, como atualização de swiz e relatórios integrando JAVA + FEX + IREPORT, até a próxima e bons estudos.

Cumps.

  • Share this on del.icio.us
  • Digg this!
  • Share this on Reddit
  • Share this on Technorati
  • Share this on Facebook
  • Tweet This!
  • Subscribe to the comments for this post?
  • Share this on FriendFeed
  • Send this page to Print Friendly

Similar Posts:

  • Formatando e Somando Datas no Flex
  • TUTORIAL JAVA + FLEX NA PRÁTICA 5/6
  • TUTORIAL JAVA + FLEX NA PRÁTICA 6/6
  • TUTORIAL JAVA + FLEX NA PRÁTICA 1/6
  • TUTORIAL JAVA + FLEX NA PRÁTICA 7/6 – Bônus

 TUTORIAL JAVA + FLEX NA PRÁTICA (8)   Datas

Jul 20

TUTORIAL JAVA + FLEX NA PRÁTICA 7/6 – Bônus

Escrito por Janderson Cardoso em Action Script 3.0, Adobe Flex, Blazeds, código fonte Flex, Código Fonte java, DomainDriveDesign, Hibernate, hibernate Annotations, Indico a Leitura, Java, mvc, pratica java flex, Spring, SPRING ANNOTATIONS, Swiz Framework, Tutorial, TUTORIAL FLEX, TUTORIAL JAVA @ 07 20th, 2009 | via http://www.jandersonfc.com/ | Sem comentários
Janderson Cardoso
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Esse artigo é continuação do
TUTORIAL JAVA + FLEX NA PRÁTICA 1/6
TUTORIAL JAVA + FLEX NA PRÁTICA 2/6
TUTORIAL JAVA + FLEX NA PRÁTICA 3/6
TUTORIAL JAVA + FLEX NA PRÁTICA 4/6
TUTORIAL JAVA + FLEX NA PRÁTICA 5/6
TUTORIAL JAVA + FLEX NA PRÁTICA 6/6

Não definitivamente você não está delirando e nem eu esqueci conceitos simples da matemática, realmente criei mais um tutorial, a 7/6, o que estou considerando Bônus, para fazer algumas modificações e implementar algumas funcionalidades.

Antes gostaria de agradecer pela participação do pessoal, muitos entenderam o objetivo do tutorial e com certeza fizeram bom proveito, fiquei sabendo este mês de julho que alguns mudaram a forma de trabalhar com Java + flex através deste tutorial :P . Através do mesmo recebi ótimos contatos e oportunidades profissionais, porém, como sempre há alguém que quer mais e gostaria de mais um empurram, então vamos direto ao assunto que tempo é dinheiro.

Essa parte vamos tratar mais de relacionamentos entre tabelas, como tratar esses relacionamentos no Flex e como mostrar mais de um objeto no datagrid… vamos a prática.

Implementação no Java

Assim como fizemos na nossa classe Estado vamos criar nossa Classe Cidade, classe essa que fará o relacionamento mais comum e a dúvida mais comum depois que você começa a programar, vamos ao código:

Cidade.java

PLAIN TEXT
JAVA:

  1. @Entity
  2. @Table(name=“cidade”)
  3. public class Cidade {
  4.  
  5. @Id @GeneratedValue(strategy = GenerationType.AUTO)
  6. private long idCidade;
  7.  
  8. @ManyToOne(fetch = FetchType.EAGER)
  9. @JoinColumn(name=“codEstado”,insertable=true,updatable=true)
  10. @Fetch(FetchMode.JOIN)
  11. @Cascade(CascadeType.SAVE_UPDATE)
  12. private Estado estado;
  13.  
  14. private String nome;
  15.  
  16. private String sigla;
  17.  
  18. public String getSigla() {
  19. return sigla;
  20. }
  21.  
  22. public void setSigla(String sigla) {
  23. this.sigla = sigla;
  24. }
  25.  
  26. public long getIdCidade() {
  27. return idCidade;
  28. }
  29.  
  30. public void setIdCidade(long idCidade) {
  31. this.idCidade = idCidade;
  32. }
  33.  
  34. public Estado getEstado() {
  35. return estado;
  36. }
  37.  
  38. public void setEstado(Estado estado) {
  39. this.estado = estado;
  40. }
  41.  
  42. public String getNome() {
  43. return nome;
  44. }
  45.  
  46. public void setNome(String nome) {
  47. this.nome = nome;
  48. }
  49.  
  50. }

Vale comentar algumas anotações que usei aqui:

@ManyToOne(fetch = FetchType.EAGER) -> como o relacionamento é de “N para 1”, uma Cidade pertence a um Estado e o Estado pode ter várias Cidade, usamos a anotação @ManyToOne e também usamos o FethType:

EAGER -> Sempre que o Objeto pai for trazido o atributo mapeado também será trazido) cuidado ao usar pois se for relacionamentos mais complexo, ou melhor, que contém muitos objetos dentro do outro pode ficar muito lento, no nosso exemplo não temos que ser preocupar com isso.

LAZY -> Sempre que o objeto pai for trazido o atributo mapeado só será trazido quando acessado pela primeira vez(muito usado quando é List, Collection para evitar o que citei logo acima).

@JoinColumn(name=”codEstado”,insertable=true,updatable=true) -> informamos qual é o campo é a chave estrangeira, no caso da Cidade a chave estrangeira é o codEstado. O insertable e o updatable quando indicados como true significa que esse objeto tem que ser inserido ou atualizado quando o objeto pai é inserido ou atualizado, resumindo, Toda vez que for inserir e atualizar um Cidade também será inserido ou atualizado um Estado.

@Fetch(FetchMode.JOIN) -> informamos que estamos juntando as duas tabelas, melhor dizendo, como se estivesse usando o Inner Join na injeção de SQL.

@Cascade(CascadeType.SAVE_UPDATE)-> por ultimo a permissão que esse atributo pode interferir na Classe ao qual está fazendo o relaciomento. Explico, ao colocar SAVE_UPDATE se caso você esteja inserindo uma cidade e o estado ainda não foi inserido, ele automaticamente vai adicionar esse Estado, pegar o id do mesmo e gravar na tabela cidade no campo codEstado, Hibernate é Kara ;) .

Depois de explicado as anotações as outras classes que ficam no Java já foram explicadas e só serão adicionadas logo abaixo:

CidadeRepository.java

PLAIN TEXT
JAVA:

  1. public interface CidadeRepository {
  2.    
  3.     public void save(Cidade cidade);
  4.     public void remove(Cidade cidade);
  5.    
  6.     public List<Cidade> findAll();
  7.     public List<Cidade> findByName(String nome);
  8.    
  9. }

CidadeService.java

PLAIN TEXT
JAVA:

  1. @Service(value=“CidadeService”)
  2. public class CidadeService {
  3.    
  4.     CidadeRepository cidadeRepository;
  5.    
  6.     @Autowired
  7.     public void setCidadeRepository(CidadeRepository cidadeRepository) {
  8.         this.cidadeRepository = cidadeRepository;
  9.     }
  10.    
  11.     public void save(Cidade cidade){
  12.         cidadeRepository.save(cidade);
  13.     }
  14.    
  15.     public void remove(Cidade cidade){
  16.         cidadeRepository.remove(cidade);
  17.     }
  18.    
  19.     public List<Cidade> findAll(){
  20.         return cidadeRepository.findAll();
  21.     }
  22.    
  23.     public List<Cidade> findByName(String nome){
  24.         return cidadeRepository.findByName(nome);
  25.     }
  26.    
  27. }

CidadeDao.java

PLAIN TEXT
JAVA:

  1. @Repository(value=“CidadeRepository”)
  2. public class CidadeDao extends HibernateDaoSupport
  3.     implements CidadeRepository {
  4.    
  5.     @Autowired
  6.     public CidadeDao(@Qualifier(“sessionFactory”) SessionFactory sessionFactory) {
  7.         // TODO Auto-generated constructor stub
  8.         super.setSessionFactory(sessionFactory);
  9.     }
  10.  
  11.     @Override
  12.     public void remove(Cidade cidade) {
  13.         // TODO Auto-generated method stub
  14.         getHibernateTemplate().delete(cidade);
  15.     }
  16.  
  17.     @SuppressWarnings(“unchecked”)
  18.     @Override
  19.     public List<Cidade> findAll() {
  20.         // TODO Auto-generated method stub
  21.         return getHibernateTemplate().loadAll(Cidade.class);
  22.     }
  23.    
  24.     @SuppressWarnings(“unchecked”)
  25.     @Override
  26.     public List<Cidade> findByName(String nome) {
  27.         // TODO Auto-generated method stub
  28.         return getHibernateTemplate().find(“from Cidade” +
  29.                 ” where nome like ‘%” + nome + “%’”);
  30.     }
  31.  
  32.     @Override
  33.     public void save(Cidade cidade) {
  34.         // TODO Auto-generated method stub
  35.         getHibernateTemplate().saveOrUpdate(cidade);
  36.     }
  37.    
  38.  
  39. }

Agora é só adicionar o serviço no blazeds e ir para a parte flex.

remoting-config.xml

PLAIN TEXT
XML:

  1. <destination id=“CidadeService”>
  2.         <properties>
  3.             <factory>spring</factory>
  4.             <source>CidadeService</source>
  5.         </properties>
  6.     </destination>

OBS. Aqui já começa uma pequena discussão, se você perceber os Repository, Service e Dao de Cidade e Estado são praticamente idênticos, e muitos vão optar por trabalhar com classes Genéricas, tipo RepositoryGeneric, DaoGeneric. Nada contra, só que eu prefiro deixar separado,  se você usar genérico tome muito cuidado, uma vez tomei o genérico de novalgina e fiquei uma semana mal, acabou o genérico comprei novalgina e a dor de cabeça passou em 30 minutos, hehe.

Outra coisa aí sim eu recomendo é o seguinte, de vez de ter um Service para a cidade e outra para estado criar um tipo addresService, cuja esse serviço manipularia o estado, a cidade o bairro… enfim, tudo que tem haver com endereço, isso é normal, o service na verdade é isso, mais como nos exemplos fica tudo separado as pessoas colocam separado, então, mesmo não fazendo assim neste exemplo recomendo a todos depois fazer isso neste exemplo, considere dever de casa  :) .

Implementação no Flex

No flex a implementação é mais simples ainda, a base de ctrl+c ctrl+v, vamos ao código:

Cidade.as

PLAIN TEXT
ACTIONSCRIPT:

  1. [RemoteClass(alias=“com.saberprogramar.business.entitys.Cidade”)]
  2.     [Bindable]
  3.     public class Cidade
  4.     {
  5.        
  6.         public var idCidade:Number;
  7.        
  8.         public var estado:Estado;
  9.        
  10.         public var nome:String;
  11.        
  12.         public var sigla:String;
  13.        
  14.        
  15.  
  16.     }

A única coisa que Vale lembrar aqui é que como no Java você usa o relacionamento com a classe Estado, no Action script tem que acontecer a mesma coisa, se não você não relaciona objetos, tipo, ao invés de colocar “estado:Estado” colocar “idEstado:Number” vc não está programando orientado a objeto, você na verdade está criando classes que sejam clone das suas tabelas do banco de dados, fazendo isso você está perdendo o melhor que o mundo OO pode te oferecer. É aqui que vejo uma constante dúvida que tenho recebido por contato aqui no Blog, então aí vai:

  • Não! de maneira nenhuma deixe de fazer os relacionamentos dos seus objetos, uma cidade faz parte de um Estado e não de um código do estado, então… tanto no Java, como no Action Script, quanto no php e outra qualquer linguagem não considere seus objetos uma cópia de suas tabelas do banco de dados.
  • Se no Java você tem um atributo “Estado estado” no actionScript você vai ter um ”estado:Estado”. Quando usamos RemoteObject o action script tem que ser igual ao Java ou ao php, é um clone, não pode ter um “Estado estado” no Java e um “idEstado:Number” no Action Script, não vai funcionar e você vai ter aquela sensação, é alguma bobeira que eu não estou vendo.


CidadeDelegate.as

PLAIN TEXT
ACTIONSCRIPT:

  1. public class CidadeDelegate extends AbstractDelegate
  2.     {
  3.        
  4.         [Autowire(bean=“cidadeService”)]
  5.         public var cidadeService:RemoteObject;   
  6.        
  7.         public function CidadeDelegate()
  8.         {
  9.             super();
  10.         }      
  11.        
  12.            
  13.         //AS OPERAÇÕES CRUD
  14.         public function findAll():AsyncToken{         
  15.             return cidadeService.findAll();  
  16.         }      
  17.        
  18.         public function findByName(nome:String):AsyncToken{   
  19.             return cidadeService.findByName(nome);     
  20.         }      
  21.        
  22.         public function save(cidade:Cidade):AsyncToken{
  23.             return cidadeService.save(cidade);   
  24.         }
  25.        
  26.         public function remove(cidade:Cidade):AsyncToken{
  27.             return cidadeService.remove(cidade);           
  28.         }   
  29.        
  30.        
  31.     }

CidadeEvent.as

PLAIN TEXT
ACTIONSCRIPT:

  1. public class CidadeEvent extends Event
  2.     {      
  3.        
  4.         public static const SAVE:String = “saveCidade”;
  5.         public static const REMOVE:String = “removeCidade”;
  6.        
  7.        
  8.         public function CidadeEvent(type:String)
  9.         {
  10.             super(type);
  11.         }
  12.        
  13.        
  14.     }

ICidadeController.as

PLAIN TEXT
ACTIONSCRIPT:

  1. public interface ICidadeController
  2.     {
  3.        
  4.         function get cidadeList():ArrayCollection;
  5.        
  6.         function findAll():void;
  7.        
  8.         function findByName(nome:String):void;
  9.        
  10.         function save(cidade:Cidade):void;
  11.        
  12.         function remove(cidade:Cidade):void;        
  13.        
  14.     }

CidadeController.as

PLAIN TEXT
ACTIONSCRIPT:

  1. public class CidadeController extends AbstractController
  2.         implements ICidadeController{
  3.        
  4.         [Bindable]
  5.         public var cidadeList:ArrayCollection;
  6.        
  7.         [Autowire(bean=“cidadeDelegate”)]
  8.         public var cidadeDelegate:CidadeDelegate;
  9.        
  10.         public function CidadeController()
  11.         {
  12.             super();
  13.         }
  14.        
  15.         public function findAll():void{   
  16.             executeServiceCall(cidadeDelegate.findAll(),onFindAll,onError);   
  17.         }
  18.        
  19.         public function findByName(nome:String):void{
  20.             executeServiceCall(cidadeDelegate.findByName(nome),onFindByName,onError);
  21.         }   
  22.        
  23.         public function save(cidade:Cidade):void{
  24.             executeServiceCall(cidadeDelegate.save(cidade),onSave,onError);
  25.         }
  26.        
  27.         public function remove(cidade:Cidade):void{
  28.             executeServiceCall(cidadeDelegate.remove(cidade),onRemove,onError);
  29.         }
  30.        
  31.         //*************** Handle Results ************************//  
  32.        
  33.         public function onFindAll(event:ResultEvent):void{     
  34.             cidadeList = ArrayCollection(event.result);
  35.         }
  36.        
  37.         public function onFindByName(event:ResultEvent):void{
  38.             cidadeList = event.result as ArrayCollection;
  39.         }
  40.        
  41.         public function onSave(event:ResultEvent):void{
  42.             Swiz.dispatchEvent(new CidadeEvent(CidadeEvent.SAVE));     
  43.         }
  44.        
  45.         public function onRemove(event:ResultEvent):void{
  46.             Swiz.dispatchEvent(new CidadeEvent(CidadeEvent.REMOVE));
  47.         }      
  48.        
  49.         private function onError(event:FaultEvent):void{                               
  50.             Alert.show(event.fault.message,“ERROR”);
  51.         }
  52.        
  53.        
  54.        
  55.        
  56.     }

Adicionados estas classes é só adicionar o mapeamento dos mesmos e o RemoteObjetct no nosso Beans.mxml.

PLAIN TEXT
XML:

  1. <!– cidade service –>
  2.     <mx:RemoteObject id=“cidadeService”
  3.                      destination=“CidadeService”
  4.                      channelSet=“{myAmfChannel}”/>
  5.                     
  6.     <!– delegate for the cidade controller –>
  7.     <delegates:CidadeDelegate id=“cidadeDelegate”/>
  8.    
  9.     <!– cidade controller –>
  10.     <controllers:CidadeController id=“cidadeController”/>

Agora vamos a interface(view) com algumas explicações:

CidadeView.mxml

PLAIN TEXT
XML:

  1. <?xml version=“1.0″ encoding=“utf-8″?>
  2.  
  3. <mx:TitleWindow xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute” width=“518″ height=“422″
  4.      title=“Cadastro de Cidades” fontSize=“10″ xmlns=“flexmdi.containers.*”
  5.      xmlns:controls=“com.flexpernambuco.controls.*”
  6.      creationComplete=“{init()}” showCloseButton=“true” close=“{exit()}”>
  7.    
  8.     <mx:ViewStack x=“10″ y=“10″ id=“stack” width=“486″ height=“362″>
  9.        
  10.         <mx:Canvas label=“View 1″ width=“100%” height=“100%” id=“canvasDefault”>
  11.             <mx:Button x=“138″ y=“330″ label=“Incluir” id=“btnIncluir” click=“{save()}”/>
  12.             <mx:Button x=“209″ y=“330″ label=“Alterar” id=“btnAlterar” click=“{update()}”/>
  13.             <mx:Button x=“284″ y=“330″ label=“Excluir” id=“btnExcluir” click=“{remove()}”/>
  14.             <mx :D ataGrid x=“10″ y=“40″ width=“466″ height=“282″ dataProvider=“{controller.cidadeList}” id=“dgCidade”>
  15.                 <mx:columns>
  16.                     <mx :D ataGridColumn headerText=“ID” dataField=“idCidade” width=“70″/>
  17.                     <mx :D ataGridColumn headerText=“Nome da Cidade” dataField=“nome”/>
  18.                     <mx :D ataGridColumn headerText=“Sigla” dataField=“sigla” width=“70″/>
  19.                     <mx :D ataGridColumn headerText=“UF” labelFunction=“colEstado” width=“70″/>
  20.                 </mx:columns>
  21.             </mx :D ataGrid>
  22.             <mx:TextInput x=“273″ y=“10″ id=“txtFind”/>
  23.             <mx:Button x=“441″ y=“10″ width=“35″ icon=“@Embed(source=’com/saberprogramar/assets/images/find-16×16.png’)” id=“btnFind” click=“{find()}”/>
  24.         </mx:Canvas>
  25.        
  26.         <mx:Canvas label=“” width=“100%” height=“100%” id=“canvasForm”>
  27.             <mx:Form x=“10″ y=“67″ width=“466″ height=“146″>
  28.                 <mx:FormItem label=“ID:”>
  29.                     <mx:TextInput width=“72″ id=“txtIdCidade” editable=“false” tabIndex=“0″
  30.                         toolTip=“Código Gerado Automático” text=“{cidade.idCidade.toString()}”/>
  31.                 </mx:FormItem>
  32.                 <mx:FormItem label=“Estado” required=“true”>
  33.                     <mx:ComboBox id=“cmbEstado” dataProvider=“{controllerEstado.estadoList}”
  34.                         labelField=“nome” prompt=“Selecione um Estado” tabIndex=“1″>
  35.                     </mx:ComboBox>
  36.                 </mx:FormItem>
  37.                 <mx:FormItem label=“Nome:” required=“true”>
  38.                     <mx:TextInput width=“339″ id=“txtNome” text=“{cidade.nome}” tabIndex=“2″/>
  39.                 </mx:FormItem>
  40.                 <mx:FormItem label=“Sigla:” required=“true”>
  41.                     <mx:TextInput width=“43″ id=“txtSigla” maxChars=“2″ text=“{cidade.sigla}”   tabIndex=“3″ />
  42.                 </mx:FormItem>
  43.             </mx:Form>
  44.             <mx:FormHeading x=“157.5″ y=“21″ label=“Formulário de Estado” width=“171″/>
  45.             <mx:Button x=“160″ y=“221″ label=“Cancelar” id=“btnCancelar” click=“{cancel()}” tabIndex=“6″/>
  46.             <mx:Button x=“243″ y=“221″ label=“Confirmar” id=“btnConfirmar” click=“{confirm()}” tabIndex=“5″/>
  47.         </mx:Canvas>
  48.     </mx:ViewStack>
  49.    
  50.     <mx:Script source=“actions/CidadeAction.as”/>   
  51.    
  52. </mx:TitleWindow>

Agora vamos mostrar sua action:

CidadeAction.as

PLAIN TEXT
ACTIONSCRIPT:

  1. // ActionScript file
  2. import com.saberprogramar.controllers.ICidadeController;
  3. import com.saberprogramar.controllers.IEstadoController;
  4. import com.saberprogramar.events.CidadeEvent;
  5. import com.saberprogramar.models.entitys.Cidade;
  6. import com.saberprogramar.models.entitys.Estado;
  7.  
  8. import mx.controls.dataGridClasses.DataGridColumn;
  9. import mx.managers.PopUpManager;
  10.  
  11. import org.swizframework.Swiz;
  12.  
  13. [Bindable]
  14. private var cidade:Cidade;
  15.  
  16. [Bindable]
  17. [Autowire(bean=“estadoController”)]
  18. public var controllerEstado:IEstadoController;
  19.  
  20. [Bindable]
  21. [Autowire(bean=“cidadeController”)]
  22. public var controller:ICidadeController;
  23.  
  24. private function init():void{
  25.    
  26.     PopUpManager.centerPopUp(this);
  27.    
  28.     Swiz.addEventListener(CidadeEvent.SAVE,onSaveComplete);
  29.     Swiz.addEventListener(CidadeEvent.REMOVE,onRemoveComplete);
  30.    
  31.     findAll();
  32. }
  33.  
  34. private function findAll():void{   
  35.     controller.findAll();
  36.     controllerEstado.findAll();
  37. }
  38.  
  39. private function save():void{
  40.     cidade = new Cidade();
  41.     stack.selectedChild = canvasForm;
  42. }
  43.  
  44. private function update():void{
  45.    
  46.     if (dgCidade.selectedItem != null){
  47.        
  48.         dgCidade.setStyle(“bordercolor”,‘black’);
  49.         dgCidade.errorString = “”;
  50.        
  51.         cidade = dgCidade.selectedItem as Cidade;
  52.         stack.selectedChild = canvasForm;
  53.        
  54.     }else {
  55.         dgCidade.setStyle(“bordercolor”,‘red’);
  56.         dgCidade.errorString = “Selecione uma Cidade para alterar”;
  57.     }
  58.    
  59. }
  60.  
  61. private function remove():void{
  62.    
  63.     if (dgCidade.selectedItem != null){
  64.        
  65.         dgCidade.setStyle(“bordercolor”,‘black’);
  66.         dgCidade.errorString = “”;
  67.        
  68.         cidade = dgCidade.selectedItem as Cidade;
  69.        
  70.         controller.remove(cidade);
  71.        
  72.        
  73.     }else {
  74.         dgCidade.setStyle(“bordercolor”,‘red’);
  75.         dgCidade.errorString = “Selecione uma Cidade para excluir”;
  76.     }
  77.    
  78. }
  79.  
  80. private function confirm():void{   
  81.    
  82.     cidade.idCidade = new Number(txtIdCidade.text);
  83.     cidade.estado = cmbEstado.selectedItem as Estado;
  84.     cidade.nome = txtNome.text;
  85.     cidade.sigla = txtSigla.text;
  86.    
  87.     controller.save(cidade);   
  88.    
  89. }
  90.  
  91. private function cancel():void{
  92.     cidade = new Cidade();
  93.     stack.selectedChild = canvasDefault;
  94. }
  95.  
  96. private function find():void{
  97.    
  98.     if (txtFind.text != null){
  99.         controller.findByName(txtFind.text);   
  100.     }
  101.    
  102. }
  103.  
  104. private function onSaveComplete(event:CidadeEvent):void{   
  105.     stack.selectedChild = canvasDefault;
  106.     findAll();
  107. }
  108.  
  109. private function onRemoveComplete(event:CidadeEvent):void{
  110.     stack.selectedChild = canvasDefault;
  111.     findAll();
  112. }
  113.  
  114. private function colEstado(objCidade:Cidade, col:DataGridColumn):String{
  115.     return objCidade.estado.uf;
  116. }
  117.  
  118. private function exit():void{
  119.     PopUpManager.removePopUp(this);
  120. }

Como Pode perceber existe algumas novidades comparado ao código do estado, uma é a combo que carrega todos os estados:

PLAIN TEXT
XML:

  1. <mx:ComboBox id=“cmbEstado” dataProvider=“{controllerEstado.estadoList}”
  2.                         labelField=“nome” prompt=“Selecione um Estado” tabIndex=“1″>
  3.                     </mx:ComboBox>
  1. O DataProvider da combo é o estadoList da nossa controllerEstado.
  2. o label Field é o “nome”(atributo da classe estado).
  3. prompt é o texto inicial da combo.

A parte mais interessante neste caso é o grid, usamos a função labelFunction:

PLAIN TEXT
XML:

  1. <mx :D ataGridColumn headerText=“UF” labelFunction=“colEstado” width=“70″/>

Neste caso indicamos que o label desta coluna vem do retorno de uma função chamada colEstado:

PLAIN TEXT
ACTIONSCRIPT:

  1. private function colEstado(objCidade:Cidade, col:DataGridColumn):String{
  2.     return objCidade.estado.uf;
  3. }

Se você perceber temos uma função que espera como retorno uma String, e aqui podemos ver já uma vantagem de usar os relacionamentos de objetos de maneira correta, uma cidade contém um estado, então ao fazer o que fizemos acima conseguimos pegar qualquer atributo da nossa classe Estado e mostrar no grid sem a necessidade de fazer um FindById ou algo parecido.

Bem, é isso, atualizei o código fonte, caso queiram podem baixar nos links logo abaixo, qualquer dúvida pode entrar em contato, ou se preferir postar um comentário.

Até a Próx.

Caso queira o projeto em java é só baixar aqui (sem as libs).

Caso queira o projeto em flex é só baixar aqui.


Mai 28

TUTORIAL JAVA + FLEX NA PRÁTICA 6/6

Escrito por Janderson Cardoso em Action Script 3.0, Adobe Flex, Blazeds, código fonte Flex, Código Fonte java, Data Service, DomainDriveDesign, Frameworks, Hibernate, hibernate Annotations, Indico a Leitura, Java, mvc, pratica java flex, Spring, SPRING ANNOTATIONS, Swiz Framework, Tutorial, TUTORIAL FLEX, TUTORIAL JAVA @ 05 28th, 2009 | via http://www.jandersonfc.com/ | Sem comentários
Janderson Cardoso
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Esse artigo é continuação do
TUTORIAL JAVA + FLEX NA PRÁTICA 1/6
TUTORIAL JAVA + FLEX NA PRÁTICA 2/6
TUTORIAL JAVA + FLEX NA PRÁTICA 3/6
TUTORIAL JAVA + FLEX NA PRÁTICA 4/6
TUTORIAL JAVA + FLEX NA PRÁTICA 5/6

Na última parte do nosso tutorial vamos fazer a V(View) do nosso MVC, no caso são 2 tipos de arquivo, a interface em si e a Ação da mesma, lembrando que essa separação não é necessária, eu faço porque gosto de tudo bem dividido, isso ajuda e muito na manutenção ou até mesmo na alteração do Layout, uma vez eu já expliquei o porque disso no artigo Separando MXML do Action Script.

Para terminar com chave de ouro vamos ao código:

EstadoView.mxml

PLAIN TEXT
XML:

  1. <?xml version=“1.0″ encoding=“utf-8″?>
  2.  
  3. <mx:TitleWindow xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute” width=“518″ height=“422″
  4.      title=“Cadastro de Estados” fontSize=“10″ xmlns=“flexmdi.containers.*”
  5.      xmlns:controls=“com.flexpernambuco.controls.*”
  6.      creationComplete=“{init()}”>
  7.    
  8.     <mx:ViewStack x=“10″ y=“10″ id=“stack” width=“486″ height=“362″>
  9.        
  10.         <mx:Canvas label=“View 1″ width=“100%” height=“100%” id=“canvasDefault”>
  11.             <mx:Button x=“138″ y=“330″ label=“Incluir” id=“btnIncluir” click=“{save()}”/>
  12.             <mx:Button x=“209″ y=“330″ label=“Alterar” id=“btnAlterar” click=“{update()}”/>
  13.             <mx:Button x=“284″ y=“330″ label=“Excluir” id=“btnExcluir” click=“{remove()}”/>
  14.             <mx :D ataGrid x=“10″ y=“40″ width=“466″ height=“282″ dataProvider=“{controller.estadoList}” id=“dgEstado”>
  15.                 <mx:columns>
  16.                     <mx :D ataGridColumn headerText=“ID” dataField=“codEstado” width=“70″/>
  17.                     <mx :D ataGridColumn headerText=“Nome do Estado” dataField=“nome”/>
  18.                     <mx :D ataGridColumn headerText=“UF” dataField=“uf” width=“70″/>
  19.                 </mx:columns>
  20.             </mx :D ataGrid>
  21.             <mx:TextInput x=“273″ y=“10″ id=“txtFind”/>
  22.             <mx:Button x=“441″ y=“10″ width=“35″ icon=“@Embed(source=’com/saberprogramar/assets/images/find-16×16.png’)” id=“btnFind” click=“{find()}”/>
  23.         </mx:Canvas>
  24.        
  25.         <mx:Canvas label=“” width=“100%” height=“100%” id=“canvasForm”>
  26.             <mx:Form x=“10″ y=“67″ width=“466″ height=“131″>
  27.                 <mx:FormItem label=“ID:”>
  28.                     <mx:TextInput width=“72″ id=“txtIdEstado” editable=“false” tabIndex=“0″
  29.                         toolTip=“Código Gerado Automático” text=“{estado.idEstado.toString()}”/>
  30.                 </mx:FormItem>
  31.                 <mx:FormItem label=“Nome:” required=“true”>
  32.                     <mx:TextInput width=“339″ id=“txtNome” text=“{estado.nome}” tabIndex=“1″/>
  33.                 </mx:FormItem>
  34.                 <mx:FormItem label=“UF:” required=“true”>
  35.                     <mx:TextInput width=“43″ id=“txtUF” maxChars=“2″ text=“{estado.uf}” tabIndex=“2″ />
  36.                 </mx:FormItem>
  37.             </mx:Form>
  38.             <mx:FormHeading x=“157.5″ y=“21″ label=“Formulário de Estado” width=“171″/>
  39.             <mx:Button x=“160″ y=“206″ label=“Cancelar” id=“btnCancelar” click=“{cancel()}” tabIndex=“5″/>
  40.             <mx:Button x=“243″ y=“206″ label=“Confirmar” id=“btnConfirmar” click=“{confirm()}” tabIndex=“4″/>
  41.         </mx:Canvas>
  42.     </mx:ViewStack>
  43.    
  44.     <mx:Script source=“actions/EstadoAction.as”/>   
  45.    
  46. </mx:TitleWindow>
PLAIN TEXT
CODE:

  1. <mx:Script source=“actions/EstadoAction.as”/>

Nesta linha é que dizemos onde está as ações desta View, então vamos criar este arquivo:

EstadoAction.as

PLAIN TEXT
ACTIONSCRIPT:

  1. // ActionScript file
  2. import com.saberprogramar.controllers.IEstadoController;
  3. import com.saberprogramar.events.EstadoEvent;
  4. import com.saberprogramar.models.entitys.Estado;
  5.  
  6. import org.swizframework.Swiz;
  7.  
  8. [Bindable]
  9. private var estado:Estado;
  10.  
  11. [Bindable]
  12. [Autowire(bean=“estadoController”)]
  13. public var controller:IEstadoController;
  14.  
  15. private function init():void{
  16.    
  17.     Swiz.addEventListener(EstadoEvent.SAVE,onSaveComplete);
  18.     Swiz.addEventListener(EstadoEvent.REMOVE,onRemoveComplete);
  19.    
  20.     findAll();
  21. }
  22.  
  23. private function findAll():void{   
  24.     controller.findAll();
  25. }
  26.  
  27. private function save():void{
  28.     estado = new Estado();
  29.     stack.selectedChild = canvasForm;
  30. }
  31.  
  32. private function update():void{
  33.    
  34.     if (dgEstado.selectedItem != null){
  35.        
  36.         dgEstado.setStyle(“bordercolor”,‘black’);
  37.         dgEstado.errorString = “”;
  38.        
  39.         estado = dgEstado.selectedItem as Estado;
  40.         stack.selectedChild = canvasForm;
  41.        
  42.     }else {
  43.         dgEstado.setStyle(“bordercolor”,‘red’);
  44.         dgEstado.errorString = “Selecione um Estado para alterar”;
  45.     }
  46.    
  47. }
  48.  
  49. private function remove():void{
  50.    
  51.     if (dgEstado.selectedItem != null){
  52.        
  53.         dgEstado.setStyle(“bordercolor”,‘black’);
  54.         dgEstado.errorString = “”;
  55.        
  56.         estado = dgEstado.selectedItem as Estado;
  57.        
  58.         controller.remove(estado);
  59.        
  60.        
  61.     }else {
  62.         dgEstado.setStyle(“bordercolor”,‘red’);
  63.         dgEstado.errorString = “Selecione um Estado para excluir”;
  64.     }
  65.    
  66. }
  67.  
  68. private function confirm():void{   
  69.    
  70.     estado.idEstado = new Number(txtIdEstado.text);
  71.     estado.nome = txtNome.text;
  72.     estado.uf = txtUF.text;
  73.    
  74.     controller.save(estado);   
  75.    
  76. }
  77.  
  78. private function cancel():void{
  79.     estado = new Estado();
  80.     stack.selectedChild = canvasDefault;
  81. }
  82.  
  83. private function find():void{
  84.    
  85.     if (txtFind.text != null){
  86.         controller.findByName(txtFind.text);   
  87.     }
  88.    
  89. }
  90.  
  91. private function onSaveComplete(event:EstadoEvent):void{   
  92.     stack.selectedChild = canvasDefault;
  93.     findAll();
  94. }
  95.  
  96. private function onRemoveComplete(event:EstadoEvent):void{
  97.     stack.selectedChild = canvasDefault;
  98.     findAll();
  99. }

Algumas explicações:

PLAIN TEXT
ACTIONSCRIPT:

  1. [Bindable]
  2. [Autowire(bean=“estadoController”)]
  3. public var controller:IEstadoController;

nesta parte do código estamos fazendo a escuta da nossa controladora, repare que me refiro a interface e não a que implementa a mesma, isso é o que muitos chamam de Programação Orientado a Interface,  como essa escuta vai lá no nosso Bean.mxml e procura um bean com nome de “estadoController”, lembrando:

PLAIN TEXT
XML:

  1. <controllers:EstadoController id=“estadoController”/>

e como o nosso bean está mensionando a implementação e não a interface, ele instancia a implementação, é ou não é inteligente o Swiz :)

outra coisa que vale a pena explicar e somente isso a mais é a escuta que adicionamos aos nossos eventos no método init:

PLAIN TEXT
ACTIONSCRIPT:

  1. Swiz.addEventListener(EstadoEvent.SAVE,onSaveComplete);
  2. Swiz.addEventListener(EstadoEvent.REMOVE,onRemoveComplete);

quando fazemos esse comando acima estamos dizendo para nosso view ficar esperta, ou seja, ficar escutando qualquer disparo desses eventos, quando for disparado um dos eventos ele executa o método que se encontra no segundo parametro, exemplo o onSaveComplete que, por sua vez recebe como parametro um EstadoEvent. Lembra que no controller tem um método que dispara os nossos eventos, não lembra né, também teria esquecido :) , lembrando:

PLAIN TEXT
ACTIONSCRIPT:

  1. public function onSave(event:ResultEvent):void{
  2. Swiz.dispatchEvent(new EstadoEvent(EstadoEvent.SAVE));
  3. }

ou seja, quando é feito esse disparo é executado o nosso onSaveComplete, para quem já conhece de eventos em Flex nenhuma surpresa, somente o fato de estar usando o dispatchEvent e addEventListener do swiz e não os do SDK do próprio flex, isso tem uma explicação, o famoso Mediate do Swiz, que não vamos entrar no mérito neste tutorial, ok!

Agora como respiro final deste tutorial o Index.mxml modificado para chamar a view que acabamos de criar

index.mxml

PLAIN TEXT
XML:

  1. <?xml version=“1.0″ encoding=“utf-8″?>
  2. <mx:Application xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute”
  3.     preinitialize=“{iniciar(event)}”>
  4.    
  5.     <mx:Script>
  6.         <![CDATA[
  7.             import com.saberprogramar.views.EstadoView;
  8.             import mx.managers.PopUpManager;
  9.             import org.swizframework.Swiz;     
  10.             import mx.events.FlexEvent;   
  11.            
  12.             private function iniciar(event:FlexEvent):void{    
  13.                 Swiz.setStrict(false).loadBeans( [Beans] ); 
  14.                 chamarView();                     
  15.             }
  16.            
  17.             private function chamarView():void{
  18.                 PopUpManager.createPopUp(this,EstadoView,false);
  19.             }
  20.            
  21.         ]]>
  22.     </mx:Script>
  23.    
  24. </mx:Application>

Como minha hospedagem não suporta java não tem como mostrar o resultado final :( mais….

Caso queira o projeto em java é só baixar aqui (sem as libs).

Caso queira o projeto em flex é só baixar aqui.

Bem, é isso, uffa, nunca imaginei que criar um tutorial fosse  tão dificil e demorado :( espero que o resultado tenha sido bom :)

Considerações:

Antes de mais nada peço desculpas se o tutorial não foi muito bem explicado, se dei importância demais onde não era para dar e o que era importante não comentei, sei lá, esse tipo de coisas que pecamos por falta de experiência como blogueiro ;) mais podem ter certeza que o intuito foi o dos melhores e espero que ajude alguém, principalmente a usar MVC no flex, coisa que é muito falada mais tem poucos exemplos, principalmente na língua portuguesa.

Objetivo:

Mostrar que realmente sei o que falo que sei em meu currículo, mesmo não tendo nenhum portfólio, já que não considero meu portfólio o que faço na empresa onde trabalho, o portfólio é da empresa. Procuro contatos profissionais e serviços no que envolve desenvolvimento de sites e sistemas, quem tiver interessado é só entrar em Contato, Obrigado.

Não posso deixar de falar da minha Gata, Fernanda minha Esposa EU TE AMO MUITO, obrigado pela paciência com o seu Geek, hehhe!

Vlw, até a próx. Bons estudos para Todos e um Abraço. FIM.

Mai 25

TUTORIAL JAVA + FLEX NA PRÁTICA 5/6

Escrito por Janderson Cardoso em Action Script 3.0, Adobe Flex, Blazeds, código fonte Flex, Código Fonte java, Data Service, DomainDriveDesign, Frameworks, Hibernate, hibernate Annotations, Indico a Leitura, Java, mvc, pratica java flex, Spring, SPRING ANNOTATIONS, Swiz Framework, Tutorial, TUTORIAL FLEX, TUTORIAL JAVA @ 05 25th, 2009 | via http://www.jandersonfc.com/ | Sem comentários
Janderson Cardoso
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Esse artigo é continuação do
TUTORIAL JAVA + FLEX NA PRÁTICA 1/6
TUTORIAL JAVA + FLEX NA PRÁTICA 2/6
TUTORIAL JAVA + FLEX NA PRÁTICA 3/6
TUTORIAL JAVA + FLEX NA PRÁTICA 4/6
Como tenho feito nos outros artigos que fazem parte deste tutorial vou colocar o projeto para vocês não se perderem

EVENTS
Eventos é forma que encontramos de criar uma [...]

Mai 18

TUTORIAL JAVA + FLEX NA PRÁTICA 4/6

Escrito por Janderson Cardoso em Action Script 3.0, Blazeds, código fonte Flex, Código Fonte java, Data Service, DomainDriveDesign, Frameworks, Hibernate, hibernate Annotations, Indico a Leitura, Java, mvc, pratica java flex, Spring, SPRING ANNOTATIONS, Swiz Framework, Tutorial, TUTORIAL FLEX, TUTORIAL JAVA @ 05 18th, 2009 | via http://www.jandersonfc.com/ | Sem comentários
Janderson Cardoso
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Esse artigo é continuação do
TUTORIAL JAVA + FLEX NA PRÁTICA 1/6
TUTORIAL JAVA + FLEX NA PRÁTICA 2/6
TUTORIAL JAVA + FLEX NA PRÁTICA 3/6
Vamos falar hoje do M(Models) do nosso MVC , MVC este que fica dentro da camada de apresentação do nosso projeto.
Algo que traz muita confusão é o conceito de MVC, muitos ainda confundem [...]

Mai 15

TUTORIAL JAVA + FLEX NA PRÁTICA 3/6

Escrito por Janderson Cardoso em Action Script 3.0, Blazeds, código fonte Flex, Código Fonte java, Data Service, DomainDriveDesign, Frameworks, Hibernate, hibernate Annotations, Indico a Leitura, Java, mvc, pratica java flex, Spring, SPRING ANNOTATIONS, Swiz Framework, Tutorial, TUTORIAL FLEX, TUTORIAL JAVA @ 05 15th, 2009 | via http://www.jandersonfc.com/ | Sem comentários
Janderson Cardoso
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google