Ao iniciar meus estudos em flex logo senti a necessidade de utilizar um banco de dados, então irei fazer o meu primeiro post com um exemplo de como acessar um banco de dados com flex e php utilizando amfphp, o banco utilizando será o mysql.
Antes de mais nada vamos criar o nosso banco.
CREATE DATABASE `exemplo` ;
Agora criaremos nossa tabela.
CREATE TABLE `amigos` (
`id` INT( 10 ) UNSIGNED NOT NULL AUTO_INCREMENT ,
`nome` VARCHAR( 254 ) NOT NULL ,
PRIMARY KEY ( `id` )
);
Iremos baixar o amfphp no site http://amfphp.org que está na versão 1.9, agora iremos ao flex e criaremos um novo projeto File - New - Flex Project.
Coloquei nome do projeto de amigos, agora com nosso mxml principal criado vamos jogar o amfphp na pasta raiz do nosso projeto.
Após copiar o amfphp temos que configurar o arquivo services_config.xml, mais antes vamos copiar o arquivo services_config.xml que se encontra dentro de amfphp/browser/ para a pasta principal do projeto flex, agora temos que setar o gateway que fica na tag no atributo uri dentro do arquivo services_config.xml, para saber a url do gateway so abrir o seu browser e ir até o arquivo gateway.php dentro do amfphp, ele lhe mostrar uma mensagem:
amfphp and this gateway are installed correctly. You may now connect to this gateway from Flash.
É so copiar a url do browser colocar no atributo uri no arquivo services_config.xml.
Agora no seu flex clicando com o botão direito do mouse em cima da pasta principal do seu projeto vai aparecer um menu e nele vai ter item properties, ao seleciona-lo irar aparecer uma tela de configuração, ao clicar em flex compiler lhe aparecerá um campo additional compiler argumenst, por padrão ja vai estar preenchido com "-locale en_US" vamos adicionar '-services "services-config.xml"', pronto nosso amfphp está configurado.
Vamos para aplicação agora..
No nosso mxml principal vamos arrastar o componente List e o componente TextInput, o componente list vamos por o id dele de "lista", terá um textinput de id "nome" e outro de "id_amigo".
A comunicação do flex com o amfphp é feito atravéz da classe RemoteObject.
fizemos uma instância da classe no mxml com a tag e configuramos seus atributos
Em destination colocamos amfphp porque é o mesmo que se encontra no nosso arquivo services_config.xml, pode ser mudado se quiser, Source é a classe php que vamos utilizar amigos-> pasta do projeto amfphp amigo-> classe php, ShowBusyCurso ativa o reloginho no curso do mouse e id para identificação do objeto.
Dentro da tag RemoteObject vamos configurar o método da classe amigo que vamos usar
< name="listarAmigos" result="listarMyAmigos(event)">
Name é o nome do método da classe php que vamos usar, o nome tem que ser o mesmo que estiver na classe.
Result é retorno do método, ele recebe um método que deverá ter um atributo de tipo ResultEvent.
Vamos criar agora o listarMyAmigos
Criamos uma variável Bindable do tipo array para que quando ela seja atualizada todo os objetos que a estiverem usando-a sejam atualizados também e dentro do método preenchemos o array com o resultado vindo do amfphp.
Vamos criar um método para iniciar a requisição ao amfphp.
dbAmigos é id do nosso RemoteObject, listarAmigos é o nome do método e send a ação.
Agora vamos configurar o List e os Textinputs
< x="10" y="44" height="288" width="270" dataprovider="{this.myAmigos}" labelfield="nome" id="lista">
< x="321" y="67" width="274" id="nome" text="{lista.selectedItem.nome}">
< x="344" y="112" width="54" id="amigo_id" text="{lista.selectedItem.id}">
No nosso List no atributo dataProvider passamos como parâmetro a variável myAmigos que contém os dados vindo do amfphp e no atributo labelField dizemos qual dado deve ser mostrado no nosso componente List.
Nos TextInputs passamos como valor no parâmetro text nossa lista com o item selecionado e o valor a ser mostrado = lista.selectedItem.nome
para finalizar o nosso mxml na tag principal da nossa aplicação vamos chamar o método carregarMyAmigos, para que o nosso List seja carregado com os dados vindo do amfphp
< application="http://www.adobe.com/2006/mxml" layout="absolute" creationcomplete="{carregarMyAmigos()}" width="602">
e por último vamos partir para o php.
Dentro do amfphp contém uma pasta service que é onde vai ficar todas suas classes php, então dentro da pasta service vamos criar uma pasta chamada amigos e uma classe php chamado amigo, exatamente como definimos anteriormente no RemoteObject.
< ?php
class Amigo
{
private $db;
function Amigo()
{
$this->db = mysql_pconnect("localhost","root","123456");
mysql_select_db("exemplo",$this->db);
}
function listarAmigos()
{
$query = "SELECT * FROM amigos a ORDER BY nome";
$resultado = mysql_query($query,$this->db);
$retorno['amigos']="";
$i=0;
while ($linha = mysql_fetch_array($resultado))
{
$id=$linha['id'];
$nome=$linha['nome'];
$retorno['amigos'][$i]['id']=$id;
$retorno['amigos'][$i]['nome']=$nome;
$i++;
}
return $retorno;
}
}
?>
Se você quiser testar sua classe php so ir em na pasta browser do seu amfphp
http://localhost/flex/amigos/amfphp/browser/
Pronto galera esse foi meu primeiro post, demorou um pouco, mais pra mim foi super gratificante.
Vou deixar disponível o código fonte e qualquer dúvida os comentários estão ae para isso.. abraços
http://andborges.byethost13.com/exemplo/amigos.rar
Assinar:
Postar comentários (Atom)
4 comentários:
Oi, deixa-me saudar voce pelo seu Blog, acho que fazem falta no mundo da internet blogs com informações e tuoriais sobre o flex.
Bom, gostava de fazer uma pergunta, porquê voce usa as {} quando chama a funcao carregarMyAmigos() em:
creationcomplete="{carregarMyAmigos()}"
Alguma razão em especial?
Salve Salve Anderson , seu post foi excelente , estou iniciando em flex e me ajudou muito !!!
valeu velhinho
Olá Anderson
Meu primeiro flex project entendido graças aos seus toques de AMFPHP e Flex.
Valeu pelo help!
Parabens pelo post. O melhor e mais bem explicado tutorial para integração de flex com php. Continue assim.
Parabens mesmo.
Postar um comentário