Abril.

com Mais sites Abril Grupo Abril Abril Mdia Distribuio Grfica Abril Educao Assine Loja

EVENTOS ARTICULISTAS MULTIMDIA INTERCON 2011 FRUM CODE IMASTERS PRO

Faa Login / Cadastre-se

Pesquisar...
Por uma internet mais criativa e dinmica

Design Banco de Dados Gerncia de TI CMS Framework APIs Desenvolvimento Linguagens Marketing Digital Tecnologia

Flash
Agenda completa
Sexta-feira, 07 /01 /2005 s 1 2h56, por Maxw ell Dayvson

Hoje irei demostrar como criar uma agenda utilizando sharedObject. No exemplo abaixo,
percebam que possvel:

. Adicionar itens na agenda.

. Remover itens da agenda.
. Alterar itens da agenda.
. E selecionar a letra no qual deseja encontrar registros que existem na agenda.

Para adicionar um tem, preciso clicar no boto adicionar. E depois que tudo tenha sido
preenchido, clicar no boto salvar.

Para editar, basta selecionar um tem de qualquer letra e clicar em editar para desativar os
campos para alterao, e clicar em salvar editado.

Para remover, basta selecionar um tem e clicar no remover.

LTIMAS NOTCIAS

17h40

Novo modelo de compras

coletivas testado nos EUA
16h35

Google experimenta busca sem

boto Estou com sorte
15h40

Modificaes no autorizadas em
plugins do WordPress so
detectadas
14h30

Add-on SDK para Firefox

liberado
13h20

Amazon pode lanar tablet em

01 passo: Insira no stage os componentes de :
agosto
TextInput -> para a digitao; VER MAIS NOTCIAS
ComboBox -> para escolher uma letra;
List -> para exibir os registros daquela letra;
Button -> para os botes. CURSOS ONLINE

Agora defina o instance name de cada um deles como na imagem abaixo. Os componentes
TextInput tem o seu instance name idntico ao texto que est ao lado de cada componente
na cor preta. Os demais instance name esto na cor vermelha.

Efeitos digitais com Photoshop e

Illustrator
O curso mostra de forma objetiva uma gama de
possibilidades nos softwares de edio de imagens
 mais utilizados no mundo: Photoshop & llustrator CS4.

Plane jando campanhas de e-mail

marketing na prtica
O curso de E-mail Marketing ensina a trabalhar com a
ferramenta de acordo com as recomendaes ticas
e tcnicas, respeitando as diretrizes do Cdigo de
Autorregulamentao, conforme as limitaes dos
programas de e-mail.

Agora vamos comear a programar :D. Os comentrios esto em verde.

Redes e protocolo TCP/IP
//Varivel agenda vai receber o sharedObject que ser usado no exemplo. Este curso apresenta os conceitos fundamentais de
redes de computadores, discutindo as caractersticas
//Vamos resgatar o sharedObject a partir do mtodo getLocal. das principais tecnologias de LAN e de WAN.
//Observe que o argumento passado no mtodo o nome que ter o sharedObject. Caso ele
no exista, ser criado com esse nome
var agenda:SharedObject = SharedObject.getLocal("imasters");
//Na condicional if abaixo, use a propriedade data do sharedObject, para verificar se contatos Find us on Facebook

undefined; iMasters
if(agenda.data.contatos == undefined){
Like
//Caso seja, defina contatos como sendo um array.
agenda.data.contatos = []; 4,264 people like iMasters.

//O mtodo flush, responsvel por gravar no sharedObject as informaes que foram
enviadas para a propriedade data;
agenda.flush(); Raphael E merson M aximino Raddar C lev erson

};
//Varivel para acessar, de forma mais prtica o array contatos que est na propriedade data
do SharedObject
E duardo G uilherme Thiago C harles C ah
var ctAgenda:Array = agenda.data.contatos;
F acebook social plugin
// Crie o array posies
var posicoes:Array = [];
// A funo preencheLetras, responsvel por preencher o combobox letras.
function preencheLetras():Void{
//Crie o array letrasArray
var letrasArray:Array = [];
//Crie a varivel ind.
var ind:Number = 0;
//No loop for abaixo, atribuo a varivel i o valor de 65 e o loop continua at i chegar a 90;
//De 65 90 corresponde ao valor do cdigo ascii de A Z (maiusculo).
//E vamos usar o mtodo fromCharCode da classe String para retornar a letra
correspondente ao nmero.
//Exemplo: 65 = A 66 = B e assim por diante. at 90 = Z;
for(var i = 65; i <= 90; i++){
//Usando o mtodo esttico fromCharCode da classe String,
//passando como argumento o valor de i, e assim retornar a string correspondente a i
var l:String = String.fromCharCode(i);
posicoes[l] = ind;
//Use o mtodo push da classe Array, para gravar no ltimo ndice do array o valor da varivel
l
letrasArray.push(l);
//Incrementando a varivel ind, a cada passagem do loop.
ind++;
};
//Atribua a propriedade dataProvider, do combobox letras, o array letrasArray
//Essa propriedade ir receber os valores existentes no array, e ir preencher o combobox.
letras.dataProvider = letrasArray;
};
//Executando a funo preencheLetras.
preencheLetras();
//Restringindo o campo nome com para que ele suporta apenas os caracteres de a at z.
nome.restrict = "a-z A-Z";
//A funo getContatos, responsvel por exibir os nomes que iniciam com a letra informada
no argumento da funo
function getContatos(letra:String):Void{
//Crie o array _contatos;
var _contatos:Array = [];
//No loop for abaixo usando a varivel ctAgenda que o sharedObject;
for(var i =ctAgenda.length; i--;){
// A condicional if abaixo verifica se o argumento da funo letra, usado o mtodo
toLowerCase,(que deixa a string em minusculo)
// igual a ctAgenda[i].nome.substr(0,1) que ir retornar a primeira letra da propriedade nome
do array,
//contatos do sharedObject de acordo com a posicao do array
//Compliquei? hehehe vamos l simples.
//Imagine ctAgenda[i].nome, sendo i = 0, retorna o valor de joo, usando o mtodo substr,
passando como argumentos 0 e 1.
//Ele vai retornar a primeira letra do joo que o j ( e ai usando o mtodo toLowerCase,
//caso a letra estiver em maisculo, ele converte pra minusculo)
//Agora foi n!?
if(letra.toLowerCase() == ctAgenda[i].nome.substr(0,1).toLowerCase()){
//Executando o mtodo push, da classe Array, para gravar o nome que contm a primeira
//letra igual a que foi passada como argumento na funo na propriedade label.
//E o valor da varivel i na propriedade data, do array de objetos _contatos
_contatos.push({label:ctAgenda[i].nome,data:i});
};
//Atribuindo a propriedade dataProvider do componente listBox o array _contatos.
//Fazendo isso o listBox ser preenchido com os valores que esto no array _contatos;
nomes.dataProvider = _contatos;
};
//Verifica se a propriedade length, do dataProvider maior que 0, ou seja se existir algum item
no componente listBox,
//ele entra na condio abaixo
if(nomes.dataProvider.length > 0){
//Selecionando o primeiro item do componente listBox. Atribuindo o valor 0 a propriedade
selectedIndex
nomes.selectedIndex = 0;
//Estimulando o evento chageHandler, para exibir os valores do primeiro item do listBox que
foi marcado anteriormente
//Esse evento ser definido logo mais a diante.
nomes.changeHandler();
}else{
//Desabilitando os botes de editar e remover, porque na letra seleciona no possui nenhum
registro.
editar.enabled = remover.enabled = false;
};
};
//Funo responsvel por adicionar um contato, a agenda.
function addContato():Void{
//Crie a varivel obj que objeto simples.
var obj:Object ={};
//Agora crie a propriedade nome no obj, e atribua a ela o valor da propriedade text do
//componente que vc digitou o nome que vai entrar na agenda.
obj.nome = nome.text;
//Agora crie a propriedade dados no obj, sendo ela um array vazio.
obj.dados = [];
//A posio 0 do array dados, vai receber o valor que foi informado no componente que
contm o instancename de email
obj.dados[0] = email.text;
//A posio 1 do array dados, vai receber o valor que est foi informado no componente que
contm o instancename de telefone
obj.dados[1] = telefone.text;
//A posio 2 do array dados, vai receber o valor que est foi informado no componente que
contm o instancename de endereco
obj.dados[2] = endereco.text;
//Usando o mtodo push, no ctAgenda, passando como argumento o obj. Gravando assim as
informaes no array
ctAgenda.push(obj);
//Usando o mtodo flush para gravar no sharedObject as novas informaes;
agenda.flush();
//Defina a propriedade selectedIndex do combobox letras, com o valor correspondente a
ltima letra que foi adicionada
letras.selectedIndex = posicoes[nome.text.substr(0,1).toUpperCase()];
//Estimulando o evento changehandler do comboBox letras.
letras.changeHandler();
};
//Funo responsvel por limpar os campos de cadastro da agenda.
function clearCampos():Void{
//Utilizando a propriedade text do componentes textInput e atribuindo o valor de "" a ela.
nome.text = email.text = telefone.text = endereco.text = "";
};
//Funo responsvel por deixar os campos de cadastro editveis ou no, de acordo com o
//valor passado no argumento da funo que pode ser true ou false.
function enabledCampos(ativo:Boolean):Void{
//Usando a propriedade editable dos componentes de textInput, e atribuindo o valor do
argumento da funo a ela.
nome.editable = email.editable = telefone.editable = endereco.editable = ativo;
};
//Funo responsvel por definir qual cor do texto dos componentes de textInput, para isso
//use o mtodo setStyle, passando com argumento "color", e como segundo argumento o
valor
//informado na funo setColorText
function setColorText(cor:String):Void{
//Usando o mtodo setStyle, para informar qual ser a cor do texto
nome.setStyle("color",cor);
//Usando o mtodo setStyle, para informar qual ser a cor do texto
email.setStyle("color",cor);
//Usando o mtodo setStyle, para informar qual ser a cor do texto
telefone.setStyle("color",cor);
//Usando o mtodo setStyle, para informar qual ser a cor do texto
endereco.setStyle("color",cor);
};
//Funo responsvel por revemor o item selecionado no listBox nomes. A funo recebe
como argumento o id do item selecionado.
function removeSelectedItem(id:Number):Void{
//Use o mtodo slice, passando como argumento o id, esse mtodo responsvel por
adicionar ou remover itens do array
//e modificar o mesmo, o segundo argumento a quantidade de itens, que ser retirado a
partir da posio
//informada no primeiro argumento.
ctAgenda.splice(id,1);
//Use o mtodo flush para gravar no sharedObject a alterao feita.
agenda.flush();
//Execute a funo clearCampos, para limpar as informaes do item que foi excludo
clearCampos();
//Execute o evento changeHandler do comboBox letras, para atualizar o listBox com os
nomes.
letras.changeHandler();
};
//Funo responsvel por editar o contedo do item selecionado. Recebe como argumento o
id do item selecionado.
function editContato(id:Number):Void{
//Alterando a propriedade nome, do array que est no sharedobject, na posio do id passado
//com o valor digitado no componente nome
ctAgenda[id].nome = nome.text;
//Alterando a ndice 0 do array dados que possui o valor do email, do array que est no
//sharedobject, na posio do id passado com o valor digitado no componente email
ctAgenda[id].dados[0] = email.text;
//Alterando a ndice 1 do array dados que possui o valor do telefone, do array que est no
//sharedobject, na posio do id passado com o valor digitado no componente telefone
ctAgenda[id].dados[1] = telefone.text;
//Alterando a ndice 2 do array dados que possui o valor do endereco, do array que est no
//sharedobject, na posio do id passado com o valor digitado no componente endereo
ctAgenda[id].dados[2] = endereco.text;
//O mtodo flush, responsvel por gravar no sharedObject as informaes que foram
enviadas para a propriedade data;
agenda.flush();
//Executando a funo enabledCampos, e passando como argumento false, deixando assim
//desabilitados para a alterao os componentes de TextInput
enabledCampos(false);
//Estimulando o evento chageHandler, para exibir os valores do primeiro item do listBox que
foi
//marcado anteriormente
//Esse evento ser definido logo mais a diante.
nomes.changeHandler();
//Desabilitando os componentes (editado e limpar).
editado.enabled = limpar.enabled = false;
};
//Funo responsvel por exibir os detalhes, do item que foi selecionado no componente
listBox nomes.
function showContato(id:Number):Void{
//Atribuindo a propriedade text, do componente o valor recebido, do sharedObject, na posio
do id informado na funo
nome.text = ctAgenda[id].nome;
//Atribuindo a propriedade text, do componente o valor recebido, do sharedObject, na posio
do id informado na funo
email.text = ctAgenda[id].dados[0];
//Atribuindo a propriedade text, do componente o valor recebido, do sharedObject, na posio
do id informado na funo
telefone.text = ctAgenda[id].dados[1];
//Atribuindo a propriedade text, do componente o valor recebido, do sharedObject, na posio
do id informado na funo
endereco.text = ctAgenda[id].dados[2];
//Executando a funo enabledCampos, e passando como argumento false, deixando assim
//desabilitados para a alterao os componentes de TextInput.
enabledCampos(false);
};
//Defina o evento changeHandler do componente listBox nomes, esse evento executado,
//quando ocorrer a troca do item selecionado para outro.
nomes.changeHandler = function():Void{
//Executando a funo setColorText, e passando como argumento o hexadecimal da cor
preta.
setColorText("0x000000");
//Executando a funo showContato, para exibir os detalhes, do nome selecionado.
showContato(this.selectedItem.data);
//Atribuindo a propriedade enabled dos componentes de (editar e remover) o valor de true.
//Deixando eles habilitados para serem clicados.
editar.enabled = remover.enabled = true;
};
//Defina o evento clickHandler do componente button limpar, esse evento executado,
quando o componente clicado.
adicionar.clickHandler = function():Void{
//Habilitando os campos para digitao.
enabledCampos(true);
//Execute a funo clearCampos, para limpar todos eles.
clearCampos();
//Executando a funo setColorText, e passando como argumento o hexadecimal da cor azul.
setColorText("0x0000FF");
//Atribuindo a propriedade enabled do componentes salvar e limpar com o valor de true.
salvar.enabled = limpar.enabled = true;
//Atribuindo a propriedade enabled do componente editado com o valor de true.
editado.enabled =false;
};
//Defina o evento clickHandler do componente button limpar, esse evento executado,
quando o componente clicado.
limpar.clickHandler = function():Void{
//Execute a funo clearCampos, zerando assim todos os campos do form.
clearCampos();
};
//Defina o evento clickHandler do componente button remover, esse evento executado,
quando o componente clicado
remover.clickHandler = function():Void{
//Execute a funo removeSelectedItem, para remover o item selecionado.
removeSelectedItem(nomes.selectedItem.data);
};
//Defina o evento changeHandler do componente comboBox lestras, esse evento
executado,
//quando ocorrer a troca do item selecionado para outro.
letras.changeHandler = function():Void{
//O mtodo removeAll, vai remover todos os itens que esto no componente listBox nomes.
nomes.removeAll();
//Execute a funo getContatos, para pegar os contatos existentes da letra selecionada.
getContatos(this.selectedItem);
};
//Defina o evento clickHandler do componente button editar, esse evento executado, quando
o componente clicado.
editar.clickHandler = function():Void{
//Habilitando os campos, para tornar possvel a digitao
enabledCampos(true);
//Executando a funo seColorText e passando o hexadecimal da cor vermelha.
setColorText("0xFF0000");
//Atribua a propriedade enabled dos componentes (editado e limpar) com o valor de false
editado.enabled = limpar.enabled = true;
//Atribua a propriedade enabled do compoente do salvar com o valor false;
salvar.enabled = false;
};
//Defina o evento clickHandler do componente button editado, esse evento executado,
quando o componente clicado
editado.clickHandler = function():Void{
//Executando a funo editContato, passando como argumento, o valor da propriedade data
do item selecionado no listBox nomes
editContato(nomes.selectedItem.data);
//Atribua o a propriedade enabled do componente clicado o valor false.
this.enabled = false;
};
//Atribua a propriedade enabled dos componentes (salvar, limpar, editado, editar, remover) o
valor false
salvar.enabled = limpar.enabled = editado.enabled = editar.enabled = remover.enabled =
false;
//Defina o evento clickHandler do componente button salvar. Esse evento executado,
quando o componente clicado
salvar.clickHandler =function():Void{
//Verifica se o campo nome possui alguma coisa digitada, caso seja positivo, ele executa a
//funo addContato, para adicionar o contato e desabitia os botoes de salvar, limpar e
editado
if(nome.text != ""){
//Executando a funo addContato.
addContato();
//Desabilitando os botes
this.enabled = limpar.enabled = editado.enabled = false;
};
};
//Execute a funo enabledCampos, passando false como argumento, deixando assim os
campos desabilitados.
enabledCampos(false);
//Execute o evento chagenHandler, para exibir os itens da letra A inicialmente.
letras.changeHandler();

Clique aqui para baixar o arquivo o .FLA

Espero que tenham gostado e at a prxima.

Abraos a todos.

Maxwell Dayvson Analista de Sistemas na GLOBO.COM e Instrutor do

centro de treinamento iMedia, no Rio de Janeiro, em diversas tecnologias
Macromedia. Trabalha com Flash desde 2001 e seu hobby jogar KOF.

Pgina do autor Email

Leia os ltimos artigos publicados por Maxwell Dayvson

Duplicao de MovieClips
Scroll vertical e horizontal
Scroll para MovieClips e TextFields
Blog com Flash + XML
Calendrio
Envio facilitado de e-mails

21 COMENTRIOS COMENTE TAMBM

Santiago bardella
E ae cara....gostaria de parabeniza-lo pelo seu trabalho...Mas cara, depois que eu adiciono
os meus "clientes", ele fica gravado???
H 6 anos Responder

Leonardo
Ol Maxwell, parabns pelas explicaes, gostaria de saber se os dados ficam gravados no
array ou se em outro local? Gostaria de saber se possvel fazer um chat em flash
guardando os dados em um banco de dados? Utilizando o flash mx 2004? obrigado!!!
H 6 anos Responder

Igor Costa
Aos meus amigos, que comentaram anteriormente, principalmente ao ltimo.
Pela pergunta fiquei at pasmo e no sei ainda como o meu amigo Maxwell ainda no veio
por aqui. Ainda bem!!!
Mas sem brincadeiras agora.
A agenda usa um sistema de cookie que no actionscript chamamos de SharedObjects, ou
seja tudo que for inserido nos campos sero salvos em um array que ser considerado pelo
player como um valor de string ou nmero que ser armazenado como um internal object ou
seja um objeto interno que serve apenas para consulta. Coisa que isso totalmente
reversvel, por isso a necessidade de inserir, apagar, adicionar etc etc. Como no prprio
exemplo dado pelo Max, onde ele explica passo a passo.
Caso ainda no saiba sobre como funciona o SharedObject, aconselho fortemente d uma
lida na documentao do Flash, mesmo na verso 6 que em portugus existe explicao
para ele.
Mas em fim, salva sim tudo que voc inserir nos campos.

Max pronto t feito.

H 6 anos Responder

Paulo
nOSSA.....velhOO melhor materia....super show de bola....ainda num fiz...to no trampo
^^....mas qnd chega em casa primera coisa q eu vo fz.....vlwwWWWW mt boaaaa
H 6 anos Responder

alexandre
muito bom esse tutorial mais tipo eu publico isso na net e comeo a cadastrar meus
contatos tem como ser apagados tipo excluindo cookies ou algo do tipo......e quando eu
cadastro somante a minha maquina pode enxerga os contatos cadastrados????parabns
mesmo velho animal a matria.....
H 6 anos Responder

Mariane
Ol!
Muito boa a matria! H possibilidades de integrar essa agenda com PHP? Ficaria bom a
integrao, bem como a ampliao de dados a serem cadastrados no?!
Parabns pela iniciativa e enovao.
H 6 anos Responder

Geraldo de Castro Bastos

oi max gostei muito da materia ja estou tentando, mas gostaria de lhe fazer um pedido,
existe um site
http://www.square-enix.co.jp/dvd/ff7ac/
na parte de trailers e na parte de characters gostaria d esaber como fazer isso, muito bom
o movimento. Obrigado pela ateno.
H 6 anos Responder

Jorge Lima
Maxwell, quando tento abrir o arquivo agenda.fla e banner.fla d o erro:FORMATO DE
ARQUIVO NO ESPERADO.mEU FLASH O MX 6.0, QUE FAO?.OBRIGADO
H 6 anos Responder

rodrigo
Adorei a idia!! mas quando tentei fazer ele avisa que tem um erro na linha 17 do action
script!! o que eu faco??
H 6 anos Responder

Panayotis Esquivel Procopiou

Ol amigo acabei de verificar que no tem erro nenhum, lembrando que todos esses artigos
so para flash mx 2004.

Abraos
H 6 anos Responder

Eduardo Lissoni
O arq .FLA nao abre aparece uma menssagem de erro dizendo que:formato de arq nao
esperado
H 6 anos Responder

Raimundo
Caro Maxwell, este artigo esta' bestial, a minha questao e' ... se n da' para salvar o
sharedObject numa maquina remota, de forma a quem acede.se online vi.se o que foi
anteriormente acedido,visto que desta forma, so' quem introduziu os dados tem acesso aos
mesmos porque o SO ta' salvo na propria maquina. Um abrao
H 6 anos Responder

Leonardo Ribeiro
Ai Galera fiz uma agenda parecida em Flash + PHP
http://www.realizanet.com.br/leo/agenda online FLASH +PHP - contatos e compromissos.zip
H 6 anos Responder

Jorge Meneses Sousa

Todos seus artigos so bons, mais falta o passo a passo para os iniciantes iguais a mim.
valew.
H 6 anos Responder

Rom Gyver
Amigo sua agenta ficou muito boa, mais confesso falta mais uma coisinha, que tal darmos a
opo de upload de imagem a pessoa assim ficaria mais bonita e personalizavl e que tal em
vez de letras nos "for" de repetio nos trocaros por paavras tipo cidades ou regis me ajude
que assim que eu fizer te passo para voc botar para download para galera.
agradeo desde j, Roberto.
H 6 anos Responder

Durf
Desculpe pela crtica, mas no entendi nada. Porm gostei muito desta agenda, so pediria
mesmo que fizesse um passo-a-passo. Muito Obrigado
H 5 anos Responder

simone
cara, eu gostei da agendinha.. mas poso sugerir um ajuste? faltou a opao: exibir todos os
nomes!

Pq eu posso querer ver todos os nomes.. E tb poso querer saber quantos nomes eu tenho
cadastrado. Flw
H 5 anos Responder

Leandro Cavalcante
Muito bom msm seu tutorial, mais me pintou uma dvida, o SharedObject local certo?
Se eu disponibilizar esta agenda na net com informaes fixas, pessoas vero a informao
 de maneira diferente ou simplesmente no vo visualizar.
H 5 anos Responder

Leonardo Marinho
acho que o exemplo seria melhor aproveitado se fosse com php e mysql, que seria um
exemplo onde os alunos poderiam fazer uma coisa realmente til e comercial !!
H 4 anos Responder

Leonardo Marinho
se tratando de uma agenda os registros tinhas que vim em ordem alfabtica, quando vc
seleciona qualquer letra os registros no esto em ordem alfabtica !
H 4 anos Responder

Cristiano Ruivo
Primeiramente parabeniza-lo pelo seu trabalho, e pedir uma ajuda, eu fiz aqui e ficou otimo a
agenda e ate resolvi posta num site, mais no site num abriu os dados, aonde fica salvo os
dados, em que arquivo??
Obrigado
H 4 anos Responder

QUAL A SUA OPINIO?

Escreva seu comentrio aqui...

PARCEIROS

2001 iMasters FFPA Informtica Ltda

Todos os direitos reservados.
Sobre o iMasters
Poltica de privacidade
Anuncie
Fale conosco