Hurtig Tips Bruk Datagrid Med XML

Jeg skal demonstrere hvordan jeg bruker datagrid-komponenten med en xml-fil. Når du trenger å vise tabelldata, er det ingen raskere og enklere måte enn å bruke datagrid, og når det blir parret med en xml-fil, blir det jo bedre.

---

Trinn 1: Konfigurere Flash-dokumentet

Opprett en ny flash-fil (Actionscript 3.0). Sett dokumentet til 600x400px med en hvit bakgrunn.

Lagre denne filen med navnet xmlDatagrid.fla

---

Trinn 2: Legg til komponenter i dokumentet

Åpne komponentvinduet ved å gå til Meny> Vindu> Komponenter eller trykke Ctrl + F7.

Dra en knapp, en combobox og en datagrid-komponent til scenen.

Slett deretter knappene, combobox og datagrid-komponenter av scenen. de er nå i biblioteket ditt.

Her er en forhåndsvisning av XML-dokumentstrukturen vi skal bruke:

     ja 26,39    ja 34.64  

Kilde nedlastingen inneholder tre XML-filer: flash.xml, ajax.xml, og php.xml; hver følger den samme strukturen som koden ovenfor, men inneholder forskjellige bøker. Du må plassere dem i samme mappe som FLA.

---

Trinn 3: Åpne en ny ActionScript-fil

Åpne en ny handlingskriptfil og lagre den med navnet XMLDataGrid.as

Åpne pakkedeklarasjonen og importer klassene vi skal bruke:

 pakke import flash.display.MovieClip; importer flash.net.URLLoader; importere flash.net.URLRequest; importer flash.events.MouseEvent; importere flash.events.Event; importer fl.controls.DataGrid; importere fl.controls.ComboBox; importere fl.controls.Button;

---

Trinn 4: Utvid MovieClip Class og erklære variabler

Hoveddokumentklassen må utvide enten Sprite eller MovieClip Class; her strekker vi ut MovieClip-klassen. Erklære variablene vi skal bruke:

 pakke public class XMLDataGrid utvider MovieClip var dg: DataGrid; var cb: ComboBox; var urlLader: URLLoader = ny URLLoader (); var loadButton: Button; var bookXML: XML;

---

Trinn 5: Konfigurer Konstruktøren

Her setter vi opp konstruktøren med tre funksjoner vi skal bruke:

 offentlig funksjon XMLDataGrid (): void setupGrid (); setupComboBox (); setupButton (); 

---

Trinn 6: Funksjonsdefinisjoner

Her definerer vi funksjonene vi bruker i konstruktøren:

 privat funksjon setupGrid (): void dg = new DataGrid (); dg.addColumn ( "Tittel"); dg.addColumn ( "lagervare"); dg.addColumn ( "prisen"); // Dette setter størrelsen på datagrid dg.setSize (600,100); // Dette er hvor mange rader du vil at datagrid skal vise dg.rowCount = 5; // Når vi legger til kolumner blir de satt inn i en matrise // Her setter vi den første kolonnen "Tittel" bredde til 450 dg.columns [0] .width = 450; // Dette stiller x- og y-posisjonen til datagrid dg.move (0,100); addChild (dg);  privat funksjon setupComboBox (): void cb = ny ComboBox (); // Dette legger til elementet i comboBox cb.addItem (label: "Flash"); cb.addItem (label: "Ajax"); cb.addItem (label: "Php"); // Dette setter x- og y-posisjonene cb.move (200,50); addChild (cb);  privat funksjon oppsettButton (): void loadButton = ny knapp (); loadButton.label = "Legg inn bøker"; loadButton.addEventListener (MouseEvent.CLICK, loadBooks); loadButton.x = 200; loadButton.y = 325; addChild (loadButton); 

De setupGrid () funksjonen skaper a Datagrid komponent, som viser dataene fra XML-filen vi sender til den.

De setupComboBox () funksjonen skaper a ComboBox, som er en rullegardinliste som vi skal bruke for å la brukeren velge en XML-fil som skal sendes til datanettet.

Knappen opprettet i setupButton () vil bli brukt til å sende XML-filen, som er valgt i kombinasjonsboksen, til datanettet. Vi skriver den koden neste.

---

Trinn 7: Definer loadBooks-funksjonen

Funksjonen loadBooks brukes i eventListener av loadButton.

 privat funksjon loadBooks (e: Event): void // Her cb.selectedLabel returnerer en streng så vi kaller toLowerCase () på den // og legger til .xml til det dvs. hvis 'Flash' er valgt, laster vi 'flash.xml 'urlLoader.load (ny URLRequest (cb.selectedLabel.toLowerCase () + ".xml")); urlLader.addEventListener (Event.COMPLETE, populateGrid); 

---

Trinn 8: Definer populateGrid-funksjonen

Funksjonen PopulateGrid brukes i eventListener av urlLoader i loadBooks-funksjonen.

 privat funksjon populateGrid (e: Event): void var booksXML: XML = new XML (e.target.data); // Hvor mange elementer er i xml filen var booksLength: int = booksXML.book.length (); // Dette fjerner alle tidligere lagt data i datagrid. dg.removeAll (); // Her gikk vi gjennom  noder i xml-filen, og legg til hver som en rad til datagrid for (var i: int = 0; i < booksLength; i++)  dg.addItem(Title: booksXML.book[i].title, InStock: booksXML.book[i].instock,Price: booksXML.book[i].price);   //Close out the class  // This is closing the package out

---

Trinn 9: Sett dokumentklassen og testen

Sett dokumentklassen til "XMLDataGrid" og test filmen!

---

Konklusjon

Her lærte vi at visning av tabluar-data i flash er gjort enkelt med datagrid-komponenten, og at sammenkobling med xml gjør en flott løsning.

Dette er min første opplæring, jeg håper du har lært noe nyttig og takk for å lese!