DevSecOps

8 set, 2011

Leitor de XML no Flash ActionScript 3.0

Publicidade

Depois de criar modificações
no slideshow do Flash 8 ActionScript 2.0 Image, eu queria começar do zero com o AS3. AS3 é muito diferente do AS2, pois a curva
de aprendizado não é tão simples, mas vale a pena. Eu gostaria de recomendar
alguns livros para ajudá-lo na iniciação do AS3: Essential ActionScript 3.0
por Colin Moock e Learning ActionScript 3.0: A Beginners
Guide
por Rich Shupe e Zevan Rosser. 

Este
é meu primeiro artigo sobre XML/Flash
Slideshow em ActionScript 3.0. Aqui, estarei focando em como
configurar o arquivo XML no seu flash, e em como movimentar-se através dos nodes
XML no seu arquivo flash e fazê-los aparecer.

Primeiramente, como
configurar seu arquivo XML. Usei muitos exemplos do livro do Colin Moock para
mostrar como fazer isso. De forma alguma meu jeito de fazer as coisas é a
único correta, porque o XML é bastante flexível. Eu configuro meu arquivo XML
abrindo com “imagens” node pais, e então coloco todos os atributos em cada node
“imagem”. O AS3 permite extrair facilmente as variáveis, e é por isso que
configuro dessa forma. Abaixo, uma screenshot:

A seguir, configuro meu arquivo AS3. Abro um novo documento AS3 e
crio dois movieclips aos quais dei os nomes de prevBtn e nextBtn. Não
configurei meu código em OOP, isso fará parte de um próximo artigo. Eu somente
quis aqui fazer algo básico para ajudar as pessoas a se iniciarem no processo.
Também acrescentei um campo de texto dinâmico e dei-lhe o nome de “image Text”.

Passo 1: Declare suas variáveis. Aqui é onde configuro meu Loader e instâncias XMLList. Também configuro o slideNum que
usarei para fixar a posição ou indexar o array.

[as]
//variables
var xmlList:XMLList;
var mcLoader:Loader;
var slideNum:Number = 0;
[/as]

Passo 2: Carregar o XMLnow. Configuro a solicitação do loader para o XML, e uma vez que o
carregamento termine usando o EvenListener, digo ao flash para puxar nome do
atributo do primeiro node no meu arquivo XML e o coloco no campo de texto
dinâmico chamado imageText.

[as]//loads xml and assigns the text field the first node using the slideNum variable from above
var xml:XML = new XML();
var loader:URLLoader = new URLLoader();
loader.load(new URLRequest(“images.xml”));
loader.addEventListener(Event.COMPLETE,
function(evt:Event):void {
xml = XML(evt.target.data);
xmlList = xml.children();
trace(xmlList);
imageText.text = xml.image[slideNum].@name.toString();
}
);[/as]

Passo 3: Adicionar Event ListenersNow. Estou dizendo ao
flash para executar uma função sempre
que o usuário der um click. Assim, se um usuário clicar em nextBtn, a função
onClickNextSlide será executada. Essa é uma das maiores mudanças do AS3. Sempre
que um botão é criado, deve sempre também se atribuir a ele um event
listener. Dessa forma, há muito
mais flexibilidade.

[as]
//stage event listeners for the movieClip buttons
nextBtn.addEventListener(MouseEvent.CLICK, onClickNextSlide);
prevBtn.addEventListener(MouseEvent.CLICK, onClickPrevSlide);
[/as]

Passo 4: Change Text Function.  Esta função funciona com os botões. O texto mudará
baseado no slideNumvar com que a função é alimentada através do botão de
funções a seguir:

[as]
//this function will change the text depending upon which number is fed to the var slideNum in the onClickNextSlide function
function changeText(slideNum:Number):void {
imageText.text = xml.image[slideNum].@name.toString();
}
changeText(0);
[/as]

Passo 5: O botão da função FunctionsThe onClickNextSlide aumenta a variável slideNum a cada clique. Se
o slideNum alcança 4 (o número total de nodes), então ele começa em 0. A função
onClickPrevSlide faz o reverso.

[as]
//this function adds 1 to the current number, if the current number is 4, it starts over
function onClickNextSlide(event:MouseEvent):void {
slideNum++;
trace(slideNum);
if (slideNum == 4) {
slideNum = 0;
}
changeText(slideNum);}
// this function dos the opposite of the one above, it subtracts 1 to current number, when it reaches 0 it starts back at 4
function onClickPrevSlide(event:MouseEvent):void {
slideNum–;
trace(slideNum);
if (slideNum == 0) {
slideNum = 4;
}
changeText(slideNum);}
[/as]

Há alguns problemas
conhecidos que vou consertar e depois republicar. Sei que atualmente se você
tentar voltar quando o flash carrega pela primeira vez, isso não funcionará. O
botão voltar somente funciona depois que você vai primeiro para frente. Se
alguém tiver uma solução, por favor, coloque nos comentários. Aqui está
um exemplo do arquivo de trabalho: View Demo

 ?

Texto original disponível em http://onerutter.com/flash/flash-actionscript-30-xml-text-array-loader.html