Začínáme s Flash MX 2004 – 17. díl – načítání XML dat

V dnešním díle převedeme externí soubor data.txt do XML formátu. Naučíme se několik základních příkazů pro zpracování načtených dat.

XML

Převod zdrojových dat do XML formátu je logickým vyústěním naší práce. Jedná se o přehledný a snadno využitelný formát dat. Pokud máte zájem se blíže seznámit s pravidly používání a publikování dokumentů v XML, je vám podrobná specifikace XML formátu dostupná na této adrese.

Data.xml

Nejdříve si přepíšeme veškerá data do XML formátu. Výsledný soubor bude vypadat následovně:

<?xml version="1.0"?>
<dataxml>
<text cislo="1">
<p class="nadpis">Úvodní nadpis</p>
<p class="subnadpis">Úvodní text k první straně</p>
<img align="left" hspace="10" vspace="10" src="pic1.jpg"></img>
<p class="text1">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur feugiat dui ut odio. Sed tempor urna. Cras vitae est a pede venenatis mattis. Fusce sed lorem. Curabitur vestibulum lectus et arcu. Sed a lectus ac nisl volutpat luctus. Quisque condimentum, enim at facilisis iaculis, dolor orci feugiat mi, scelerisque hendrerit enim lacus dignissim enim. Fusce elementum, magna quis ultricies dignissim, ligula mauris rutrum urna, eu convallis arcu magna consectetuer leo. Suspendisse accumsan dictum nisl. Suspendisse lacus tellus, laoreet at, lobortis pharetra, rutrum a, leo. Maecenas ante nisl, aliquet at, placerat at, interdum tristique, sapien. Ut a massa. Duis venenatis turpis ut pede. Curabitur viverra.</p>
</text>
<text cislo="2">
<p class="nadpis">Nadpis k druhé straně</p>
<p class="subnadpis">Text druhé strany</p>
<img align="left" hspace="10" vspace="10" src="pic2.jpg"></img>
<p class="text1">Quisque a urna a tellus placerat mollis. Morbi varius, est vitae tempor tincidunt, odio sem tincidunt odio, vel dapibus lorem elit vitae mauris. Nunc mattis mi a urna. Proin ac tellus. Phasellus pellentesque. Donec convallis consectetuer eros. Quisque laoreet. Nam lectus nibh, convallis id, ornare eget, consequat ac, nibh. Sed semper enim placerat urna. Integer sollicitudin tincidunt augue. Aenean sit amet mi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam sed velit. Mauris at odio. Sed vel nunc quis erat lobortis fermentum. Curabitur quam. Aenean tristique malesuada lectus</p>
</text>
<text cislo="3">
<p class="nadpis">Nadpis třetí strany</p>
<p class="subnadpis">Text strany tři, této jednoduché prezentace</p>
<img align="left" hspace="10" vspace="10" src="pic3.jpg"></img>
<p class="text1">Donec nibh diam, posuere a, congue feugiat, fringilla eget, ligula. Curabitur pharetra, est eu vulputate laoreet, orci lacus molestie orci, eu consectetuer erat est et elit. Ut elementum tortor sed felis. Integer nonummy metus. Curabitur ultricies pede in odio. Vestibulum commodo sagittis turpis. Maecenas dolor massa, porttitor nec, tempus vel, ultricies vitae, ante. Curabitur eu nibh non mauris ornare ornare. Cras justo leo, posuere in, tristique non, laoreet vitae, odio. Mauris ultrices accumsan velit. Fusce neque. Praesent est risus, condimentum ac, pretium non, rhoncus et, sapien. Donec pharetra tortor nec lorem. Duis ac nisl. Suspendisse metus diam, varius sit amet, sollicitudin ut, varius quis, odio. Morbi quam mi, bibendum id, condimentum in, interdum euismod, pede. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque mauris. Morbi ornare scelerisque urna. Phasellus tincidunt.</p>
</text>
</dataxml>

Otevřeme nový soubor v poznámkovém bloku, zkopírujeme výše uvedená data a uložíme je jako data.xml. Obrázky můžete stáhnout zde: pic1, pic2 a pic3.

Otevřeme si nyní soubor data.xml v internetovém prohlížeči a podíváme se na strukturu podrobněji. Hned na prvním místě vidíme deklaraci XML dokumentu. Následuje první tag „dataXML“, který v sobě obsahuje veškerá konfigurační data, která budeme potřebovat.

Data máme rozdělená do tří tagů „text“, kde každý tag má jiný atribut „cislo“.

Tento atribut reprezentuje jednotlivé strany naší prezentace a vztahuje se tak k příslušnému textu. Takto jsme provedli jiný zápis původních proměnných „text1, text2 …“

Každý tag „text“ dále obsahuje jednotlivé elementy <p> a <img> které definují strukturu příslušného textového pole.

Výhoda této struktury spočívá v tom, že můžeme bez problémů data načíst a přímo je vložit do textového pole, bez jakýchkoliv dalších zásahů do kódu.

Flash nám ale umožňuje mnohem komfortnější práci s XML dokumenty. Základní operaci si ukážeme nyní.

Načítání XML dat

Otevřeme si ukázkový soubor z minulé lekce a podíváme se na akce v prvním snímku vrstvy, kterou jsme si vyhradili pro psaní AS. Celý kód přepíšeme tímto scriptem:

textData = new XML();
textData.ignoreWhite = true;
textData.load("Data.xml");
textData.onLoad = function() {
  node1 = textData.firstChild;
  node1Name = node1.nodeName;
  if (node1Name == "dataXML") {
    nodArray = node1.childNodes;
    if (nodArray.length != 0) {
      x = 0;
      a = 0;
      textArray = new Array();
      do {
        if (nodArray[x].nodeName.indexOf("text") != -1) {
          num = nodArray[x].attributes.cislo;
          textArray[new Number(num.toString())] = nodArray[x];
        }
        x++;
      } while (x<nodArray.length);
    }
  }
};
stop();

Co se v něm děje? Nejprve si vytvoříme objekt, do kterého později načteme data z XML souboru. Další krok je nutné provádět až po kompletním načtení celého soboru, proto nejdříve testujeme, zda jsme úspěšně načetli veškerá data z XML souboru.

Pokud jsme načetli data, použijeme první vlastnost „firstChild“, která nám umožňuje přečíst první tag objektu. Ujistíme se, že se jedná opravdu o tag „dataXML“ a vytvoříme si pole „nodArray“, které obsahuje všechny nižší tagy – „text“.

Prvky pole „nodArray“ tak obsahují celé tagy „text“, kde číslo prvku pole odpovídá atributu tagu „cislo“. Jakmile máme naplněné pole, vyjmeme z něj příslušné texty, podle atributu „cislo“, a uložíme je do pomocného pole „textArray“, na které se budeme odkazovat z hlavního menu prezentace.

Máme načteny data z XML souboru a extrahovali jsme si z nich texty, které jsou uloženy v poli „textArray“. Protože jsme elementy tagů „text“ pojmenovali pomocí html značek, můžeme nyní do textového pole načíst přímo celé elementy, které se v textovém poli zformátují podle předem nastavených css stylů.

Úprava dalších částí kódu

Protože jsme přidali nové pole, ze kterého budeme brát texty, musíme upravit zdrojový kód v ovládání menu. Přesuneme se proto na druhý snímek hlavní osy, otevřeme si objekt „menu“ a zobrazíme si akce prvního snímku tohoto klipu.

Původní část skriptu:

if (this._parent.textData.text1 != undefined) {
  this._parent.obsah.textObsah.htmlText = this._parent.textData.text1;
} else {
  this._parent.obsah.textObsah.htmlText = " ";
}

Nahradíme novou, která již bere texty z nového pole.

if (this._parent.textArray[1] != undefined) {
  this._parent.obsah.textObsah.htmlText = this._parent.textArray[1];
} else {
  this._parent.obsah.textObsah.htmlText = " ";
}

Musíme ale ještě opravit akce na tlačítkách menu. Klikneme tedy na první tlačítko, otevřeme si panel akcí a původní podmínku:

on (release) {
  this._parent.obsah.textObsah.html = true;
  if (this._parent.textData.text1 != undefined) {
    this._parent.obsah.textObsah.htmlText = this._parent.textData.text1;
  } else {
    this._parent.obsah.textObsah.htmlText = " ";
  }
}

Nahradíme novou:

if (this._parent.textArray[1] != undefined) {
    this._parent.obsah.textObsah.htmlText = this._parent.textArray[1];
  } else {
    this._parent.obsah.textObsah.htmlText = " ";
  }

Další tlačítka opravíme ve stejném smyslu, s tím rozdílem, že změníme pouze příslušné číslo v poli.

V příštím díle se zaměříme na horní menu, které budeme generovat podle dat, obsažených v našem zdrojovém XML dokumentu. Připojíme také preloadery k textovým polím, abychom zajistili správné zobrazení požadovaných textů.

Diskuze (8) Další článek: Internetoví uživatelé jsou opatrnější. Dostatečně?

Témata článku: Software, Programování, Flash, Textové pole, Elite, Arca, Díl, Elsa, Původní data, Podrobná specifikace, Eros, Leo, Magna, Úvodní text, Pole, První snímek, Undefined, Původní objekt, Načítání, ETA, XML, Magnum


Určitě si přečtěte

Měření rychlosti internetu: Populární Speedtest.net neřekne o skutečné rychlosti internetu téměř nic

Měření rychlosti internetu: Populární Speedtest.net neřekne o skutečné rychlosti internetu téměř nic

** Speedtest stále častěji měří jen rychlost na poslední míli ** Ta však ale neodpovídá reálnému surfování ** Jak se tedy pokusit změřit tu skutečnou?

Jakub Čížek | 85

Co je TikTok: Svérázná sociální síť chytla mladé uživatele, už jich má už 1,5 miliardy

Co je TikTok: Svérázná sociální síť chytla mladé uživatele, už jich má už 1,5 miliardy

** Sociální síť TikTok získala stamiliony uživatelů a stále roste ** Jaký obsah na ní najdete a co můžete v jejím rámci čekat? ** Je to zábava pro mladé, nebo platforma pro úchyláky?

Karel Kilián | 37

Wi-Fi 6 konečně začíná dostávat smysl. Poradíme, jak ji využít

Wi-Fi 6 konečně začíná dostávat smysl. Poradíme, jak ji využít

** Na trh míří první levné Wi-Fi 6 routery ** Nabídka zařízení, zejména notebooků, každý den roste ** Poradíme, jak nejlépe přejít s domácností na Wi-Fi 6

Tomáš Holčík | 31



Aktuální číslo časopisu Computer

Test 9 bezdrátových reproduktorů

Jak ovládnout Instagram

Test levných 27" herních monitorů

Jak se zbavit nepotřebných věcí na internetu