Catálogo de Produtos em Flash – Parte 3

Olá amigos do MXSTUDIO!

Na coluna anterior, coloquei no final que nesta iríamos estudar sobre a parte da interface em Flash, porém lembei-me que também temos que fazer com que os dados cadastrados sejam passíveis de leitura a partir do Flash. Portanto, na coluna de hoje abordaremos um estudo falando sobre geração dinâmica de arquivos XML.

Pré-requisitos

Ter concluído as etapas anteriores:

• Catálogo de Produtos em Flash – Parte 1
• Catálogo de Produtos em Flash – Parte 2

Como na coluna anterior, veremos várias linhas de código, mas veremos também que com o auxílio de Lumine fazendo a integração com o banco de dados, fica bem mais fácil o desenvolvimento.

Preparando a pasta dos arquivos.

Primeiro, iremos criar uma pasta chamada xml, onde armazenaremos os arquivos escritos em PHP que irão gerar dinamicamente o conteúdo XML para recuperarmos através do Flash.

Pasta chamada “xml”, destacada em azul

Depois de criada a pasta, vamos criar um arquivo PHP responsável por gerar um XML listando todas as categorias, para possamos posteriormente criar uma lista de categorias dinamicamente dentro de nosso arquivo em Flash. Abaixo segue o código para geração do mesmo, salve-o com o nome de categorias.php dentro da pasta xml:

<?php

// incluimos o arquivo de configuração config.php
// que está dentro da pasta admin
require_once '../admin/config.php';

// importamos a classe de categoria
Util::Import('entidades.Categoria');

// criamos um objeto para recuperar as categorias
$objCategorias = new Categoria;
// ordenamos pelo nome em ordem crescente
$objCategorias->orderBy('nome asc');
// recuperamos todas as categorias
$total = $objCategorias->find();

// iniciamos um XML
$xml = '<?xml version="1.0" encoding="UTF-8"?'.'>';

// se encontrou categorias
if($total > 0) {
// inicia o nó principal com o atributo
// indicando o total de categorias
$xml .= '<lista total="'.$total.'">';

// enquanto houver categorias na lista
while($objCategorias->fetch()) {
// cria um nó XML para exibição no arquivo
$xml .= '<categoria nome="'. utf8_encode($objCategorias->nome).'"';
$xml .= ' id="'.$objCategorias->idcategoria.'" />';
}

// fecha o arquivo XML
$xml .= '</lista>';

} else { // senão encontrou categorias

// informamos que não há categorias com um elemento vazio
// com o atributo total com valor 0
$xml .= '<lista total="0" />';
}

// mudamos o header
header("Content-Type: text/xml");
// enviamos o xml
echo $xml;

?>

Abaixo, vemos uma imagem de exemplo mostrando o arquivo XML gerado sendo exibido no Firefox

XML gerado dinamicamente utilizando o código mostrado.

Como pudemos observar, o processo de geração do código é bem simples. Através do método fetch herdado da classe LumineBase, nossa classe chamada Categoria gerada através da engenharia reversa do Lumine, faz com que possamos recuperar todos os registros da tabela, efetuar um laço do tipo while, atualizando os valores a cada chamada, facilitando assim o desenvolvimento.

Agora que nosso arquivo de geração de XML está completo, iremos criar um arquivo para recuperarmos os produtos do banco de dados, porém com um nível de dificuldade a mais: neste iremos também implementar filtros para que possamos recuperar os produtos de conformidade com a página atual, nome do produto e categoria selecionada. Salve-o como produtos.php dentro da pasta xml.

<?php

// incluimos o arquivo de configuração config.php
// que está dentro da pasta admin
require_once '../admin/config.php';

// importamos a classe de produto
Util::Import('entidades.Produto');

// criamos um objeto para recuperar os produtos
$objProdutos = new Produto;

// se a pessoa enviou um nome para filtrar
if(isset($_POST['nome']) && $_POST['nome'] != '') {
// colocamos uma instrução do tipo where no objeto
// para filtrarmos pelos registros que contém
// no nome o informado pelo usuário

// o método escape evita o ataque do tipo SQL injection de pessoas
// mal intencionadas
$objProdutos->whereAdd("nome like '%". $objProdutos->escape( $_POST['nome'] )."%'");
}

// se a pessoa selecionou uma categoria
if(isset($_POST['categoria']) && $_POST['categoria'] != '') {
// informa a categoria no objeto.
// fazemos um cast do tipo int para termos certeza
// que será passado um valor numérico
// para a classe
$objProdutos->categoria = (int) $_POST['categoria'];
}

// limite de registros por consulta
// se a pessoa não informar pelo método do POST, o padrão é 10
// se informar, utilizamos o informado pela pessoa
$limit = !isset($_POST['limit']) ? 10 : (int)$_POST['limit'];

// registro atual
// se não for informado, começamos no zero,
// do contrário, utilizamos o informado
$offset = !isset($_POST['offset']) ? 0 : (int)$_POST['offset'];

// contamos quantos registros foram encontrados
// com os critérios (mesmo não sendo usados)
$total_registros = $objProdutos->count();

// ordenamos pela data de cadastro em ordem decrescente,
// assim o mais recente aparece primeiro
$objProdutos->orderBy('data_cadastro desc');

// limite a quantidade de registros
$objProdutos->limit( $offset, $limit );

// recuperamos todos os produtos
$objProdutos->find();

// iniciamos um XML
$xml = '<?xml version="1.0" encoding="UTF-8"?'.'>';

// se encontrou produtos
if($total_registros > 0) {
// inicia o nó principal com o atributo
// indicando o total de produtos encontrados
$xml .= '<lista total="'.$total_registros.'">';

// enquanto houver produtos na lista
while($objProdutos->fetch()) {
// cria um nó XML para exibição no arquivo
$xml .= '<'.'produto nome="'. utf8_encode($objProdutos->nome).'" ';
$xml .= 'valor="'.$objProdutos->valor.'" ';
$xml .= 'foto="'.utf8_encode($objProdutos->foto).'" ';
$xml .= 'id="'.$objProdutos->idproduto.'">';

// iniciamos uma seção CDATA dentro do nó do produto
// para colocarmos a descrição
$xml .='<![CDATA['.utf8_encode($objProdutos->descricao).']]>';

// fechamos o nó do produto atual
$xml .= '<'.'/produto>';
}

// fecha o arquivo XML
$xml .= '</lista>';

} else { // senão encontrou produtos

// informamos que não há produtos
// com o atributo total com valor 0
$xml .= '<lista total="0" />';
}

// mudamos o header
header("Content-Type: text/xml");
// enviamos o xml
echo $xml;

?>

Imagem mostrando o XML gerado para os produtos

Espero que tenham gostado, na próxima iremos finalmente integrar com o Flash.

@braços e fique com Deus!

Autor: Hugo Ferreira da Silva – Administrador do Portal MXSTUDIO

Qualquer dúvida envie um e-mail para hugo@mxstudio.com.br ou acesse nosso fórum

Catálogo de Produtos em Flash – Parte 2

Olá pessoal!

Nesta segunda parte, iremos desenvolver dois formulários simples: um para cadastro de categorias e outro para cadastro de produtos em nosso catálogo. Serão aplicações bem simples, para que possamos atualizar nossa base de dados com os produtos desejados, enviando também um arquivo para foto.

Para desenvolver esta parte, você deve ter desenvolvido a parte da primeira coluna sobre catalogo de produtos em flash.

Vejamos agora como ficará nosso formulário de cadastro de categorias quando terminarmos. Para exemplo, fiz um formulário bem simples, sem muitos estilos visuais, somente para cadastro rápido de categorias e produtos. Crie uma pasta chamada “admin”, sem aspas, para que possamos armazenar nossos arquivos de administração.

Para facilitar o desenvolvimento, vamos criar outros dois arquivos que iremos utilizar em nossos formulários, ou até mesmo em outros arquivos que você necessite utilizar, caso deseje desenvolver outras aplicações a partir das que iremos criar nesta coluna.

O primeiro arquivo, é um arquivo de configuração, onde iremos inicializar a configuração do Lumine e de outras variáveis e constantes que poderemos utilizar mais adiante em nossa aplicação. Segue abaixo o código do arquivo. Salve-o como “config.php” dentro da pasta “admin”:

<?php

if(!defined('BASEDIR')) {
define('BASEDIR', dirname(dirname(__FILE__)));
}

require_once 'lumineado/LumineConfiguration.php';
require_once BASEDIR . '/lumine-conf.php';

$cfg = new LumineConfiguration( $lumineConfig );

?>

Nas primeiras linhas, será testado se a constante BASEDIR já está criada. Caso não esteje, iremos criar uma constante com este nome, no qual pegamos dinamicamente onde está o diretório base de nossa aplicação. Lembre que este arquivo foi salvo dentro da pasta “admin”, que está dentro da pasta raiz de nossa aplicação, então para pegarmos o diretório absoluto efetuamos uma chamada dupla à função dirname a qual recupera o nome do diretório do arquivo/pasta. A primeira chamada remove o nome do arquivo (no caso, config.php), deixando somente a pasta, a segunda, retira o nome da última pasta (no caso, admin), deixando assim somente o nome do diretório da base de nossa aplicação.

Nas linhas seguintes, incluimos os arquivos de configuração. O primeiro é o de configuração do Lumine, e o segundo são as váriaveis necessárias para conexão com o banco, também utilizadas pelo Lumine. Logo em seguida, instanciamos a classe de configuração utilizando a matriz associativa, contida no arquivo lumine-conf.php, a qual contém os dados necessários para conexão com o banco.

Pronto! agora sempre que quisermos utilizar as classes do Lumine, não precisamos ficar fazendo todas as vezes a configuração com o banco, e sim somente incluir o arquivo config.php para que carreguemos as configurações básicas de nossa aplicação.

O segundo arquivo serve para fazermos uma simples paginação, caso tenhamos vários registros em nossa base de dados. Salve-o com o nome paginacao.php dentro da pasta admin.

<?php

$pages = $total / $limit;

$vars = '&';
foreach($_GET as $key=>$value) {
if($key != 'offset') {
$vars .= $key.'='.$value.'&';
}
}

for($i=0; $i<$pages; $i++) {
$start = $i * $limit;
$exibir = $i+1;

echo '<a href="'.$_SERVER['PHP_SELF'].'?offset='.$start.$vars.'" mce_href="'.$_SERVER['PHP_SELF'].'?offset='.$start.$vars.'">'.$exibir. '</a> ';
}

?>

Na linha 3, definimos quantas páginas serão necessárias para nossa paginação. As variáveis $total e $limit vem de nossos próximos arquivos. A variável $vars irá armazenar os dados que serão utilizados para a paginação e armazenará também os dados enviados anteriormente pelo método GET. Poderíamos também pegar os dados vindos por POST ou REQUEST, porém, os dados poderiam ser muitíssimos e acabar quebrando nossa paginação, assim limitamos a quantidade de informação. Recuperamos as variáveis e colocamos na variável $vars efetuando o foreach. Posteriormente, efetuamos um loop do tipo for, indicando que deve começar de 0 e ter no máximo no número de páginas armazenado na variável $pages. Na variável $start, armazenamos o número que será enviado na URL indicando onde deve começar a paginação quando a pessoa clicar no número a ser exibido na tela. Na variável $exibir, armazenamos o número a ser exibido para o usuário na paginação. Finalmente, utilizamos o echo para exibir o conteúdo para o usuário.

Pronto, nosso arquivo para efetuar a paginação está feito.

Faremos agora um arquivo para cadastrarmos as categorias de nossos produtos. Salve o arquivo como categorias.php dentro da pasta admin. Não se assustem com o tamanho do código, porque a maior parte é HTML.

<?php

require_once 'config.php';
Util::Import('entidades.Categoria');

// faz um switch para saber a ação escolhida
if(isset($_REQUEST['acao'])) {
$obj = new Categoria;
switch(strtolower($_REQUEST['acao'])) {
case 'salvar':
$obj->setFrom($_POST);
if($obj->validate() === true) {
$obj->save();
header("Location: ".$_SERVER['PHP_SELF']);
exit;
}
break;

case 'editar':
if($obj->get(@$_GET['id']) != 0) {
$_POST = $obj->toArray();
}
break;

case 'remover selecionados':
if(isset($_POST['lista']) && is_array($_POST['lista'])) {
foreach($_POST['lista'] as $id) {
$obj = new Categoria;
$obj->get((int)$id);
$obj->delete();
}
}
break;
}
}

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Cadastro de categorias</title>
<link href="master.css" mce_href="master.css" rel="stylesheet" type="text/css" />
</head>

<body>
<form id="form1" name="form1" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<table width="450" border="0" cellpadding="2" cellspacing="1" class="borda">
<tr>
<td colspan="2" align="center"><h1>Cadastro de categorias </h1></td>
</tr>
<tr>
<td width="186" align="right">Nome da categoria: </td>
<td width="253"><input name="nome" type="text" id="nome" value="<?php echo @$_POST['nome']; ?>" /></td>
</tr>
<tr>
<td align="right"> </td>
<td><input name="acao" type="submit" id="acao" value="Salvar" />
<input type="button" name="Button" value="Cancelar" />
<input name="idcategoria" type="hidden" id="idcategoria" value="<?php echo @$_POST['idcategoria']; ?>" /></td>
</tr>
</table>
<br />
<table width="450" border="0" cellpadding="2" cellspacing="1" class="borda">
<tr>
<td colspan="3" align="center"><h1>Categorias cadastradas </h1></td>
</tr>
<tr>
<td width="20"> </td>
<td><strong>Nome da categoria </strong></td>
<td width="60"> </td>
</tr>
<?php

$lista = new Categoria;

$total = $lista->count();
$limit = 20;
$offset = (int)@$_REQUEST['offset'];

$lista->orderBy('nome asc');
$lista->limit($offset, $limit);
$lista->find();

if($total > 0) {
while($lista->fetch()) {
?>
<tr>
<td align="center"><input name="lista[]" type="checkbox" id="lista[]" value="<?php echo $lista->idcategoria; ?>" /></td>
<td><?php echo $lista->nome;?></td>
<td>[ <a href="?acao=editar&id=<?php echo $lista->idcategoria; ?>">editar</a> ] </td>
</tr>
<?php
}
?>
<tr>
<td colspan="3" align="center"><input name="acao" type="submit" id="acao" value="Remover selecionados" /></td>
</tr>
<tr>
<td colspan="3">Páginas:
<?php include("paginacao.php"); ?></td>
</tr>
<?php
} else {
?>
<tr>
<td colspan="3">Nenhuma categoria encontrada </td>
</tr>
<?php
}
?>
</table>
</form>
</body>
</html>

Os blocos mais importantes do código acima compreendem as linhas 1 até 35, onde são efetuadas as ações de adicionar, editar e remover as categorias. O segundo bloco importante compreende as linhas 74 a 112, onde listamos as categorias previamente cadastradas, para podermos editá-las ou removê-las.

Para saber qual ação tomar nas linhas 1-35, primeiramente verificamos se a variável $_REQUEST['acao'] foi enviada. Ela pode ser enviada tanto por POST como por GET, por isso utilizamos a REQUEST. Em seguida, iniciamos um SWITCH, o qual testa o valor informado dentro da variável $_REQUEST['acao']. Nas instruções CASE, notamos 3 valores possíveis: salvar, editar e remover selecionados. No bloco salvar, pegamos o valores enviados através do formulário, e colocamos dentro de um objeto categoria, setado na linha 8, através do método setFrom, que recupera os valores da matriz associativa $_POST e os coloca dentro do objeto. Após isso, testamos para ver se os valores foram colocados corretamente, na linha 12, com o método validate. Para ajustar corretamente suas regras de validação, visite a documentação de Lumine para criar o seu arquivo de validação personalizado. Se o objeto passar corretamente pela validação, o método save será chamado. Caso a variável idcategoria estiver com algum valor, ele será passado para o objeto, então a instrução SQL update será executada no objeto, pois ele possui uma chave primária e contém um valor, do contrário, o registro será inserido com os valores no banco.

No bloco editar, recuperamos o valores do objeto no banco de dados e colocamos na matriz associativa e super-global $_POST, desta forma, os valores também aparecerão no formulário, porque se notarmos nos elementos do formulário, os valores estão sendo colocados dinamicamente através desta matriz.

Finalmente, na parte de edição dos objetos, no bloco remover selecionados, verificamos se está setado e se existe uma lista de ID’s na matriz $_POST, chamado de $_POST['lista']. Esta lista é contruída quando algum elemento do tipo checkbox no formulário for selecionado, na lista de edição / remoção. Ela é criada por que os elementos checkbox tem a propriedade name setada como lista[]. Note que há colchetes após o sufixo lista. Isto faz com que seja gerada uma matriz dentro da matriz $_POST. Assim podemos executar um laço do tipo foreach (para cada…), recuperando assim os ID’s selecionados para remoção.

Das linhas 76-84, recuperamos os registros no banco de dados para montarmos nossa lista de edição / remoção. Notem que nos elementos dentro do HTML, utilizamos o próprio objeto criado para exibirmos os valores para o usuário. Isso ocorre porque a cada chamada de $lista->fetch(), os valores são atualizados para o próximo registro encontrado. Assim, podemos fazer um laço do tipo WHILE, porque quando não houver mais registros para ser exibido, o método fetch retorna false, assim o laço será interrompido.

Imagem do formulário de cadastro de categorias exibido no browser.

Sei que são muitas linhas para estudar, mas vocês verão que é bem fácil o seu desenvolvimento, ainda mais utilizando Lumine, evita um bom trabalho com instruções SQL.

Abaixo temos o código para inserção de produtos. Salve-o como produtos.php dentro da pasta admin:

<?php

require_once 'config.php';
Util::Import('entidades.Produto');

// faz um switch para saber a ação escolhida
if(isset($_REQUEST['acao'])) {
$obj = new Produto;
switch(strtolower($_REQUEST['acao'])) {
case 'salvar':
if($obj->get(@$_POST['data_cadastro']) == 0) {
$obj->data_cadastro = time();
}
$obj->setFrom($_POST);

// se a pessoa enviou um arquivo
if(is_uploaded_file($_FILES['foto']['tmp_name'])) {
// coloca o nome do arquivo no objeto
$obj->foto = $_FILES['foto']['name'];
// coloca o arquivo na pasta de imagens
// lembre-se do chmod 0777 na pasta
move_uploaded_file($_FILES['foto']['tmp_name'], '../imagens/'.$_FILES['foto']['name']);
// muda as permissões do arquivo
chmod('../imagens/'.$_FILES['foto']['name'], 0777);
}

// se passar na validação
if($obj->validate() === true) {
// salva o produto
$obj->save();
header("Location: ".$_SERVER['PHP_SELF']);
exit;
}
break;

case 'editar':
if($obj->get(@$_GET['id']) != 0) {
$_POST = $obj->toArray();
}
break;

case 'remover selecionados':
if(isset($_POST['lista']) && is_array($_POST['lista'])) {
foreach($_POST['lista'] as $id) {
$obj = new Produto;
$obj->get((int)$id);
$obj->delete();

// remove a foto do produto
@unlink('../imagens/'.$obj->foto);
}
}
break;
}
}

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Cadastro de produto</title>
<link href="master.css" mce_href="master.css" rel="stylesheet" type="text/css" />
</head>

<body>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" enctype="multipart/form-data" name="form1" id="form1">
<table width="450" border="0" cellpadding="2" cellspacing="1" class="borda">
<tr>
<td colspan="2" align="center"><h1>Cadastro de produtos </h1></td>
</tr>
<tr>
<td width="186" align="right">Nome do produto: </td>
<td width="253"><input name="nome" type="text" id="nome" value="<?php echo @$_POST['nome']; ?>" /></td>
</tr>
<tr>
<td align="right">Categoria:</td>
<td><select name="categoria" id="categoria">
<option value="">-- selecione</option>
<?php echo Util::buildOptions('entidades.Categoria', 'idcategoria','nome', @$_POST['categoria']); ?>
</select>
</td>
</tr>
<tr>
<td align="right">Valor:</td>
<td><input name="valor" type="text" id="valor" value="<?php echo @$_POST['valor']; ?>" /></td>
</tr>
<tr>
<td align="right" valign="top">Descrição:</td>
<td><textarea name="descricao" cols="35" rows="6" id="descricao"><?php echo @$_POST['descricao']; ?></textarea></td>
</tr>
<tr>
<td align="right">Foto:</td>
<td><input name="foto" type="file" id="foto" /></td>
</tr>
<tr>
<td align="right">É um produto destaque:</td>
<td><select name="destaque" id="destaque">
<option value="0"<?php if(@$_POST['destaque'] == '0') echo 'selected="selected"'; ?>>não</option>
<option value="1"<?php if(@$_POST['destaque'] == '1') echo 'selected="selected"'; ?>>sim</option>
</select>
</td>
</tr>
<tr>
<td align="right"> </td>
<td><input name="acao" type="submit" id="acao" value="Salvar" />
<input type="button" name="Button" value="Cancelar" />
<input name="idproduto" type="hidden" id="idproduto" value="<?php echo @$_POST['idproduto']; ?>" /></td>
</tr>
</table>
<br />
<table width="450" border="0" cellpadding="2" cellspacing="1" class="borda">
<tr>
<td colspan="3" align="center"><h1>Produtos cadastrados </h1></td>
</tr>
<tr>
<td width="20"> </td>
<td><strong>Nome do produto</strong></td>
<td width="60"> </td>
</tr>
<?php

$lista = new Produto;

$total = $lista->count();
$limit = 20;
$offset = (int)@$_REQUEST['offset'];

$lista->orderBy('nome asc');
$lista->limit($offset, $limit);
$lista->find();

if($total > 0) {
while($lista->fetch()) {
?>
<tr>
<td align="center"><input name="lista[]" type="checkbox" id="lista[]" value="<?php echo $lista->idproduto; ?>" /></td>
<td><?php echo $lista->nome;?></td>
<td>[ <a href="?acao=editar&id=<?php echo $lista->idproduto; ?>">editar</a> ] </td>
</tr>
<?php
}
?>
<tr>
<td colspan="3" align="center"><input name="acao" type="submit" id="acao" value="Remover selecionados" /></td>
</tr>
<tr>
<td colspan="3">Páginas:
<?php include("paginacao.php"); ?></td>
</tr>
<?php
} else {
?>
<tr>
<td colspan="3">Nenhum produto encontrado </td>
</tr>
<?php
}
?>
</table>
</form>
</body>
</html>

O cadastro de produtos é praticamente igual ao cadastro de categorias, exceto por detalhes a mais: o envio de fotos e o relacionamento com a tabela de categorias. Nas linhas 13 a 22, fazemos o upload da imagem e referenciamos o nome do arquivo dentro do objeto de produto. Para que esta parte funcione corretamente, não esqueça de criar uma pasta chamada imagens no mesmo nível da pasta admin e não dentro, como mostra a imagem abaixo:

A pasta admin, destacada em verde, e pasta de imagens, destacada em azul, ambas no mesmo nível.

Outro detalhe importante, é que o PHP deve ter direito de escrita na pasta imagens. Para isto, utilize o comando de permissões do seu gerenciador FTP (também conhecido por CHMOD). Mude as permissões para que o grupo public (público) tenha direito de escrita nesta pasta.

Outro detalhe a mais que tem neste formulário de cadastro, é a presença do método estático da classe Util que acompanha o pacote Lumine. Ele gera, na linha 77, os elementos options de um elemento select baseado nos registro encontrados de uma determinada classe.

Util::buildOptions(‘entidades.Categorias’, ‘idcategoria’,'nome’, @$_POST['categoria']);

O primeiro parâmetro é o nome da classe ou o objeto que deseja recuperar os valores. Caso você deseje passar objetos como parâmetro, não esqueça de ter executado o método find antes. O segundo o parâmetro, é o nome do campo que será usado para preencher o atributo value de um elemento option. O terceiro, o que será exibido para o usuário. O quarto, é o valor que será comparado com o segundo para saber se o elemento terá a propriedade selected ou não. Abaixo um exemplo do resultado:

<option value=”6″>Artigos para presentes</option>
<option value=”5″>Cama mesa e banho</option>
<option value=”4″>Eletrônicos</option>

Imagem do formulário de cadastro de produtos sendo exibido no navegador.

Sei que ficou um pouco extensa esta coluna, mas nela estão todos os códigos necessários para o simples administrador de produtos e categorias para nosso exemplo.

Na próxima coluna, iremos exibir os produtos cadastrados em uma interface em Flash.

@braços e fique com Deus!

Autor: Hugo Ferreira da Silva – Administrador do Portal MXSTUDIO

Qualquer dúvida envie um e-mail para hugo@mxstudio.com.br ou acesse nosso fórum

Catálogo de Produtos em Flash – Parte 1

Após um bom período sem colocar novidades no ar, estou voltando para poder contribui com o crescimento da comunidade. Estamos bem atarefados criandos novas coisas para vocês, usuários do Portal, por isso, aguardem excelentes novidades para este próximo ano .

Veremos nesta série de colunas, como gerar um simples catálogo de produtos, utilizando PHP, MySQL e Flash. Para fazer a interface PHP e MySQL, utilizaremos um framework chamado Lumine. Para que os exemplos funcionem corretamente, faça primeiro a análise dos pré-requisitos abaixo:

• Servidor Web com PHP 4.3.1 ou superior;
• Servidor MySQL 4.0 ou superior, com suporte a tabelas InnoDB;
• Framework Lumine.
• Flash MX 2004 ou Flash 8.

Após analisados e confirmados estes pré-requisitos, vamos começar pela parte do banco de dados.

Gerando as tabelas no banco de dados

Abaixo segue a instrução SQL para criarmos nossas tabelas no banco de dados:

[SQL]
Create table coluna_categoria (
idcategoria Int NOT NULL AUTO_INCREMENT,
nome Varchar(255) NOT NULL,
Primary Key (idcategoria)) TYPE = InnoDB;

Create table coluna_produto (
idproduto Int NOT NULL AUTO_INCREMENT,
idcategoria Int NOT NULL,
nome Varchar(255) NOT NULL,
descricao Text NOT NULL,
valor Float NOT NULL,
foto Varchar(255),
destaque Bool NOT NULL,
data_cadastro Datetime NOT NULL,
Primary Key (idproduto)) TYPE = InnoDB;

Alter table coluna_produto add Index IX_Relationship1 (idcategoria);
Alter table coluna_produto add Foreign Key (idcategoria) references coluna_categoria (idcategoria) on delete cascade on update cascade;
[/SQL]

Obs: as tabelas tem o prefixo coluna_ porque não posso criar outros bancos de dados em meu servidor, e para que os exemplos dados neste artigo funcionem corretamente, eles deverão ser feitos como mostrado

Gerando as classes do Lumine em PHP

Após criar as tabelas no seu banco de dados com as instruções acima, vamos criar, através de engenharia reversa, as classes e mapeamentos através do Framework Lumine. Este framework serve para trabalharmos com os registros do banco de dados como se fossem objetos, minimizando drásticamente a uilização de instruções SQL que devemos digitar. Em sua versão atual, este framework suporta engenharia reversa para os bancos de dados MySQL e PostgreSQL.

Baixando o pacote Lumine, descompacte-o em um diretório que você tenha acesso via seu browser, para que possa acessar o arquivo de engenharia reversa. Após descompactado, você verá que o mesmo possui um arquivo chamado lumine_reverse.php. Acesse este arquivo através de seu browser para gerarmos a engenharia reversa.

Acima você podem conferir o exemplo que utlizei para este artigo. Vamos analisar cada item deste formulário.

Atenção: para que a engenharia reversa funcione corretamente, é necessário que o usuário WEB tenha acesso de escrita na pasta informada em Class-Path (chmod 0777)!

• Class-Path: raiz da sua aplicação (site). Deve ser a pasta local física de onde está o seu site, por exemplo /www/seusite/public_html para sistemas *nix e c:/www/seusite/public_html para sistemas Windows. Note que para Windows é utilizada a barra, e não contra-barras (\);
• Host: nome do host onde está localizado o banco de dados;
• Banco de dados: nome do banco de dados;
• Dialeto: Existem vários dialetos disponíveis, mas nesta versão os suportados atualmente são os que possuem prefixo mysql* e posgres*. Como iremos utilizar tabelas InnoDB, utilize o dialeto mysqlt, que suporta InnoDB e transações;
• Porta: porta de conexão com o banco;
• Usuário: nome de usuário para conexão;
• Senha: senha para conexão com o banco;
• Pacote: pacote onde estarão as suas classes em PHP que serão criadas através da engenharia reversa. Ela deve ser escrita em padrão de pacotes Java (por exemplo, br.com.hufersil.classes irá gerar c:/www/seusite/public_html/br/com/hufersil/classes). Neste exemplo, estou usando o valor entidades.
• Mapeamentos: idêntico ao item pacotes, porém esta é a pasta onde serão armazenados os mapeamentos em XML. Neste exemplo, estou utilizando o valor entidades.mapeamentos.
• Nome do arquivo de cache: quando se utiliza um grande número de tabelas, é interessante gerar um arquivo de cache para que Lumine não precise ficar lendo os seus arquivos XML a cada chamada. Isso trará um grande ganho em performance. Atenção: o usuário web DEVE ter o direito de escrita sobre o arquivo (chmod 0777).
• Remover prefixo das tabelas: em nosso exemplo, estamos utilizando prefixo nas tabelas, que é o coluna_. Caso você não utilize prefixos, deixe esta opção em branco;
• Tipo de arquivo de configuração: nesta versão de Lumine, você poder gerar um arquivo XML para configuração ou um arquivo PHP. Neste exemplo utilizaremos o PHP;
• Criar controles básicos: irá criar controles básicos para que possamos manipular nossas classes de maneira bem simples. Estes formulários devem ser utilizados somente para testes com o banco, e não para produção de sites para clientes.

Após definidas as configurações acima, clique em Iniciar

Após o processo, Lumine irá criar os arquivos na pasta informada em class-path.

O arquivo de configuração com o banco é o arquivo chamado lumine-conf.php, que estará dentro da pasta inforamda no item class-path.

Primeiro contato com Lumine

Após geradas as classes, vamos criar um arquivo para inserção de teste de uma categoria. Salve este arquivo na mesma pasta onde se encontra o arquivo lumine-conf.php.

<?php
// incluindo o arquivo de configuração do banco
include_once("lumine-conf.php");
// incluindo o arquivo de configuração do Lumine
include_once("pasta/do/lumine/LumineConfiguration.php");
// instanciando uma nova configuração do Lumine
$lumineConfiguration = new LumineConfiguration( $lumineConfig );

// Importando a classe de Categoria
Util::Import('entidades.Categoria');

// criando um novo objeto de categoria
$objCategoria = new Categoria;
// atribuindo um nome a esta categoria
$objCategoria->nome = 'Eletronicos';
// salvando no banco
echo $objCategoria->save();
?>

Caso linha 17 mostre algum resultado (maior que zero) significa que o objeto foi salvo corretamente no banco de dados. Como vocês puderam notar, não escrevemos nenhuma linha de instruções SQL para que o objeto fosse salvo no banco de dados!

Na próxima coluna, iremos desenvolver uma aplicação simples para cadastrarmos categorias e produtos.

@braços e fique com Deus!

Autor: Hugo Ferreira da Silva – Administrador do Portal MXSTUDIO

Qualquer dúvida envie um e-mail para hugo@mxstudio.com.br ou acesse nosso fórum

Criando um quizz em Flash e XML

Vamos estudar neste artigo como criar um simples joguinho de peruntas e respostas, utilizando XML e Flash.

Pré-requisitos:

• Flash 8;
• Editor de texto para escrever o XML.

Ao longo deste estudo, iremos abordar:

• Duplicação de MovieClip;
• Trabalhar com XML;
• Posicionamento de elementos duplicados;
• Acesso a elementos duplicados.

Para auxiliar e facilitar o seu estudo deste artigo, estude também os artigos falando sobre XML:

• Estudo de XML – Parte 1
• Estudo de XML – Parte 2
• Estudo de XML – Parte 3
• Criando um caça-palavras

Criando a interface

Iremos trabalhar com uma interface bem simples. Para começar, crie um campo de texto dinâmico, e coloque o nome de instância como pergunta.

Em seguida crie um campo de texto dinâmico com o nome de instância de opcao.

Após criar este campo de texto, selecione-o e converta-o para movie clip (F8 ou Modify > Convert to symbol). Coloque o nome do objeto na bilioteca de opcao_quizz, para ficar mais fácil caso precisamos pega-lo novamente da bilbioteca. Coloque também o ponto de registro (registration) como indicado na figura abaixo.

Após converte-lo para movie clip, coloque como nome de instância deste como opcao_mc.

Iremos agora criar agora uma janela de alerta, para quando o usuário escolher uma resposta, seja ela certa ou errada.
Crie um retangulo (o formato realmente não importa, contato que os passos seguintes sejam seguidos), converta-o em movieclip (F8 ou modify > convert to symbol) e dê o nome na biblioteca e de instância como fundo_janela.

Crie agora acima deste movieclip um campo de texto dinâmico e coloque como nome de instância msg.

Crie agora um botão, e coloque o nome de instância do mesmo de btn_fecha.

Selecione o movieclip de fundo (fundo_janela), o campo de texto dinâmico (msg) e o botão (btn_fecha) e converta todos em um só movieclip, chamado janela_aviso (instância e na biblioteca).

Feito isto, crie uma nova camada sobre e existente e coloque o nome desta nova camada como acoes e a camada anterior como interface.

Agora na camada acoes, coloque as ações abaixo:

E agora, o modelo de XML para o quizz

Espero que tenham gostado de mais este tutorial!

Confira um exemplo do jogo funcionando!

@braços e fiquem com Deus!

Hugo Ferreira da Silva – Administrador do Portal MXSTUDIO

Qualquer dúvida, envie um e-mail para hufersil@mxstudio.com.br ou acesse nosso fórum.

Criando um caça-palavras

Neste
artigo, iremos desenvolver um caça-palavras, utilizando também arquivos XML para que possamos criar dinamismo e facilitar a troca de palavras do jogo.

Pré-requisitos:

• Flash 8;
• Editor de Texto (para escrever o XML).

Ao longo deste estudo, veremos os seguintes itens que lhes auxiliarão em outras tarefas:

• Trabalhar com duplicação de MovieClip;
• Trabalhar com Array;
• Trabalhar com XML;
• Posicionamento de elementos duplicados;
• Acesso a elementos duplicados.

Para auxiliar e facilitar o seu estudo deste artigo, estude também os artigos falando sobre XML:

• Estudo de XML – Parte 1
• Estudo de XML – Parte 2
• Estudo de XML – Parte 3

Criando a interface

Nossa primeira tarefa, é desenvolver o layout do nosso jogo de caça-palavras. Fiz o meu de uma maneira bem simples, para ficar mais fácil o entendimento. Coloque o palco nas dimensões 750 x 300 (aperte CTRL + J ou vá em Modify -> Document… para alterar as dimensões do palco). Como um jogo de caça-palavras consiste em um aglomerado de quadrinhos com letras no meio, vamos fazer somente um quadrinho (MovieClip) com uma letra dentro (Dynamic Text/Texto dinâmico).

O quadro laranja (à esquerda) mostra nosso MovieClip no primeiro quadro. O quadro azul (à direita), no segundo quadro. Há três camadas: a primeira camada (de cima para baixo) é para ações. A segunda, o campo de texto dinâmico (note que não há quadros chaves). A terceira, o fundo dos quadrinhos (o primeiro quadro do MovieClip exibe o quadro normal e o segundo quadro, o estado deste selecionado). Coloque o nome de instância do texto dinâmico como letra. A única ação a ser colocada neste primeiro quadro, como mostra a figura é stop(); para que o nosso MovieClip fique parado.

Depois da edição do MovieClip, volte para a linha de tempo principal, e coloque o nome de instância de q1 (letra “q” e número 1) para o MovieClip.

Após isso, crie uma nova camada para colocarmos a lista com as palavras e outra para as ações. Deverá ficar parecido com isso:

Na camada lista palavras, iremos criar um campo de texto dinâmico, com o nome de instância palavra. Coloque-o na posição em x: 550 e y: 10.

Clique sobre este campo de texto e pressione F8 ou clique em Modify > Convert to Symbol. Depois, coloque o nome de instância deste novo MovieClip como lista_palavra.

Pronto, nossa interface está pronta. Depois se você quiser acrescentar desenhos e outras coisas fique a vontade.

Criando o XML

Iremos armazenar a lista de palavras em um arquivo XML, para ficar mais organizado e facilitar a troca de palavras. Abaixo segue um XML de exemplo:

As possíveis posições você pode conferir nos comentários do código de ActionScript, mais abaixo. É necessário que seja seguido esta ordem na montagem do arquivo XML, para o código abaixo o interprete corretamente. Primeiro o nó de caca-palavra, depois o config e em seguida o nó palavras que contém vários nós palavra.

O ActionScript

No quadro 1 da camada ações, coloque as ações abaixo.

Como falei anteriormente, ficou bem simples, para que fosse mais fácil o entendimento.
Lembre-se: as palavras não podem cruzar! Neste jogo, fiz para as palavras não pudessem cruzar, para ficar mais fácil o código.

Confira um exemplo do jogo funcionando!

@braços e fiquem com Deus!

Hugo Ferreira da Silva – Administrador do Portal MXSTUDIO

Qualquer dúvida, envie um e-mail para hufersil@mxstudio.com.br ou acesse nosso fórum.

Flash – Criando uma enquete com Lumine + Flash

Vamos fazer hoje uma interação com PHP, MySQL e Flash. Para fazer a parte de PHP e MySQL, vou utilizar Lumine como framework, para facilitar na manipulação dos dados vindos do banco. Com ele a vida fica realmente mais fácil .

Pré-requisitos para este tutorial

• Servidor rodando PHP 4.2;
• MySQL 4.x ou superior com uma base de dados criada;
• Flash 8.

Criando as entidades

Entidades são as classes que representam as nossas tabelas no banco de dados. Por exemplo: vamos supor que você tenha uma tabela chamada pessoas, e tenha os campos idpessoa, nome, data_nascimento, email. Para acessar estes dados através de uma entidade, basta você instanciar a entidade, buscar no banco e trabalhar com o registro como se fosse um objeto. Exemplo:

Para baixar o pacote, acesse http://www.hufersil.com.br/lumine/
Para mais exemplos e documentação, acesse http://www.hufersil.com.br/lumine/lumine/documentation/enduser/.

Iremos utilizar o editor visual de Lumine para criarmos os arquivos base para trabalharmos com o banco de dados. Vamos precisar de duas tabelas: uma para armazenar as enquetes e outra para armazenar as opções das enquetes. Em nosso exemplo, as entidades devem ficar assim:

No final desta coluna, tem um arquivo zip com todos os arquivos deste tutorial. Para ver estas entidades, abra no LumineEditor o arquivo chamado LumineEditor.xml.

Na lado direito do editor visual, altere os dados necessários para conexão com o banco de dados.

Para uma explicação sobre as configurações, acesse a documentação de Lumine.

Depois de terminar de fazer as alterações necessárias, clique no ícone da engrenagem laranja para gerar os arquivos de mapeamentos, entidades e configuração. Lumine solicitará a você que efetue o download do arquivo. Salve-o em um lugar desejado e descompacte-o na mesma pasta informada na opção class-path.

Juntamente com os outros arquivos, irá vir um arquivo chamado createSchema.php. Basta você acessa-lo pelo seu navegador (tipo, http://localhost/mx/enquete/createSchema.php) para ele gerar suas tabelas no banco de dados corretamente.

Pronto! Já temos nossas entidades, mapeamentos, tabelas e arquivo de configuração criados! Agora, é só utilizar as classes!

Inserindo uma enquete no banco

Eu vou fazer um exemplo bem simples. Depois vocês podem fazer um gerenciador para o mesmo. Salve como inserir.php.

Viram como é fácil? Dessa forma, não precisamos nos preocupar com as SQL. Ele já insere tudo certinho.

Criando o arquivo que gera o XML da enquete

Vamos criar agora o arquivo que recupera os dados da enquete e gera o XML. Salve como enquete.php.

Criando o arquivo que salva a opção escolhida no Flash

Este arquivo será chamado quando o usuário clicar em uma das opções. Após salvar a opção escolhida pelo usuário, já retorna os valores atualizados para mostrar os resultados da enquete. Salve-o como salva_opcao.php.

Criando a interface em Flash

Essa parte eu acho um pouco mais complicada que a anterior, portanto vou ceder os arquivos em Flash 8, mas da mesma forma, explicarei como fazer a interface para funcionar certinho.

Crie um campo de texto dinâmico no palco, com o nome de instância pergunta. Abaixo dele, crie um movie clip com dois quadros. O campo de texto pergunta não deve estar dentro deste movieclip. Este servirá como nosso radio button. No primeiro quadro, faça os desenhos dele não checado, e no segundo, dele como se estivesse checado. Quando você for converte-lo para movieclip, coloque as opções como mostrado abaixo:

Ainda dentro deste mesmo movieclip, coloque um campo de texto dinâmico com nome de instancia opcao. Ele deve estar presente nos dois quadros. A maneira mais fácil é colocar ele no quadro e sem quadro chave no segundo segundo, o que irá fazer com ele fique presente nos dois.
Volte a linha de tempo principal e dê o nome deste movieclip como opt.

Agora selecione o campo de texto dinâmico pergunta e o movieclip opt e crie um novo movie clip, chamado enquete, com as opções abaixo:

Dentro deste novo movieclip, crie uma nova camada. Nesta nova camada, crie um texto dinâmico na mesma posição x e y do movieclip opt (que está na camada de baixo). Selecione este campo de texto recém criado e dê-lhe o nome de instância texto. Selecione-o novamente e converta-o em movieclip. Dê lhe o nome de instância de item_resultado. Pronto! a interface está feita! Agora basta criarmos os AS’s para eles.

Se vocês notarem nas duas imagens anteriores, temos a opção AS 2.0 class marcada. Estes são os nomes das classes que criaremos para o movieclip de opções da enquete e para a enquete, respectivamente.

Criando o arquivo Opcao.as

Basta pegar o código abaixo e salva-lo como Opcao.as na pasta do arquivo FLA.

Criando o arquivo Enquete.as

Finalmente, basta criarmos o arquivo Enquete.as. Igualmente ao Opcao.as, salve-o na mesma pasta que o FLA:

Ufa! Acho que essa foi uma das colunas mais longas que já escrevi heheheh.
Vocês podem baixar os arquivos aqui

E por favor: DÚVIDAS, POSTEM NO FÓRUM!

@braços e fiquem com Deus!

Classe FileReference

Fala galera!

Primeiramente, gostaria de pedir desculpas pelo tempo que fiquei sumido… é que estou trabalhando em um projeto meio (bastante) complexo, correndo atrás de construir minha casinha e estou escrevendo esta coluna agora com a mão direita machucada… quem não sabe jogar bola é assim: escorrega na bola e cai em cima da própria mão!!

Mas vamos partir para o que interessa. No Flash 8, encontramos uma classe muito interessante, para que possamos trabalhar com upload e download de arquivos (lembra do input do tipo file no HTML???)

Uma das grandes diferenças da classe FileReference em relação ao tradicional upload por form de um HTML, é que ela possibilita saber a quantas anda nosso download/upload do arquivo!

A maior parte do trabalho com a classe é feita através de listeners. Aqui vão os eventos disparados pela classe que podem ser recuperados e tratados através de listeners:

• onSelect (file:FileReference) : disparado quando o usuário seleciona o arquivo na caixa de diálogo;
• onCancel (file:FileReference): disparado quando o usuário clica em cancelar na caixa de diálogo;
• onOpen (file:FileReference): disparado quando se inicia um download ou upload de arquivo;
• onProgress (bytesLoaded:Number, bytesTotal:Number, file:FileReference) : Informa a quantidade de bytes carregados/enviados, a quantidade de bytes total e o arquivo que está sendo feito upload/download;
• onComplete: disparado ao completar um download / upload;
• onHTTPError: disparado quando há algum erro no envio (upload) do arquivo;
• onIOError: disparado quando há algum erro no recebimento (download) do arquivo;
• onSecurityError: disparado quando há erros de segurança (por exemplo, tentando salvar em servidores diferentes);

Os métodos que podem ser invocados com uma instância de FileReference são:

• addListener (listener:Object): objeto que servirá de ouvinte (listener);
• browse ( [listadeTipos:Array] ): exibe a caixa de diálogo para procura de um arquivo para upload. O parâmetro lista de tipos, é um array de objetos contendo duas propriedades: description e extension. Por exemplovar img:Object = {description: “JPG Files (*.jpg)”, extension:”*.jpg; *.jpeg”};

  var txt:Object = {description: “Plain text files (*.txt)”, extension:”*.txt”};

  var listTypes:Array = new Array(img, txt);

• cancel (void): cancela o download ou upload do arquivo;
• download (url:String, [defaultName:String] ): inicia um download do arquivo. O parâmetro URL informa de onde está sendo feito o download do arquivo, e o parâmetro defaultName (opcional) informa um nome padrão para o arquivo.
• removeListener (listener:Object): remove um ouvinte (listener) da lista de listeners do objeto FileReference.
• upload (url:String): inicia o upload do arquivo para o endereço informado em URL.

E, finalmente, suas propriedades são:

• creationDate:Date – Data de criação do arquivo ;
• creator:String – Tipo de criador do arquivo (para Macintosh) ;
• modificationDate:Date – Data de modificação do arquivo ;
• name:String – Nome do arquivo ;
• size:Number – Tamanho do arquivo ;
• type:String – Tipo do arquivo.

Todas as propriedades são somente leitura.

Bom, agora que vimos o que temos para usufruir na classe FileReference, vamos trabalhar um pequeno exemplo com ela.

Abaixo, estão os links para os arquivos PHP que criei para esta coluna. Para não ficar muito extensa, resolvi colocar um link para o fonte deles, formatado pelo próprio PHP.

• Upload de arquivos;
• Lista os arquivos;

Você poderá fazer o layout da maneira que desejar. Fiz um layout bem simples para que possamos realizar nosso estudo. Todos os desenhos abaixos estão em uma única camada. Todos os botões são componentes Button. Os nomes em vermelho são os NOMES DE INSTÂNCIA de cada objeto.

Depois de nomear CORRETAMENTE os objetos no palco, iremos colocar as ações abaixo em uma NOVA CAMADA, para não misturar objetos com ações.

E aqui, está um exemplo dele funcionando!

http://www.hufersil.com.br/mx/FileReference/

@braços e fiquem com Deus!

Essa terceira e última parte do estudo sobre como integrar MySQL + PHP + Flash fiz a uma violenta dor de cabeça, garganta inflamada e absolutamente sem voz nenhuma! Por isso, peço que perdoem se tiver muito erro de digitação! =D

Nessa última parte, veremos como pegar os XML’s gerado na coluna anterior e colocá-los dentro do Flash.
Caso você não tenha feito ainda a coluna anterior, abaixo seguem os links para você poder fazer e acompanhar nosso estudo:

Integração mySQL + PHP + Flash
Integração mySQL + PHP + Flash – Parte 2

Iremos fazer uma pequena alteração em nosso PHP da coluna anterior, para que o XML gerado seja baseado no tipo de produto que desejamos. Altere as linhas mostradas abaixo no arquivo que gera o XML de produtos:

Por isto:

Isto fará com que nossa consulta ao banco de dados seja baseada no tipo de produto clicado. Se nenhum tipo de produto for selecionado, será feita uma consulta ao banco pegando produtos de qualquer tipo em uma ordem aleatória. Esta consulta também limita o resultado em 8 registros, que é máximo de produtos que cabe no meu exemplo.

Agora que fizemos nossas alterações, vamos fazer um PHP que gera um XML dos tipos de produtos. Salve como tipos.php.

Bom, agora que você já fez as primeiras partes, vamos partir para a etapa final.
Neste meu exemplo, fiz um palco de 450 x 500 pixels. Daeh você fica a vontade para criar. Abaixo seguem as configurações necessárias para que possamos fazer nosso carro andar:

/* MovieClip de modelo para os tipos */
var it_tipo:String = ‘item_tipos’;
/* MovieClip de modelo para os produtos */
var it_produto:String = ‘item_produtos’;
/* número de colunas para os produtos */
var colunas:Number = 2;
/* numero da coluna atual (indice 0)*/
var coluna:Number = 0;
/* número da linha atual */
var linha:Number = 0;
/* espaco entre os produtos */
var espaco:Number = 10;
/* url base dos PHPs */
var urlbase:String = ‘http://www.hufersil.com.br/mx/catalogo_1/arquivos/’;
/* documento XML para os tipos */
var tipos:XML = new XML();
/* documento XML para os produtos */
var produtos:XML = new XML();
/* ignora espaços em branco */
tipos.ignoreWhite = produtos.ignoreWhite=true;
/* assim que terminar de carregar os tipos */
tipos.onLoad = function(b:Boolean) {
/* oculta o movie clip de modelo */
_root[it_tipo]._visible = false;
/* pega o nó que contém a lista */
var node:XMLNode = tipos.firstChild;
/* para cada nó dentro deste */
for (node=node.firstChild; node != null; node=node.nextSibling) {
/* pega o próxima nível a ser usado */
var n:Number = _root.getNextHighestDepth();
/* duplica o item */
_root[it_tipo].duplicateMovieClip(‘it_tipo’+n, n);
/* pega o item duplicado */
var mc:MovieClip = _root['it_tipo'+n];
/* coloca o rótulo certo */
mc.rotulo.text = node.attributes.nome;
/* coloca o código do tipo */
mc.idtipo = node.attributes.idtipo;
/* coloca o item abaixo do anterior */
mc._y = _root[it_tipo]._y+((mc._height + 5 ) * n);
/* quando o cara clicar no item */
mc.onRelease = function() {
/* chama a função que carrega somente os itens deste tipo */
recarregar(this.idtipo);
};
}
/* chama função que carrega o XML de produtos */
recarregar(0);
};
/* quando terminar de carregar os produtos */
produtos.onLoad = function(b:Boolean):Void {
/* zera linha e coluna */
linha = coluna = 0;
/* limpa os produtos */
limpaProdutos();
/* deixa o item de modelo invisivel */
_root[it_produto]._visible = false;
/* pega o nó raiz */
var node:XMLNode = this.firstChild;
/* para cada nó dentro do nó raiz */
for(node = node.firstChild; node != null; node=node.nextSibling) {
/* pega a largura do item */
var w:Number = _root[it_produto]._width;
/* pega a altura do item */
var h:Number = _root[it_produto]._height;
/* pega o próximo depth a ser usado */
var n:Number = _root.getNextHighestDepth();
/* duplica o modelo */
_root[it_produto].duplicateMovieClip(‘produto_’+n, n);
/* pega o produto duplicado */
var mc:MovieClip = _root['produto_' + n];
/* coloca na coluna certa */
mc._x = _root[it_produto]._x + ((w + espaco) * coluna) ;
/* coloca na linha certa */
mc._y = _root[it_produto]._y + ((h + espaco) * linha);
/* ID do produto */
mc.idproduto = node.attributes.idproduto;
/* carrega a foto deste produto */
mc.loader.loadMovie(urlbase + ‘fotos.php?idproduto=’ + mc.idproduto);
/* coloca o nome do produto */
mc.nome.text = node.attributes.nome;
/* se a próxima coluna for maior que o permitido */
if(++coluna >= colunas) {
/* volta para a primeira coluna */
coluna = 0;
/* aumenta a linha utilizada */
linha++;
}
}
}
/* função que remove os produtos que já estão sendo exibidos */
function limpaProdutos ():Void {
/* para cada movie clip na linha de tempo principal */
for(var x:String in _root) {
/* se começar com o prefixo produto_ */
if(x.substr(0, == ‘produto_’) {
/* remove ele */
_root[x].removeMovieClip();
}
}
}
/* função que carrega a XML de produtos */
function recarregar(idTipo:Number):Void {
/* carrega o XML */
produtos.load(urlbase + ‘produtos.php?idtipo=’+idTipo);
}
/* carrega o XML de tipos */
tipos.load(urlbase+’tipos.php’);

Se você fez tudo conforme acima, o resultado deve ser semelhante a este exemplo aqui =D.

@braços para todos e fiquem com Deus!