Uma
aplicação para editar bancos de dados
Veja
aqui o exemplo e baixe aqui os exemplos.
Mostrar
os dados de um banco de dados no Flash é bem interessante, mas
é ainda melhor se você dispuser uma maneira cômoda
para adicionar, apagar e mudar os registros neste banco de dados. Com
a funcionalidade dos componentes residentes que vêm com o Flash
MX, você pode criar um editor que lhe permite, ou ao visitante de
algum site, editar facilmente o conteúdo de um banco de dados.
Experimente clicando no link acima. Se você gostar, clique em um
registro para modificá-lo (escolha "Save Changes"
para fazer as modificações se efetivarem), ou clique em
"Add Record" para entrar com dados novos (digite no campo
de tipo de contato F ou B para ver então seu registro
sob "Friends" ou "Business" no menu
suspenso (dropdown) e então Salve (Save) para dar entrada
do registro no banco de dados.
Para Projetar a Aplicação
Passo
1: a estrutura do banco de dados
Para
este exemplo, nós usamos aquela mesma tabela em um banco de dados
do livro de endereços (tutorial anterior), acrescentando a ela
um campo adicional para permitir-nos distinguir registros de família/amigos
de registros de negócios. Esta é a instrução
PHP que criou a tabela usada nesta amostra:
$create_tab
= "create table contacts(
contactID smallint not null auto_increment,
lastName tinytext,
firstName tinytext,
phone tinytext,
email tinytext,
picFile tinytext,
caption tinytext,
contactType char(1),
primary key (contactID))";
echo "Table contacts was ".
(mysql_query ($create_tab) ? "" : " NOT").
" created successfully<br>"; |
e
esta é uma amostra do código para carregá-la com
um registro:
$ins_tab
= "insert into contacts values
(NULL,
'Anderson',
'Lois',
'301-424-5555',
'lois@yahoo.com',
'lois.jpg',
'Lois, 2001',
'F')";
echo "Record insertion was ".
(mysql_query($ins_tab) ? "successful" : "unsuccessful").
"<br>"; |
Passo
2: esboço do palco
Antes
de escrever qualquer código, você necessitará de um
esboço compatível com o que você quer que o código
faça. No caso, queremos quatro coisas:
1)
escolher um subgrupo dos registros, ou todos os registros;
2) mostrar estes registros selecionados;
3) estar habilitado a editar um registro, apagar um ou adicionar outro;
e,
4) saber o que o programa fez e esperar o que nós faremos em seguida.
Assim,
dividimos o palco em quatro áreas, do topo ao fundo, como visto
no exemplo e descrito abaixo:
1
- área de seleção de dados: ComboBox para selecionar
o tipo de registro a ser mostrado e um botão para opção
adicionar registro (Add Record);
2 - área de exibição: ListBox para mostrar registros
selecionados e permitir a seleção de um deles;
3 - área de edição: tela contendo campos de entrada
que mostram registros e permitem sua edição (ou um novo
registro em branco);
4 - área de mensagem: campo de texto para informar ao usuário
o que foi feito e o que é necessário ser feito.
Passo
3: método para codificar
Existem
numerosas abordagens para codificar uma aplicação como esta.
Decidi seguir com um filme de quadro único com código em
um arquivo externo, dividido em duas seções: definições
de função no início, inicialização
e código executável de programa no fim. (As funções
devem sempre ser definidas antes delas aparecerem no código executável
- mesmo que o Flash não se importe na maioria dos casos, existem
situações nas quais o código não executará
corretamente se elas não forem definidas primeiro).
A
seção de função inclui funções
genéricas (algumas das quais são usadas como manipuladores
pelos componentes, caso em que eles são designados ao componente
que segue a definição imediatamente sempre que possível),
e também manipuladores de eventos para outros objetos no palco.
Colocar todo o código em um lugar como aquele, com cada peça
de código designada para seu "proprietário" no
palco, torna bastante fácil para outra pessoa ver o que o programa
está fazendo sem ter que cavar muito ao redor.
Na
seção inicialização/executável,
configurei variáveis globais, estilos globais e específicos
para componentes, para levar a cabo quaisquer necessidades de inicialização
a serem feitas. As variáveis globais incluem uma estrutura (gaFields)
para definir os campos em minha tabela de banco de dados (e assim não
preciso me referir a cada um deles pelos nomes a cada vez que eu quiser
fazer alguma coisa com eles), e uma variável global (gsFilter)
para manter o rastreamento das condições do filtro atualmente
selecionado (família/amigos, negócios, ou
todos). As variáveis globais são indicadas nesta amostra
por variáveis que começam com "g", seguidos
pela letra que indica o tipo de variável ("a"=array,
"s"=seqüência de caracteres (string), seguidas
por um descritor. Porque tudo é feito em um único quadro
e em uma linha de tempo neste filme, não necessito realmente que
as variáveis sejam globais - elas serão acessíveis
de dentro de cada rotina de qualquer modo - mas passa a idéia de
que elas estão disponíveis a toda rotina e a todo objeto,
em todos lugares no programa.
Passo
4: criar scripts PHP
Para
esta amostra, criamos três scripts PHP: um para adicionar um registro
ao banco de dados, um para atualizar um registro existente (acessado pelo
seu campo contactID), e um para apagar um registro (também
pelo contactID). Para ver como os scripts PHP se comunicam com
o Flash, veja o tutorial LoadVars, nessa mesma seção. Cada
um dos scripts passa duas variáveis de volta ao Flash, com sucesso,
que é fixado em 0 ou 1, dependendo do resultado da operação,
e msg, que é a mensagem a ser mostrada ao usuário. Os scripts
podem ser vistos como parte do arquivo zip disponível para ser
baixado acima:
Como
mencionado no artigo LoadVars, sugerimos com veemência testar os
scripts que você escrever com uma simples forma HTML para primeiro
certificar-se que os dados são transmitidos e recebidos corretamente,
e então de dentro do Flash com uma operação LoadVars.send,
para estar seguro que o dado é transmitido e a string correta passa
com precisão para o navegador (browser) antes de ser colocado em
uma operação final sendAndLoad.
Na
próxima semana "trabalhando com compontentes".
|