Os Componentes, como já vimos, são Movie Clips com parâmetros que permitem modificar sua aparência.
Ao invés de criamos botões, combos e listas, podemos arrastar esses componentes para o palco do Flash e adicionar funcionalidade a eles, configurando-os a nossa maneira.
1- Abra o arquivo contatenos.fla
2- Habilite o painel Componentes.
3- Selecione o componente TextInput e arraste-o para o palco do Flash colocando o nome de instância de “nome”.
4- Aumente o tamanho deste Componente para 300×20.
Quando arrastamos um componente para o palco, automaticamente é criada um símbolo dele junto a Biblioteca.
5- Selecione o símbolo TextInput da Biblioteca e arraste-o para o palco do Flash, colocando-o logo abaixo do outro, deixando-o com a mesma largura e altura. Dê o nome de instância para ele de “email”.
6- Agora, arraste uma instância do componente TextArea para a palco, colocando abaixo dos outros componentes com a largura de 300×40. Instancie-o para “mensagem”:
7- Arraste uma instância do componente Button para o palco do Flash, posicionando abaixo dos outros componentes.
8- No painel Components Inspector mude o item label para “Enviar” e instancie-o para “btn_enviar”.
9- Arraste outra instância do componente Button para o palco do Flash, colocando-o ao lado do btn_enviar.
10- Mude a opção label para “Limpar”e instancie- o para “btn_limpar”
11- Precisamos agora de um campo de erro. Selecione a ferramenta Text Tool no formato Dynamic Text e clique e arraste uma caixa na parte superior dos componentes.
12- Instancie esta caixa de texto para “mensagemErro”.
13- Crie uma nova camada e renomei-a para “acoes”. Habilite o painel Actions e digite na primeira linha:
btn_enviar.addEventListener(MouseEvent.CLICK, valida);
btn_limpar.addEventListener(MouseEvent.CLICK, limpar);
A função “valida” servirá para verificar se os campos foram digitados, se não retornará uma mensagem.
A função “limpar” servirá para apagar os campos de texto.
14- Na terceira linha digite:
function valida(evento:MouseEvent):void{
mensagemErro.text = “”;
if (nome.text == “”){
mensagemErro.text = “Favor preencher o campo
nome \n”;
}
if (email.text == “”){
mensagemErro.text = String(mensagemErro.text)
+ “Favor preencher o campo email \n”;
}
if (mensagem.text == “”){
mensagemErro.text = String(mensagemErro.text)
+ “Favor preencher o campo mensagem \n”;
}
}
function limpar(evento:MouseEvent):void{
nome.text = “”; email.text = “”; mensagem.text = “”;
}
Caso as caixas de texto estejam vazias retornará uma mensagem no campo de texto instanciado de “mensagemErro”.
Teste o arquivo e veja que os botões estão funcionando.
Melhore o visual desta página inserindo imagens de redes sociais e maiores informações.
Configurando o envio de dados do formulário de contato
15- Abaixo dos ouvintes dos botões (na terceira linha) digite:
var nomeArquivo:String;
nomeArquivo = “processa.asp”;
O Flash conversa com o ASP e PHP através de envio e recebimento de variáveis, executando as tarefas.
Neste exercício passaremos os dados para o ASP fazer o envio dos dados por e-mail.
16- Abaixo das condicionais (if) acrescente mais uma para a função “enviar”, digitando:
if (mensagemErro.text = = “”){
this.enviar();
}
17- Abaixo iremos digitar a função “enviar”, responsável pelo envio dos nossos dados do formulário:
function enviar():void {
var req:URLRequest=new URLRequest(nomeArquivo);
req.method=URLRequestMethod.POST;
var vars:URLVariables=new URLVariables;
vars.nome=escape(nome.text);
vars.email=escape(email.text);
vars.mensagem=escape(mensagem.text); req.data=vars;
var loader:URLLoader=new URLLoader();
loader.load(req);
loader.addEventListener(Event.
COMPLETE,onVarsLoaded);
loader.addEventListener(IOErrorEvent.IO_ERROR,
onIOError);
}
function onVarsLoaded(event:Event):void{
var loader:URLLoader = URLLoader(event.target);
mensagemErro.text = “Email enviado com sucesso”;
}
function onIOError(event:IOErrorEvent):void {
mensagemErro.text = “Erro ao enviar o email”;
}
A função enviar pega todos os itens digitados nos campos e envia os dados. São criadas variáveis para os objetos (nome, email, mensagem) para guardarem o conteúdo dos dados digitados.
