AMAURY BENTES (123 pts)

MARCELO SIQUEIRA (96 pts)

FÁBIO DUARTE (79 pts)

FLASHGURU (155 pts)

STICKMAN (155 pts)

DAUTON JANOTA (255 pts)

GUILHERME G.G. (137 pts)

ZECA BALA (45 pts)

DAAFY (55 pts)

ILVA RUDEV (90 pts)

ZEBEDIAH (35 pts)

LUIZ AVANCI (51 pts)
Treinamento PontoFlash de Flash e ActionScript

Quero colocar as propriedades _xmouse e _ymouse em só um campo dinâmico.

Como mudar a cor de um objeto via Actionscript?

Como inserir um flash numa pagina html de sem background ou transparente?

Como fazer um ponteiro de um relógio girar sem parar?

Quero abrir uma janela popup do Flash.

Como pegar um objeto (movieclip) da biblioteca sem instanciá-lo no palco?

Rodo um vídeo usando Flash ou Director?

Como criar movieclips dinamicamente com uma escala e um alpha no mouseOver?

Como carregar um bitmap randomicamente, escolhido entre várias?

Como faço para desabilitar a mãozinha do mouse em filmes que estão em levels inferiores?

Quero controlar dois movieclips com sons. Tocar um, parar outro e vice-versa.

Função javascript para voltar há uma página anterior a atual.

Como utilizar uma função para procurar valores dentro de uma variável?

Por que o "&" retorna erro num texto importado no flash?
Usando Flash e ASP para contruir um formulário.

Jogo da Forca

Parâmetro - Get microphone().

Barra de rolagem simples no Flash5.

LoadVariables & OnClipEvent(data).

Como usar o Flash com o FrontPage?

Ação Imprimir.

Como arredondar os cantos de uma foto no Fireworks.

Turbine seu Fireworks

Botões estilo Apple.com feito no PhotoShop

Calendário dinâmico

Simulando 3D.
Keypress

Lace

Stereo Control

Nudemask2

Supermascara

Rotação

Tocha 2

Micróbios

Scroll f5

Mouse delay

Drag tooltip

Mulher
HOME | TUTORIAIS
Editor de banco de dados (PHP-MySql) orientado a Objetos (OOP)
por Helen Triolo

Veja o exemplo desse artigo funcionando e aqui baixe os arquivos

Esta amostra é a terceira de uma seqüência que inclui:

1 - um simples exemplo de como usar o Flash com PHP e MySQL para exibir um livro de endereços e

2 - um exemplo do uso de componentes do Flash MX para criar um editor de tabela para as informações da tabela de um livro de endereços.

   Nesta amostra, damos um outro passo e criamos um editor que funcionará com qualquer tabela, não somente com as tabelas de contato. Nesta particular implementação, especifiquei a mesma tabela que foi usada para o editor de tabela anterior (que pode ser vista pela edição dos registros do exemplo e depois dando-se uma olhada no editor de tabela anterior para ver as mudanças lá também), mas usei-o também para outras tabelas em outros projetos e tive somente que fornecer uma definição de tabela (mais sobre isso abaixo) e especificações de layout como entrada a cada vez.

   Nesta amostra, tive dois objetivos: fazer um editor que funcione para qualquer tabela, e fazê-lo usar programação orientada a objeto. O último torna possível re-utilizar os arquivos objeto que eu desenvolvi (especialmente Recordset.as) para futuras necessidades relacionadas com banco de dados, sem ter que mudar qualquer código interno. Tendo lido recentemente o capítulo de Branden Hall e Samuel Wan's Object-Oriented Programming with Actionscript que mostra como aplicar o padrão MVP em um jogo, pensei em tentar aplicar este padrão a esta aplicação.

   Neste padrão, três partes independentes definem a aplicação: o "Model" (que controla os dados na aplicação), o "View" (que é o exibidor físico dos dados), e o "Presenter" (que abstrai a manipulação do modelo da entrada recebida pelo "View", nas palavras de Branden e Sam). A independência do objeto é mantida por ter-se o "Model" transmitindo mensagens via um objeto EventBroadcaster, que o "Presenter" monitora e age de acordo para atualizar o "View".

Especificações da aplicação e estrutura (falando livremente)

Esta amostra permite ao usuário editar um tabela (adicionar, modificar ou apagar registros) em um banco de dados. Em sua forma corrente, existem certas restrições que se aplicam à tabela:

• O primeiro campo da tabela supõe-se ser um campo não-editável auto-incrementado, que é utilizado para acessar o registro correto para atualização e para apagar

• Somente campos numéricos e de texto na tabela podem ser editados. Campos de texto simples ou multi-linha são suportados, mas não dados ou outros campos que não sejam numéricos ou de texto.

Na sua implementação, tenho usado scripts para acessar o banco de dados, mas a aplicação foi criada de tal modo que qualquer linguagem que suporte instruções padrão SQL pode ser usada - os arquivos script são propriedades do objeto Recordset e são passados a ele pelo Apresentador, portanto os scripts CF ou ASP ou JSP equivalentes podem ser especificados em seu lugar. O coração do programa está contido em quatro arquivos independentes:

EventBroadcaster.as, que contém o objeto e métodos EventBroadcaster, que permite aos objetos no programa transmitir mensagens quando têm que levar a cabo uma ação, e outros objetos para dar apoio como ouvintes a aqueles eventos. (Este código veio literalmente do livro OOPWAS).

Recordset.as, que define a classe Recordset e seus métodos. Um objeto Recordset contém propriedades que definem a tabela e seus campos, e uma estrutura que contém os conteúdos lidos da tabela. Ele possui métodos para obter registros da tabela, e para inserir, apagar e atualizar os registros na tabela. Quando executa qualquer das operações acima, ele transmite uma mensagem para informar isso.

attachContentPane.as, script que reside no componente editPane. O EditPane fornece conteúdo para um painel de rolagem (scrollpane) (a parte que rola do filme acima) na forma de uma série de registros (movieclips) que contêm campos editáveis (campos de texto). O painel de rolagem, junto com a barra de títulos acima dela e a caixa de mensagem abaixo, formam o componente "View" no nosso programa. Dentro do "View" está o detentor de dados (scrollpane), que é a parte que contém atualmente o registro do dado.

Presenter.as, que dá início às coisas dizendo ao objeto Recordset para obter algum dado, e então aguardando pela transmissão de eventos do Recordset (atualizando o conteúdo do painel de rolagem caso necessário) e também agindo (não transmitindo) sobre as mensagens enviadas do painel de rolagem (via rotinas manipuladoras de eventos).

Um arquivo adicional, MovieclipExtra.as, fornece um método do objeto MovieClip que retorna um "manipulador" para a instância campo de texto criada via createTextField. Este método é requerido pelo código no script attachContentPane.

Nesta implementação, dois scripts PHP controlam a comunicação entre o Recordset e o banco de dados. Como mencionado acima, eles são especificados para a aplicação, e assim podem ser quaisquer scripts, em qualquer linguagem server-side que possam falar com um banco de dados via consulta SQL.

genericGet.php retorna todos os campos para registros na tabela especificada, filtrados e ordenados como especificado pelas três variáveis POSTed.
genericDo.php aplica a consulta a ele passada via variável qry POSTed, e retorna duas variáveis: success (verdadeiro se a consulta foi executada com sucesso) e msg (uma mensagem de sucesso, passada se bem sucedida; ou uma mensagem de falha, se não)

Detalhes do objeto Recordset (o "Model")

Definição de dado, Recordset.getDataDef()

Para exibir ou editar dados em uma tabela de banco de dados, você deve saber como são esses dados - isto é, ter uma definição do dado. Isto pode ser providenciado pelo objeto Recordset de uma ou duas maneiras (muitas mais são possíveis; estas são só as duas que eu implementei até agora): como um arquivo XML, ou como um objeto inserido no código. A amostra desse artigo utiliza a última, mas se você baixar o fla, verá que existe um código marcado para ser ignorado (comented-out code) incluído para permitir que o dado seja especificado via arquivo XML (também um campo de texto de entrada e um botão Go em uma camada Guide que permite que o nome do arquivo XML seja especificado pelo usuário). O arquivo XML que contém os dados para esta amostra está também incluído no arquivo zip.

   A definição dos dados inclui o nome da tabela, condição de filtragem (para a parte ONDE (WERE) da consulta SQL selecionada), variável para classificação (para a parte ORDENAR POR (ORDER BY) da consulta SQL selecionada), campo de registros para cada campo especificando o nome do campo, número de caracteres a ser exibido, tipo de campo (numérico ou de texto), e "isEditable" (o qual na verdade acabei não usando), e alguma coisa chamada ishowcol, que especifica o índice do campo a ser usado quando mostrar mensagens de prompt para o usuário (como "Você quer apagar o registro do <último nome>?"). Os campos devem ser especificados na ordem em que foram criados na tabela (ou as consultas Inserir não funcionarão corretamente). Uma propriedade opcional pode também ser especificada para cada campo, mline (multiline), que, se verdadeira, provoca o aparecimento de um campo de texto multi-linha com barra de rolagem para aquele campo.

Recordset.populate()

Este método usa o fileGetQuery (no nosso caso, genericGet.php) para obter registros da tabela para dentro da aContent, uma propriedade do Recordset. É usada para preencher inicialmente a estrutura, e depois, sempre que uma recarga é necessária.

Recordset.deleteRecord()

Produz uma consulta "SQL delete" para apagar o registro especificado pelo índice, um parâmetro passado. Executa a consulta (chamando fileDoQuery = genericDo.php aqui) e transmite uma mensagem com o resultado: ou onDataChanged ou onError, as quais (ambas) são tratadas pelo "Presenter". Aqui está o que aquele método parece:

// index = index into data provider (content array) for record to delete
   Recordset.prototype.deleteRecord = function(index) {
   // assumes ID field is the first
   var IDField = this.aFields[0].name;
   var IDval = this.aContent[index][IDField];
   var sQryDelete = "DELETE from " + this.sTable + " WHERE " + IDField + "=" + IDval;
   for (var i in this.lvData) {
      if (i!= 'owner') {
         delete this.lvData[i];
      }
   };
   this.lvData.onLoad = function() {
      if (this.success) {
         // remove record from content array
         this.owner.aContent.splice(index, 1);
         this.owner.broadcastMessage("onDataChanged", this.msg);
      } else {
         this.owner.broadcastMessage("onError", this.msg);
      }
   }
   this.lvData.qry = sQryDelete;
   this.lvData.successMsg = "Record was deleted";
   this.lvData.sendAndLoad(this.fileDoQuery, this.lvData, "POST");
};

Note que, porque o objeto loadVars é uma propriedade do objeto Recordset temos que atribuir a propriedade lvData, proprietária, para permitir o acesso ao Recordset de dentro dos métodos do lvData. Ambos, lvData e lvData.owner são atribuídos no construtor do Recordset:

function Recordset(fileGetQuery, fileDoQuery) {
   this.fileGetQuery = fileGetQuery;
   this.fileDoQuery = fileDoQuery;
   this.aContent = [];
   this.lvData = new LoadVars();
   this.lvData.owner = this;
   EventBroadcaster.initialize(this);
}

Esta técnica é usada ao longo disso (e provavelmente na maioria das aplicações OOP baseadas em actionscript) para permitir comunicação entre os objetos hierárquicos não-movieclip (isto é, quando this._parent não se aplica).

Recordset.insertRecord(), Recordset.updateRecord()

Estes métodos produzem consultas SQL para inserir um registro (utilizando dados passados para dentro como um parâmetro) ou atualizam um campo em um registro existente (também usando dados passados como um parâmetro), respectivamente. updateRecord transmite uma mensagem quando feito e muda aContent para compatibilizar a mudança com o banco de dados (assim ele não precisa ser requisitado). insertRecord chama o Recordset.populate quando feito de tal maneira que a nova ID correta será estabelecida no aContent, ou transmite uma mensagem de erro se a consulta de inserir falhar.

Detalhes da painel de rolagem (scrollpane) (o contentor de dados no "View")

Tentei fazer esta aplicação inicialmente utilizando o componente DataGrid como contentor de dados do "View", mas tive tantos problemas tentando fazê-lo funcionar que troquei para um painel de rolagem (scrollpane) cujo conteúdo é fornecido por um componente personalizado, editPane. Ao invés de mostrar os registros em uma grade e fazer surgir um painel de edição quando um registro é clicado, os registros são somente mostrados na forma de edição num longo painel de rolagem (obviamente, este não é um modo prático de editar uma tabela muito grande, mas funciona bem com tabelas pequenas. Devo também assinalar que esta amostra deverá ser melhorada fazendo a exibição com um componente ciente de dados FUI, mas o princípio de comunicação entre as partes MVP permanece a mesma, não importando que forma o "View" tome)

   O painel de rolagem (chamado "Scrollpane mod" na biblioteca) foi modificado um pouco em relação ao componente scrollpane original para permitir que um objeto initObject seja especificado no método setScrollContent (como pode ser feito por padrão com o attachMovie, por exemplo). Com esta modificação, posso passar os dados necessários para fazer os movieclips registro no painel de rolagem, assim:

this._view._dataHolder.setScrollContent(
   "editPane",
   {aFields:this._rs.aFields, aContent:thisdata, props:this._view});

   (fragmento do método updateDataHolder do "Presenter"). Comandos que anexam movieclips registro, rótulos e campos de texto estão todos incluídos no método loadPane do editPane (em attachContentPane.as). Eles estão construídos a partir de especificações fornecidas pelo usuário (neste caso, um objeto no quadro 1 do filme principal) sobre quão grande o painel de rolagem deve ser, que altura os campos de texto devem ser, quais (alternativamente) as cores devem ser usadas nos movieclips registro, etc. Todas estas especificações são passadas pelo Apresentador quando ele cria o "View", como parâmetro "props".

Detalhes do "Presenter"

O "Presenter" é a parte do código que mantém todas as coisas juntas. Seu método inicializador cria um campo de texto para mostrar mensagens de condição (status) do usuário e então passa informações para o conjunto de registros (Recordset) a respeito dos scripts a serem usados para obter a edição de dados nas tabelas. (O Recordset recebe esta informação, preenche sua estrutura aContent e transmite uma mensagem onDataReady quando termina). Quando o Apresentador vê que um evento onDataReady aconteceu, chama o createView para criar o "View" (incluindo o painel de rolagem e seus itens relacionados):

RSPresenter.prototype.onDataReady = function() {
   this.createView();
};

Respondendo à entrada do usuário ao "View"

O usuário pode fazer uma de três coisas no "View":

• Ele(a) pode modificar o conteúdo de um campo de texto e então sair deste campo (teclando Tab ou Enter) para mudar seu conteúdo

• Pode apagar um registro pressionando o botão Apagar

• Pode preencher dados no último registro (vazio) e pressionar o botão adicionar

   Quando quaisquer dessas coisas acontecem, um manipulador de evento correspondente é chamado no Apresentador para pedir pela confirmação do evento. Por exemplo, na saída de um campo que tenha modificado, o "View" emite esta chamada:

spane._presenter.askSave();

   que chama o método askSave do "Presenter". Este método se complementa com outro método "Presenter", saveOrNot, que chama o Recordset.updateRecord se o usuário responder Sim para confirmar na caixa de diálogo. Se o usuário disser Não, "Presenter" retornará o contentor de dados (dataholder) ao seu prévio (não-editado) valor. Existe um par de métodos para cada uma das três operações que um usuário pode executar. Aqui está o código para askAdd e addOrNot:

RSPresenter.prototype.addOrNot = function(mbxWhich, btnWhich) {
   var dh = this._view._dataHolder;
   if (btnWhich==0) {
      this._rs.insertRecord(dh.selRecContent);
   }
this._tl.mbxConfirm.removeMovieClip();
};

RSPresenter.prototype.askAdd = function() {
   var dh = this._view._dataHolder;
   var mbx = this._tl.attachMovie(
      "FMessageBoxSymbol",
      "mbxConfirm",
      this.baseDepth++,
      {_x:this._view.msgx, _y:this._view.msgy});
   mbx.setButtons(["Yes","No"]);
   mbx.tabEnabled = false;
   mbx.setMessage("Do you want to add a record for " +
      dh.selRecContent[this._rs.aFields[this._rs.iShowCol].name] + "?");
   mbx.setCloseHandler("addOrNot", this);
};

"Presenter" acessa o "View" via sua propriedade _view, que contém um apontador para o detentor atual de dados, _dataholder. Este objeto contém as propriedades relativas ao dado selecionado no painel de rolagem (como o selRecContent, que é um objeto contendo todo o campo de dados para que o registro seja adicionado).

Como você pode usar isto?

Se você tem acesso ao PHP e a um banco de dados (MySQL ou outro) em seu servidor, pode usar este programa como está para editar (ou permitir que um visitante do site edite) uma tabela em seu banco de dados, proporcionar à tabela encontrar os dois critérios nas "specs" (especificações) acima. Você precisa:

• editar genericGet.php e genericDo.php para incluir informações associadas ao seu banco de dados, e

• fornecer uma definição de sua tabela via um arquivo XML ou pela modificação do objeto dataDef inserido no código no genericEdit.as; e

• mudar os valores do viewDef para o que quer que seja que você queira

   Então, somente compile (publique) o genericEdit.fla e carregue o html resultante e os arquivos swf para seu servidor.

   Bem, penso que poderia despender o resto de minha vida adicionando funções a este programa (como a habilidade de mostrar os campos em uma tabela conectada via caixa combinada, ao invés de em um campo de texto, um modo de editar campos de dados, verificação de erros em uma entrada de dados...).

Veja o exemplo desse artigo funcionando e aqui baixe os arquivos

Tradução
Sergio Ramalho



Devido à reformulação implementada no site, pode ser que você encontre alguns links quebrados. Por favor, ajude-nos a corrigir eventuais problemas nos informando links quebrados
0 comentário