E-learn.ro
Panou utilizatori
Utilizator Parola
Creeaza cont nou    Recupereaza parola
Login
Newsletter
Introdu adresa ta de email
Inscrie-te
Inchide panoul de utilizatori
Add to Google

Tutoriale Adobe Flash

Descarca toolbar

Toolbar E-learn.ro Facebook Twitter

GRAFICA 2D  /  Adobe Flash  /  Comunicare cu XML (3)

Construirea unei agende folosind XML

25.09.2008
Construirea unei agende folosind XML

De ce se foloseste Flashul de XML? Ei bine, obiectul Flash este un obiect compilat si din acest motiv nu prea avem cum sa modificam informatiile existente in cadrul sau.

Total vizualizari: 7157 7157 afisari   |   Comentarii  0   |   Rating   |   (8 voturi)   |   Timp necesar: 25 min 25 min   |   Nivel de cunostiinte necesar: Mediu  Mediu

Sursa:  Thor.info.uaic.ro  
Autor:  Cosmin Varlan
Adauga la tutoriale favorit Adauga la tutoriale favorite
Pagina:
« 1 2
comenteaza printeaza

In Flash, pentru a putea parcurge arborele XML trebuie ca acesta sa fie incarcat complet in memorie (parsare DOM).

Felul in care va definiti XML-ul (ca in primul caz sau ca in al doilea) este la latitudinea dumneavoastra. Ar fi bine totusi ca marcajele sa exprime corect informatiile din interiorul lor (de exemplu marcajul telefon chiar sa contina numarul de telefon si nu adresa de mail).

De ce se foloseste Flashul de XML ? Ei bine, obiectul Flash este un obiect compilat si din acest motiv nu prea avem cum sa modificam informatiile existente in cadrul sau. Sa zicem ca am avea o agenda facuta in Flash, fara a utiliza XML. Acest lucru ar insemna ca avem toate informatiile (numele persoanelor, telefoanele) scrise direct in codul sursa (probabil ca variabile sau ca tablouri). Ce se intampla atunci cand vrem sa adaugam o noua persoana ? Vom cauta sursa Flash-ului (si ne vom bucura daca o mai gasim), vom adauga noua variabila, va trebui sa recompilam obiectul Flash (asta evident daca avem Flash-ul instalat) dupa care sa-l punem din nou pe serverul pe care se afla initial.

Fisierul XML poate fi modificat cu un simplu editor si acest lucru se poate realiza si direct pe server. Obiectul Flash care se foloseste de XML va trebui apoi doar sa reincarce XML-ul updatat si sa-l afiseze ca atare.

Sa construim obiectul Flash care folosindu-se de XML-ul "agenda.xml" afiseaza intr-un mod placut continutul agendei dumneavoastra. Pentru inceput vom seta scena la 640x480 si din fereastra cu componente vom aduce in scena un obiect de tipul DataGrid (printr-o operatie drag & drop). Din fereastra de proprietati vom schimba dimensiunile componentei la 600 (lungime) respectiv 400 (inaltime) si-i vom asocia numele de instanta "dg".

Sa trecem la incarcarea XMLului din exterior. Pentru inceput vom defini obiectul XML si il vom incarca din exterior. Pentru a ne convinge ca XML-ul a fost incarcat vom executa comanda trace avand ca parametru chiar obiectul XML. Asadar, in primul cadru al Flash-ului (aveti grija sa nu scrieti codul decat daca aveti selectat cadrul si nu componenta "dg"):

var arbore_xml = new XML();
arbore_xml.load("agenda.xml");
trace(arbore_xml);

Executand Flash-ul probabil ca va veti astepta ca in fereastra Flash sa fie afisat continutul XML-ului. Ei bine, acest lucru nu se va intampla. Sa vedem de ce... si aici este de fapt explicatia pentru care atator de multe persoane XML-ul li se pare extraordinar de greu de utilizat cu Flash-ul. Asa cum am zis putin mai devreme, pentru a fi utilizat de Flash XMLul trebuie sa fie complet incarcat in memorie. Operatiile din ActionScript sunt executate destul de rapid si intre comanda de incarcare a XMLului si cea de afisare a lui nu va trece decat cateva milisecunde (si motivul este evident: obiectul Flash trebuie sa treaca rapid la urmatorul cadru al animatiei si nu are timp sa stea dupa XML sa se incarce de pe Internet poate in cateva secunde bune).

Totusi ce face Flash-ul pentru a prelucra cum trebuie XML-urile ? Ei bine, inainte de a se incepe incarcarea XML-ului, se incarca in memorie o functie care se va executa numai in momentul in care XMLul s-a incarcat in intregime. Sa refacem codul de mai sus pentru a functiona corect:

var arbore_xml = new XML(); 
arbore_xml.onLoad = function(){
    trace(arbore_xml);
};
arbore_xml.load("agenda.xml");

Inlocuind scriptul cu noul script, la compilarea Flash-ului veti obtine intr-o fereastra continutul XMLului. Imediat dupa definirea obiectului (respectiv inaintea functiei onLoad) vom adauga urmatorul cod:

arbore_xml.ignoreWhite = true;
_root.dg.addColumn("Nume");
_root.dg.addColumn("Telefon");
dg.setSize(600, 400);
dg.getColumnAt(0).width = 400;
dg.getColumnAt(1).width = 180;

Prin intermediul acestui cod vom ignora spatiile albe din interiorul XMLului (Flash-ul nu stie sa trateze caracterele spatiu, enter sau tab aflate in fata marcatorilor sau intre ei si din acest motiv acestea trebuie eliminate prin executia comenzii ignoreWhite. Comenzile urmatoare au rolul de a adauga componentei DataGrid doua coloane intitulate "Nume" si "Telefon" si de a le redimensiona astfel incat numele sa incapa in intregime in coloana asociata lui.

Revenim la functia onLoad in care stim ca XMLul este disponibil si putem sa extragem din el datele:

arbore_xml.onLoad = function(){
    for (i=0; i < this.firstChild.childNodes.length; i++){
    nume = this.firstChild.childNodes[i].firstChild.firstChild.nodeValue;
    telefon = this.firstChild.childNodes[i].lastChild.firstChild.nodeValue;
    dg.addItem({Nume:nume, Telefon:telefon});
    }
};

Sa vedem cati pasi face instructiunea "for". Sa presupunem ca avem n persoane, copii ale nodului "agenda". In cadrul functiei onLoad, prin "this" se identifica obiectul arbore_xml. For-ul principal merge de la 0 pana la valoarea mai mica decat this.firstChild.childNodes.length. Prin firstChild se identifica nodul-radacina (agenda) apoi prin childNodes se gaseste un sir de elemente, fiecare element avand asociat subarborele unei anumite persoane.

Pentru a identifica cate elemente sunt in acest sir, interogam proprietatea length specifica array-urilor. Pentru a prelua numele din obiectul XML navigam spre primul nod (agenda) apoi construim array-ul prin intermediul childNodes si selectam elementul de pe pozitia [i] (respectiv 0,1,2... depinde de al catelea nodpersoana este procesat) apoi din nodul-persoana selectat preluam primul nod (respectiv nodul nume) si din nou primul nod pentru a ajunge la nodul de tip text ce reprezinta numele propriu-zis. Pentru a extrage valoarea apelam nodeValue.

Initial in XMLul nostru aveam trei persoane si din acest motiv for-ul va merge de la 0 pana la 2 (0, 1, 2) identificand pe rand cele trei persoane din XML. Odata cu adaugarea unui nou nod-persoana, for-ul va functiona de la 0 pana la 3 (0, 1, 2, 3) si va prelua pe rand informatiile despre toate persoanele existente in XML.

In cazul in care se opteaza pentru cel de-al doilea tip de XML (cel in care numele si telefonul sunt date ca atribute), singurele linii ce trebuiesc schimbate sunt cele privitoare la preluarea informatiilor din XML (respectiv liniile in care se dau valori numelui si telefonului). Acestea vor deveni:

nume = this.firstChild.childNodes[i].attributes.nume; 
telefon = this.firstChild.childNodes[i].attributes.telefon;

Ca exercitiu, construiti un nou XML in care sa se deosebeasca clar numele, prenumele, telefonul si adresa de e-mail la care poate fi contactata o persoana, ca in imaginea de mai jos:


Construirea unei agende folosing XML
Pagina:
« 1 2
comenteaza printeaza
Alte tutoriale Adobe Flash:
Noteaza acest tutorial
Rating tutorial
 
(8 voturi)
Pentru a nota acest tutorial, trebuie sa fii logat!
Posteaza un comentariu
Pentru a posta un comentariu, trebuie sa fii logat!
0 TOP UTILIZATORI* 0 0
Tutoriale scrise de claibornelara
claibornelara Rang utilizator claibornelara - Incepator
4430
Tutoriale scrise de mcuemica
mcuemica Rang utilizator mcuemica - Incepator
4330
Tutoriale scrise de ellarichards
ellarichards Rang utilizator ellarichards - Incepator
4290
Tutoriale scrise de emonclercheap
emonclercheap Rang utilizator emonclercheap - Incepator
4130
Tutoriale scrise de kheops
kheops Rang utilizator kheops - Mediu
4084
* Acest top reprezinta punctajele acumulate in ultimele 30 de zile.
SWF XML Java Ruby on Rails Sony Vegas Photoshop PHP Javascript Python Fotografie Dreamweaver AJAX Word StyleSheet Outlook Vista HTML SEO Fireworks Verilog RoR Gimp Lightroom Swift 3D Illustrator Bridge Powerpoint XHTML COREL DRAW CSS Excel JSON Flash PSD Action Script MySQL
Promovare:
Daca faci parte din comunitatea E-learn.ro si doresti promovarea acesteia, poti accesa pagina de promovare.
Arhiva newsletter:
Daca ai ratat un numar mai vechi, sau vrei sa revezi care au fost noutatile E-learn.ro la un moment dat, poti accesa arhiva de newslettere.
  Copyright © 2008-2013 E-LEARN.ro. Toate drepturile rezervate. Termeni si conditii.
Conceput si realizat de Neokinetics Software