Carregar um arquivo XML no Flash e exibir suas informações

Esse artigo mostrar como carregar e exibir as informações de um arquivo XML no Flash.

Por | @oficinadanet Softwares
E ai galera meu primeiro artigo sobre ActionScript  vou começar mostrando como receber dados de em arquivo XML e carregá-los na sua apresentação.
Nos próximos artigos , mostrarei como receber dados de um servidor e de um banco de dados de uma forma mais dinâmica, mas vamos começar do principio.

Primeiro vamos definir a estrutura do nosso arquivo XML.



    
    
    
    ...
    
    



Vamos construir um nó pai e dentro dele nós colocaremos as notícias com o atributo título e com o conteúdo entre as duas tags.
o parâmetro fala para o parser do XML que esse conteúdo não deve ser interpretado, isso nos possibilita utilizar caracteres especiais que o parser interpretaria como ( <, >, &, etc. ).


agora no Flash abra um novo documento e no primeiro frame e coloque o seguinte action.

    // configurando o objeto notícias
    // cria o objeto XML que vai carregar o arquivo noticias.xml
    var noticias:XML = new XML();

    // dizemos para o objeto notícias ignorar os espaços em branco entre as tags
    noticias.ignoreWhite = true;

    // definimos o evento que será disparado quando o objeto "noticias" terminar de carregar as notícias
    noticias.onLoad = function(sucesso:Boolean) {
        // se "sucesso" for verdadeiro significa que o arquivo foi carregado e podemos mostrar o conteúdo dele
        if (sucesso) {
            listarNoticias();
        } else {
            // avisa que ocorreu algum erro durante o carregamento
            trace("erro ao carregar o arquivo noticias.xml");
        }
    };

    //
    // criamos os TextFields para exibir as informações
    _root.createTextField("tfLista", _root.getNextHighestDepth(), 5, 5, 120, 390);
    _root.createTextField("tfConteudo", _root.getNextHighestDepth(), 130, 5, 360, 390);
    // formatamos os TextFields
    _root.tfLista.border = true
    _root.tfLista.background = true;
    _root.tfLista.color = 0x000000
    _root.tfLista.html = true
    _root.tfLista.multiline = true
    _root.tfLista.selectable = false
    //
    _root.tfConteudo.border = true
    _root.tfConteudo.background = true;
    _root.tfConteudo.color = 0x000000
    _root.tfConteudo.html = true
    _root.tfConteudo.multiline = true
    _root.tfConteudo.wordWrap = true
    _root.tfConteudo.selectable = true

    //
    // FUNÇÕES
    // função para mostra a lista de notícias carregadas
    function listarNoticias():Void {
        // variáveis temporárias
        var i:Number = 0;
        var titulo:String;
        var totalNoticias:Number = noticias.firstChild.childNodes.length;
        // definimos como "" o "tfLista" para tirar algum texto que não deva estar ali
        _root.tfLista.htmlText = "";
        // aqui nos fazemos um loop para colocar os títulos de cada notícia no "tfLista" e definimos o link
        while (i             // achamos o titulo na notícia "i"
            titulo = noticias.firstChild.childNodes.attributes.titulo;
            // inserimos no tfNoticias o titulo da notícia "i" com um link para mostrar a notícia
            _root.tfLista.htmlText += ''+titulo+'n';
            // vamos para a próxima notícia
            i++;
        }
    }
    // função para mostrar uma notícia selecionada
    function mostraNoticia(i:Number):Void {
        var titulo:String;
        var conteudo:String;
        titulo = noticias.firstChild.childNodes.attributes.titulo;
        conteudo = noticias.firstChild.childNodes.firstChild.nodeValue;
        // Mostramos a notícia
        tfConteudo.htmlText = ''+titulo+'

'+conteudo;
    }
    //
    // carregamos o arquivo noticias.xml
    noticias.load("noticias.xml");


Agora do começo. ^^
Primeiro nos instanciamos um objeto xml que será utilizado para carregar os dados no arquivo noticias.xml.

    // cria o objeto xml que vai carregar o arquivo noticias.xml
    var noticias:XML = new XML();


Agora podemos configurar e definir os eventos que serão utilizados

    // "dizemos" para o objeto noticias que ignore os espaços em branco entre as tags
    noticias.ignoreWhite = true;

    // definimos o evento que será disparado quando o objeto “noticias” terminar de carregar as notícias
    noticias.onLoad = function(sucesso:Boolean) {
        // se "sucesso" for verdadeiro significa que o arquivo foi carregado e podemos mostrar o conteúdo dele
        if (sucesso) {
            listarNoticias();
        } else {
            // avisa que ocorreu algum erro durante o carregamento
            trace("erro ao carregar o arquivo noticias.xml");
        }
    };


Então criamos dois TextFields "tfLista" ( para listar as notícias e vai servir de menu de navegação ) e "tfConteudo" ( para exibir o conteúdo da notícia selecionada )

    _root.createTextField("tfLista", _root.getNextHighestDepth(), 5, 5, 120, 390);
    _root.createTextField("tfConteudo", _root.getNextHighestDepth(), 130, 5, 360, 390);


O próximo passo é formatar os TextFields para receber os conteúdos.
   _root.tfLista.border = true
    _root.tfLista.background = true;
    _root.tfLista.color = 0x000000
    _root.tfLista.html = true
    _root.tfLista.multiline = true
    _root.tfLista.selectable = false
    //
    _root.tfConteudo.border = true
    _root.tfConteudo.background = true;
    _root.tfConteudo.color = 0x000000
    _root.tfConteudo.html = true
    _root.tfConteudo.multiline = true
    _root.tfConteudo.wordWrap = true
    _root.tfConteudo.selectable = true


Agora as funções que farão a mágica acontecer.
A primeira função lista todos os títulos no "tfLista" no formato HTML, note o parâmetro href da tag :
'
' + titulo + 'n';
asfunction é um protocolo interno do flash parecido com o "javascript:" que usamos nos links HTML quando queremos que um link chame uma função JavaScript só que asfunction roda internamente no Flash e só pode chamar uma função apenas.

ex.:
Alerta!!!


   // função para mostrar as notícias carregadas
    function listarNoticias():Void {
        // variáveis temporárias
        var i:Number = 0;
        var titulo:String;
        var totalNoticias:Number = noticias.firstChild.childNodes.length;
        // definimos como "" o "tfLista" para tirar algum texto que não deva estar ali
        _root.tfLista.htmlText = "";
        // aqui nos fazemos um loop para colocar os títulos de cada notícia no "tfLista" e definimos o link
        while (i             // achamos o titulo na notícia "i"
            titulo = noticias.firstChild.childNodes.attributes.titulo;
            // inserimos no tfNoticias o titulo da notícia "i" com um link para mostrar a notícia
            _root.tfLista.htmlText += ''+titulo+'n';
            // vamos para a próxima notícia
            i++;
        }
    }


A segunda é a responsável por mostrar a notícia selecionada, ela recebe a posição da noticia no xml e mostra o conteúdo no "tfConteudo".

    // função para mostrar uma notícia selecionada
    function mostraNoticia(i:Number):Void {
        var titulo:String;
        var conteudo:String;
        titulo = noticias.firstChild.childNodes.attributes.titulo;
        conteudo = noticias.firstChild.childNodes.firstChild.nodeValue;
        // Mostramos a notícia
        tfConteudo.htmlText = ''+titulo+'

'+conteudo;
    }


E por fim carregamos o arquivo noticias.xml

    noticias.load("noticias.xml");


Bom, é isso.

Espero ter ajudado um pouco, caso tenham dúvidas postem aqui ou mandem no e-mail. responderei o mais rápido possível.

Até a próxima.

link falando sobre CDATA.
target="_blank">http://www.w3schools.com/xml/xml_cdata.asp

Mais sobre:
Share Tweet
DESTAQUESRecomendadoMais compartilhados
Comentários
AINDA NÃO SE INSCREVEU?

Vem ver os vídeos legais que
estamos produzindo no Youtube.