Share
Mostrerò come utilizzare il componente datagrid con un file xml. Quando è necessario visualizzare i dati tabulari, non esiste un modo più semplice e veloce di usare un datagrid e, se abbinato a un file xml, rende le cose ancora migliori.
Crea un nuovo file flash (Actionscript 3.0). Imposta il documento su 600x400px con uno sfondo bianco.
Salva questo file con il nome xmlDatagrid.fla
Apri la finestra dei componenti andando su Menu> Finestra> Componenti o premendo Ctrl + F7.
Trascina un pulsante, una casella combinata e un componente datagrid sullo stage.
Quindi elimina il pulsante, la combobox e i componenti datagrid dallo stage; sono ora nella tua biblioteca.
Ecco un'anteprima della struttura del documento xml che utilizzeremo:
Apprendimento di ActionScript 3.0: Guida per principianti sì 26.39 Essential ActionScript 3.0 sì 34.64
Il download di origine contiene tre file XML: flash.xml, ajax.xml, e php.xml; ognuno segue la stessa struttura dello snippet sopra, ma contiene libri diversi. Dovrai metterli nella stessa cartella del tuo FLA.
Aprire un nuovo file actionscript e salvarlo con il nome XMLDataGrid.as
Ora apri la dichiarazione del pacchetto e importa le classi che useremo:
package import flash.display.MovieClip; import flash.net.URLLoader; import flash.net.URLRequest; import flash.events.MouseEvent; import flash.events.Event; importare fl.controls.DataGrid; importare fl.controls.ComboBox; importare fl.controls.Button;
La classe del documento principale deve estendere la classe Sprite o MovieClip; qui estendiamo la classe MovieClip. Dichiara le variabili che useremo:
package public class XMLDataGrid estende MovieClip var dg: DataGrid; var cb: ComboBox; var urlLoader: URLLoader = new URLLoader (); var loadButton: Button; var bookXML: XML;
Qui impostiamo il costruttore con tre funzioni che useremo:
funzione pubblica XMLDataGrid (): void setupGrid (); setupComboBox (); setupButton ();
Qui definiamo le funzioni che stiamo usando nel costruttore:
funzione privata setupGrid (): void dg = new DataGrid (); dg.addColumn ( "Title"); dg.addColumn ( "InStock"); dg.addColumn ( "Prezzo"); // Imposta le dimensioni del datagrid dg.setSize (600,100); // Questo è il numero di righe che vuoi che il datagrid mostri dg.rowCount = 5; // Quando aggiungiamo colonne vengono messe in un array // Qui impostiamo la prima colonna "Title" width su 450 dg.columns [0] .width = 450; // Questo imposta la posizione xey del datagrid dg.move (0,100); addChild (dg); private function setupComboBox (): void cb = new ComboBox (); // Aggiunge l'elemento a comboBox cb.addItem (label: "Flash"); cb.addItem (label: "Ajax"); cb.addItem (label: "Php"); // Imposta le posizioni xey cb.move (200,50); addChild (cb); funzione privata setupButton (): void loadButton = new Button (); loadButton.label = "Carica libri"; loadButton.addEventListener (MouseEvent.CLICK, loadBooks); loadButton.x = 200; loadButton.y = 325; addChild (loadButton);
Il setupGrid () la funzione crea a DataGrid componente, che visualizzerà i dati dal file XML che gli passiamo.
Il setupComboBox () la funzione crea a Casella combinata, che è un elenco a discesa che utilizzeremo per consentire all'utente di scegliere un file XML da passare alla griglia di dati.
Il pulsante creato in setupButton () verrà utilizzato per passare il file XML, che viene selezionato nella casella combinata, alla griglia di dati. Scriverò quel codice dopo.
La funzione loadBooks è utilizzata nel eventListener di loadButton.
funzione privata loadBooks (e: Event): void // Qui la cb.selectedLabel restituisce una stringa, quindi chiamiamo aLowerCase () su di esso // e aggiungiamo .xml ad esso, cioè se 'Flash' è selezionato carichiamo 'flash.xml 'urlLoader.load (new URLRequest (cb.selectedLabel.toLowerCase () + ". xml")); urlLoader.addEventListener (Event.COMPLETE, populateGrid);
La funzione populateGrid viene utilizzata nel eventListener di urlLoader nella funzione loadBooks.
funzione privata populateGrid (e: Event): void var booksXML: XML = new XML (e.target.data); // Quanti oggetti ci sono nel file xml var booksLength: int = booksXML.book.length (); // Questo rimuove tutti i dati aggiunti in precedenza nel datagrid. dg.removeAll (); // Qui scorriamo attraverso ilnodi nel file xml e aggiungere ciascuno come una riga al datagrid per (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
Impostare la classe del documento su "XMLDataGrid" e testare il film!
Qui abbiamo appreso che la visualizzazione dei dati di tabluar in flash è facilitata dal componente datagrid e che l'abbinamento con xml rappresenta un'ottima soluzione.
Questo è il mio primo tutorial, spero che tu abbia imparato qualcosa di utile e grazie per la lettura!
Accentsconagua