Tutorial: Flex4 e VRaptor3 em 1+1 minutos

VRaptor3 é um framework para desenvolvimentos de projetos web baseados em Java. Ele utiliza tecnologias como Inversão de controle, injeção de dependências e anotações para diminuir drasticamente o tempo de desenvolvimento, fazendo uso de algumas das melhores pràticas e patterns usados em Java.

Por outro lado temos o Flex4 que é o último release da Adobe para seu framework opensource de desenvolvimento de aplicações RIA. Atualmente com vários concorrentes como Java FX e Silverligth,  o Flex continua sendo o mais utilizado e amplamente aceito visto que cerca de 99% dos navegadores já possuem o flash player instalado além de que, graças ao Android, agora ele possui suporta para smartphones.

Nesse tutorial vamos criar rapidamente um projeto Java e um Flex que integre as duas tecnologias sem entrar em detalhes, em separado.

Baixamos o projeto em branco do VRaptor3 desse link:

http://vraptor3.googlecode.com/files/vraptor-blank-project-3.1.2.zip

Dentro do Eclipse escolhemos “Importar->Existing Projects into Workspace”, logo selecionamos o arquivo que baixamos e confirmamos. Como resultado vamos ter um novo projeto em nosso workspace com o nome “vraptor-blank-project”.

Agora vamos criar uma classe, que será utilizada para passar dados para o lado do Flex. Criamos então, a classe no pacote  “br.com.caelum.vraptor.blank” e damos o nome de Programer. Dentro deixamos assim:

package br.com.caelum.vraptor.blank;

public class Programer {

    private String name;

    private String lastName;

    private Integer age;

    getters e setters...

}

Esse objeto é uma entidade que contem alguns dados para que possamos utilizar na interface do Flex.

Agora vamos modificar a classe IndexController para que envie parâmetros em formato XML que, no caso de Flex, tem vantagens sobre JSON. Sem entrar em profundidade nessas vantagens, vamos só dizer que XML pode ser mapeado automaticamente a um ObjectProxy que nos permite realizar Binding automaticamente das propriedades do objeto.

Ele deve ficar assim:

import static br.com.caelum.vraptor.view.Results.xml;

import br.com.caelum.vraptor.Get;

import br.com.caelum.vraptor.Path;

import br.com.caelum.vraptor.Resource;

import br.com.caelum.vraptor.Result;

@Resource

public class IndexController {

       private final Result result;

       public IndexController(Result result) {  this.result = result;  }


       @Path("/programer/")  @Get

       public void get(){

            result.use(xml())
                  .from(new Programer("Change me","Change me",30))
                  .serialize();

       }

}

Como podem observar criamos o método get() e anotamos ele para que seja acessado com o path relativo ao projeto "/programer/”. Também utilizamos uma das facilidades do VRaptor3 para que o objeto devolvido seja XML.

Uma vez feito iniciem o servidor e testem acessar na url http://localhost:8080/vraptor-blank-project/programer/. Se tudo deu certo deveriam ver um XML com os dados.

Agora vamos a criar o projeto em Flex4. Nesse caso vamos baixar um projeto já configurado que é praticamente o mesmo utilizado em nosso tutorial de Databinding em Flex4 com algumas pequenas modificações.

Baixamos o projeto desse link:

http://www.trueagile.org/examples/VR3PlusF4.zip

Agora importamos no Flash Builder o projeto fazendo Importar->Existing Projects into Workspace”, logo selecionamos o arquivo que baixamos e confirmamos. Como resultado vamos ter um novo projeto em nosso workspace com o nome “VR3PlusF4”.

Agora precisamos que os dados gerados no projeto flex passem para nosso projeto Java. Para fazer isso vamos fazer o seguinte. Selecionamos no Flash Builder nosso projeto e clicamos com o botão direito em Propriedades, vamos até Flex Build Path e no Library Path modificamos o Output Folder para que aponte para o WebContent do nosso projeto Java, por exemplo “C:\Users\chelo\workspace\vraptor-blank-project\WebContent”. Também modificamos o Output Folder URL para “http://localhost:8080/vraptor-blank-project/”.

O código do projeto é praticamente o mesmo que no outro tutorial, só adicionamos o seguinte:

<mx:HTTPService

id="programerGet"

url="http://localhost:8080/vraptor-blank-project/programer/get"

useProxy="false"

makeObjectsBindable="true"

method="GET"

result="programerGet_resultHandler(event)"

fault="programerGet_faultHandler(event)"  />

O HTTPService é um recurso de Flex que permite acessar a requisições HTTP de um jeito fácil, em nosso caso estamos definindo a url que configuramos em nosso Controller para que seja acessada, definindo que é um método GET, que crie um objeto ObjectProxy com o resultado e definimos dois métodos a ser chamados quando tem sucesso ou quando um erro se apresenta.

Para provar como nosso projeto funciona só atualizamos nosso projeto Java para que tome os arquivos gerados pelo projeto web e executamos. Tudo deveria estar funcionando agora.

Não abarcamos coisas como enviar dados para o lado de VRaptor3 ou como tratar dados mais complexos como arrays ou datas. Mais com o que temos aqui podemos ver uma base de como integrar as duas tecnologias e servindo como um ponto de partida para quem quer começar a experimentar.

Até a próxima!