Populando Datagrid Flex com informações do MySQL – parte II

Olá a todos!

Vamos agora iniciar a segunda parte do nosso tutorial de conexão de Flex com MySQL e criar nossa aplicação flex para buscar as informações da base de dados.

1º. Passo: Crie um novo projeto Flex com o nome de conexao. E no arquivo *.mxml principal costumo colocar o nome de index.mxml ao invés de deixar com o mesmo nome do projeto, fica a gosto de cada um.

2º. Passo: Colocar o arquivo services-config.xml dentro do projeto e configurar as propriedades do mesmo para apontar para ele. Em caso de dúvida nesta etapa basta consultar o tutorial sobre configuração do amfphp com flex.

3º. Passo: Criar nossa hierarquia de DNS reverso como criamos dentro do services do amfphp, para armazenarmos nossas classes *.php, isto para que possamos trabalhar com o mapeamento de objetos *.php para *.as e vice-versa, caso tenha alguma dúvida sobre isto basta ler o tutorial sobre mapeamento. O projeto deverá ficar com a estrutura parecida com a da imagem abaixo.

4º. Passo: Nesta etapa vamos criar nossa classe ActionScript para fazer o mapeamento. Vá em: File -> New -> ActionScript Class. Dê o mesmo nome que foi dado para nossa classe *.php, ou seja, Cliente.as. Esta classe ActionScript que foi criada deverá estar dentro da pasta valuesObjects que foi criada na etapa anterior.

5º. Passo: Deixe o código-fonte da classe criada da seguinte forma:

package br.com.conexao.valuesObjects
{
    /* Aponta para a classe do php */
    [RemoteClass(alias="br.com.conexao.valueObjects.Cliente")]

    [Bindable]
    public class Cliente
    {
        public var id:int;
        public var nome:String;

        public function Cliente()
        {
        }
    }
}

6º. Passo: Agora vamos criar nossa classe de objeto remoto que será a responsável pela comunicação entre os objetos. Crie uma nova classe ActionScript e dê o nome de ObjetoRemoto.as, salve a classe dentro do diretório raiz do projeto, conforme imagem abaixo:

O código desta classe deverá ficar como descrito abaixo, deixei o código todo comentado para que facilite a compreensão, mas em caso de dúvida é só entrar em contato, ok?

package
{
    import mx.controls.Alert;
    import mx.rpc.events.FaultEvent;
    import mx.rpc.events.ResultEvent;
    import mx.rpc.remoting.mxml.RemoteObject;

    public class ObjetoRemoto
    {
        public function ObjetoRemoto(classe:String, metodo:String = null, funcao:Function = null, param:Object = null)
        {
            /* instancia um objeto remoto para conexão */
            var remoteObj:RemoteObject = new RemoteObject("amfphp");
            /* informa o nome da classe a se trabalhar "spacename.classname */
            remoteObj.source = classe;
            /* exibe o relógio na tela enquanto envia a requisição */
            remoteObj.showBusyCursor = true;
            /* verifica se ouve alguma falha */
            remoteObj.addEventListener(FaultEvent.FAULT, retornaFalha);
            /* pega o retorno da função */
            if (funcao != null)
                remoteObj.addEventListener(ResultEvent.RESULT, funcao);
            /* envia a requisicao ao gateway */
            if (metodo != null)
            {
                if (param != null)
                    remoteObj.getOperation(metodo).send(param);
                else
                    remoteObj.getOperation(metodo).send();
            }
        }

        private function retornaFalha(evt:FaultEvent):void
        {
            Alert.show("Ocorreu o seguinte erro ao tentar executar o método:\n"+evt.fault.message, "Erro");
        }
    }
}

Pronto, agora nosso projeto já está configurado e mapeado de forma correta para que possamos trabalhar. Na terceira e última parte veremos como chamar as informações para o datagrid.

Abraço a todos e até breve!