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!

Leia Mais

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

Olá pessoal...

Me desculpem pela ausência durante as últimas semanas mas estive em um período de transições mas agora, voltei com força total para tentar passar o que sei a vocês.

Nesta semana, seguindo um roteiro lógico depois dos primeiros tutoriais que escrevi vou mostrar como retornar dados do MySQL para um datagrid em Flex, para que não fique muito extenso este tutorial, eu o divide em 3 partes. Então sem mais delongas vamos ao que interessa!

1º. Passo: Configurar os softwares necessários, em caso de dúvida basta acessar o tutorial sobre de configuração clicando aqui.

2º. Passo: Criar a tabela de dados que vamos utilizar para armazenar as informações, basta copiar o código abaixo e executar em seu gerenciador de banco de dados.

CREATE DATABASE `conexao`;
USE `conexao`;
DROP TABLE IF EXISTS `clientes`;
CREATE TABLE `clientes` (
   `id` int(11) NOT NULL auto_increment,
   `nome` varchar(40) NOT NULL,
   PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=11 DEFAULT CHARSET=latin1;

insert into `clientes`(`id`,`nome`) values (1,'Dheyson'),(2,'José'),(3,'Maria'),(4,'Júlio'),(5,'Marcos'),(6,'Eliana'),(7,'Cláudia'),(8,'Joaquim'),(9,'Carla'),(10,'Márcia');

3º. Passo: Nesta etapa vou mostrar a vocês uma classe de conexão genérica com o banco de dados MySQL, muito útil em meus desenvolvimentos. Vou demonstrar o apenas o código fonte da classe, pois se for explicar passo-a-passo todo código vou fugir ao foco do tutorial, mas me coloco a disposição para qualquer esclarecimento em caso de dúvidas.

    /* Classe responsável pela conexão com o banco */
    class Conn {
    
        /* Variáveis Globais */
        private $servidor;
        private $usuario;
        private $senha;
        private $banco;
        private $conn;
        private $resultado;
        private $sql;

        /* Método Construtor */
        public function Conn($server, $user, $pass, $banco) {
            $this->setServidor($server);
            $this->setUsuario($user);
            $this->setSenha($pass);
            $this->setBanco($banco);
        }

        /* Sets */
        public function setServidor($server) {
            $this->servidor = $server;
        }
        public function setUsuario($user) {
            $this->usuario = $user;
        }
        public function setSenha($pass) {
            $this->senha = $pass;
        }
        public function setBanco($banco) {
            $this->banco = $banco;
        }

        /* Método que abre a conexão com o Banco de Dados */
        public function connDB() {
            $this->Conn = mysql_connect($this->servidor, $this->usuario, $this->senha);
            if(!$this->Conn) {
                echo "<p>N&atilde;o foi poss&iacute;vel conectar-se ao servidor MySQL. <br>Erro MySQL: ".mysql_error()."</p>";
                exit();
            } elseif (!mysql_select_db($this->banco, $this->Conn)) {
                echo "<p>N&atilde;o foi poss&iacute;vel selecionar o banco de dados desejado. <br>Erro MySQL: ".mysql_error()."</p>";
                exit();
            }
        }

        /* Método que fecha a conexão com o Banco de Dados */
        public function closeConnDB() {
            return mysql_close($this->Conn);
        }

        /* Método que executa comando SQL */
        public function runQuery($sql) {
            $this->connDB();
            $this->sql = $sql;
            if($this->resultado = mysql_query($this->sql)) {
                $this->closeConnDB();
                return $this->resultado;
            } else {
                exit("<p>N&atilde;o foi poss&iacute;vel executar o comando solicitado. <br>Erro MySQL: ".mysql_error()."</p>");
                $this->closeConnDB();
            }
        }

        /* Método instância um objeto da classe de conexão */
        static public function conexao(){
            $con = new Conn('localhost', 'root', '123456', 'conexao');
            return $con;
        }
    }
?>

4º. Passo: Salve a classe acima demonstrada com o nome de Conn.php dentro do diretório: ...\amfphp\services\vo\br\com\conexao\valuesObjects

5º. Passo: Vamos criar uma classe para manipular a tabela clientes que foi criada em nossa base de dados. Salve esta classe com o nome de Cliente.php dentro do mesmo diretório demonstrado no 4º. Passo. O código da classe deverá ficar conforme descrito abaixo.

include_once("Conn.php");

/* Classe responsável pelo tratamento dos clientes */
class Cliente {

/* Aponta para classe ActionScript do projeto Flex */
public $_explicitType = "br.com.conexao.valueObjects.Cliente";

/* Variáveis globais */
public $id;
public $nome;

/* Método Construtor */
public function Cliente() {}

/* Sets */
public function setId($cod) {
$this->id = $cod;
}
public function setNome($name) {
$this->nome = $name;
}

/* Gets */
public function getId() {
return $this->id;
}
public function getNome() {
return $this->nome;
}

/* Acessos ao banco de dados
Aqui o php recebe o retorno do MySQL e retorna ao Flex um Array com os registros da consulta.
*/
public function buscarTodos() {
Conn::conexao()->connDB();
$resultado = Conn::conexao()->runQuery("select * from clientes order by nome");
$i=0;
while ($obj = mysql_fetch_object($resultado)) {
$cli = new Cliente();
$cli->setId($obj->id);
$cli->setNome($obj->nome);

$retornoArray[$i] = $cli;
$i++;
}
return $retornoArray;
}
}
?>

A parte de back-end já esta completa. A hierarquia de arquivos deve ter ficado conforme a imagem abaixo:

Ok terminado estas etapas daremos seguimento na parte II, onde vamos criar nossas classes ActionScript e preparar nosso projeto Flex para acesso às informações do banco. Até lá e abraço a todos.

Leia Mais