jun 23 2008

Integrando Adobe Flex - FluorineFx - C#.net (Parte 1/2)

Categoria: C#.net, Flex, FluorineFxVinícius Sandim @ 12:32

[ Assista agora a palestra sobre este post realizada durante a Flex Mania 2009 ]

Olá pessoal, hoje estou aqui para falar sobre a integração de três ótimos frameworks para desenvolvimento de aplicativos web atualmente:

Adobe Flex
FluorineFx
Microsoft C#.net

Introdução

Existem diversas formas de integrar o Flex com nossa camada de dados, neste tutorial usarei a integração via RemoteObject utilizando o framework open source FluorineFx. Este tipo de método é em média 50% mais rápido do que outros métodos, como por exemplo via HTTP service, ou WebService. Veja um teste com outras formas de integração.

Requerimentos

Microsoft Visual Studio 2005 ou WebDeveloperExpress 2005
FluorineFx
Adobe Flex Builder 3

Vamos lá

Tendo em mente que vc já possua os componentes necessários instalados vamos iniciar o tutorial.

1 - Crie uma pasta em um diretório de sua preferência com o nome de IntegracaoFlex.

2 - Dentro desta pasta, crie duas subpastas com os nomes Interface e Negocio.

3 - Crie um projeto no VisualStudio do tipo ASP.NET WebSite dentro da pasta Negocio:

4 - Exclua a pasta App_Data que foi criada automaticamente pelo template

5 - Renomeie o arquivo Default.aspx, criado automaticamente, para Gateway.aspx. Este servirá como ponte para o acesso dos objetos asp.net.

6 - Adicione uma pasta App_Code. (Botão direito do mouse sobre o projeto, Add ASP.NET Folder… > App_Code)

7 - Crie um arquivo do tipo Web.config. (Botão direito do mouse sobre o projeto, Add New Item… > Web Configuration File)

8 - Deixe o arquivo Web.config da seguinte forma:

<?xml version="1.0"?>
<configuration>
  <configSections>
    <sectionGroup name="fluorinefx">
      <section name="settings"
               type="FluorineFx.Configuration.XmlConfigurator, FluorineFx"/>
    </sectionGroup>
  </configSections>
  <system.web>
    <httpModules>
      <add name="FluorineGateway"
           type="FluorineFx.FluorineGateway, FluorineFx"/>
    </httpModules>
    <compilation debug="true" />
  </system.web>
</configuration>

Esta é a configuração mínima para que o Fluorine funcione.

9 - Agora crie uma referência do seu projeto ao FluorineFx. (Botão direito do mouse sobre o projeto, Add Reference…) :

Caso vc não tenha alterado a pasta de instalação do fluorine padrão é C:\Arquivos de programas\FluorineFx\Bin\net\2.0

10 - Crie uma classe chamada Pessoa.cs (Botão direito do mouse sobre a pasta App_Code, Add New Item… > Class):

11 - O seu Solution Explorer deverá ficar assim.

12 - Agora finalmente vamos implementar a classe Pessoa.cs:

using System;
using FluorineFx;
using System.Collections.Generic;
namespace IntegracaoFlex
{
    /// <summary>
    /// Representa uma Pessoa.
    /// </summary>
    [RemotingService]
    public class Pessoa
    {
        #region Atributos
        private int _id_Pessoa;
        /// <summary>
        /// Id da Pessoa.
        /// </summary>
        public int Id_Pessoa
        {
            get { return _id_Pessoa; }
            set { _id_Pessoa = value; }
        }
        private string _nome;
        /// <summary>
        /// Nome da Pessoa.
        /// </summary>
        public string Nome
        {
            get { return _nome; }
            set { _nome = value; }
        }
        private string _telefone;
        /// <summary>
        /// Telefone da Pessoa.
        /// </summary>
        public string Telefone
        {
            get { return _telefone; }
            set { _telefone = value; }
        }
        #endregion
        #region Construtores
        /// <summary>
        /// Construtor padrão da classe.
        /// </summary>
        public Pessoa()
        {
        }
        /// <summary>
        /// Construtor que alimenta todos os atributos da classe.
        /// </summary>
        /// <param name="id_Pessoa">Id da Pessoa.</param>
        /// <param name="nome">Nome da Pessoa.</param>
        /// <param name="telefone">Telefone da Pessoa.</param>
        public Pessoa(int id_Pessoa, string nome, string telefone)
        {
            this._id_Pessoa = id_Pessoa;
            this._nome = nome;
            this._telefone = telefone;
        }
        #endregion
        #region Metodos
        /// <summary>
        /// Insere um novo cliente no banco de dados.
        /// </summary>
        /// <returns>Cliente inserido no banco de dados.</returns>
        public string Insere(Pessoa _pessoa)
        {
            string _retorno = "--- Pessoa Inserida ---\n";
            _retorno += "Id_Pessoa: " + _pessoa._id_Pessoa.ToString() + "\n";
            _retorno += "Nome: " + _pessoa._nome + "\n";
            _retorno += "Telefone: " + _pessoa._telefone;
            return _retorno;
        }
        /// <summary>
        /// Seleciona uma lista de pessoas no banco de dados.
        /// </summary>
        /// <returns>Lista de pessoas cadastradas.</returns>
        public List<Pessoa> Lista()
        {
            List<Pessoa> _lista = new List<Pessoa>();
            //Adiciona algumas pessoas para exemplificar
            _lista.Add(new Pessoa(1, "Vinicius", "(16)3711-1111"));
            _lista.Add(new Pessoa(5, "Cristian", "(16)3722-2222"));
            _lista.Add(new Pessoa(9, "Juliano", "(16)3733-3333"));
            _lista.Add(new Pessoa(15, "Ricardo", "(16)3744-4444"));
            _lista.Add(new Pessoa(3, "Euripedes", "(16)3755-5555"));
            return _lista;
        }
        #endregion
    }
}

Note a tag [RemotingService] na declaração da classe, esta serve para que o Fluorine saiba que esta classe é remota e será acessada por um método do flex.

Bom pessoal, nesta primeira parte criamos o nosso projeto no Visual Studio o configuramos o Fluorine para que possamos chamar os métodos via flex.

No próximo tutorial iremos fazer o projeto no Flex chamar nossos métodos Insere e Lista do .net.

Agradeço a todos e até a próxima!

6 Responses to “Integrando Adobe Flex - FluorineFx - C#.net (Parte 1/2)”

  1. Artur says:

    Prezado Vinícius, estou tentando fazer o seu tutorial, mas ficaram algumas dúvidas.

    - Para testar preciso colocar no diretório do IIS
    - Estou utilizando o Vista, quando tento rodar minha aplicação pelo visual studio 2005. Ele não exibe a lista ele apresenta mensagem de página não pode exibir a página.
    - No Flex não dá erro algum, mas as funções de listar e inserir não funcionam.

    Obs: Se você tiver o código ai é só me enviar que eu me viro.

    Desde já agradeço

  2. Vinícius Sandim says:

    Então Artur, não é necessário colocar os arquivos no diretério do IIS não, assim como está no tutorial, você pode usar o servidor web do próprio visual studio, quando você der um “Run” no seu website, o visual studio abre um “ASP.net Development Server”, você ve ele rodando na bandeja do windows. Já o código fonte, eu tenho ele aqui sim, vou providenciar um link pra download e logo disponibilizo ele no blog.

  3. Artur says:

    OK, mas quizer enviar para meu e-mail fique sem problemas.
    Conferi meu código aqui e está apresentando o seguinte erro no arquivo web.config

    Warning: Unable to update auto-refresh reference ‘fluorinefx.dll’. Error parsing application configuration file at line 17. End tag ’system.web’ does not match the start tag ‘compilation’.

    Validating Web Site
    (0): Build (web): The ‘compilation’ start tag on line 15 does not match the end tag of ’system.web’. Line 16, position 4. (d:\flex av\IntegracaoFlex\Negocio\web.config line 16)

  4. links for 2008-12-08 « Minesa IT says:

    [...] Vinícius Sandim » Integrando Adobe Flex - FluorineFx - C#.net (Parte 1/2) (tags: flex) [...]

  5. Bruno Coelho says:

    Olá Vinícius, primeiramente parabéns pelo artigo, muito bem descrito.
    Eu gostaria de saber se é possível criar um WCF e realizar a comunicação com o adobe Flex..

    Abraços,

    Bruno Coelho

  6. Vinícius Sandim says:

    Olá Bruno…

    Olha eu sei que é possível sim, mas realmente nunca fiz essa integração.
    Vou pesquisar sobre o assunto e em breve farei um post sobre a experiência.

    Pena não poder ajudar. =|

Leave a Reply