Mit Hilfe von DataGrid kann man relative einfach entsprechende Daten tabelarisch darstellen.
Man kann wie bei einer Tabellenkalkulation Einträge hinzufügen, entfernen und auch ändern.
Es ist auch möglich Grafiken, Animationen und andere Daten in den jeweiligen Zellen anzeigen zu lassen.
Dieser Artikel beschäftigt sich jedoch nur mit den Grundlage für DataGrid.
Inhalt
Hinzufügen der DataGrid Komponente
Definieren der DataGrid Komponente
Definieren eines DataProviders
Hinzufügen von Einträgen eines DataProviders
Entfernen von Einträgen eines DataProviders
Ändern von Einträgen eines DataProviders
Wie bereits erwähnt ist die DataGrid Komponente eine Art Tabelle die in Flash verwendet werden kann.
Um einen ersten Eindruck zu erhalten anbei ein entsprechendes Beispiel wie dieses aussehen kann.
Es bestehen viele Einstellungsmöglichkeiten und Formatierungsmöglichkeiten ein DataGrid so darzustellen wie es gewünscht ist.
Dieses Beispiel erlaubt das sortieren, ändern von Werten sowie Spalten in der Größe zu verändern.
Es gibt mehrere Möglichkeiten die DataGrid Komponente zu verwenden, falls man mit dem Flash Editor arbeitet muss diese auf jeden Fall in der eigenen Library kopiert werden.
Hierzu wird das Komponentenfenster geöffnet und die DataGrid Komponente einfach in die entsprechenden Library gezogen.
Anschließend sollte die DataGrid Komponente und weitere grafische Element in der Library angezeigt werden.
Es ist natürlich nur nötig eine Kopie der DataGrid Komponente in der Library zu besitzten auch wenn mehrere verschiedene DataGrid's verwendet werden.
Sollte dieser Schritt vergessen worden sein, so gibt der Flash Editor in der Regel folgende Fehlermeldung aus:
...
1172: Definition fl.controls:DataGrid could not be found.
1046: Type was not found or was not a compile-time constant: DataGrid.
1180: Call to a possibly undefined method DataGrid.
1120: Access of undefined property DataGrid.
...
Nachdem die DataGrid Komponente in der Library vorhanden ist, so kann über fl.controls.DataGrid auf diese Komponente zugegriffen werden.
Die meisten Entwickler erstellen rein über ActionScript das entsprechende Objekte und plazieren dieses auf der Bühne.
Der Vorteil dieser Methode ist, das Änderungen sehr einfach im ActionScript vorgenohmen werden können auch für mehrere Objekte gleichzeitig.
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(250,250);
dg_test.move(10,10);
dg_test.columns=[new DataGridColumn("Spalte 1"),new DataGridColumn("Spalte 2")];
dg_test.editable = false;
this.addChild(dg_test);
Dieses einfache Beispiel definiert ein neues DataGrid names dg_test.
dg_test wird dann auf die Größe 250x250 gesetzt und anschließend an die Position 10:10 verschoben.
Danach werden die zwei Spalten Spalte 1 und Spalte 2 definiert.
Mit dg_test.editable = false; erlauben wir kein editieren des DataGrid's.
Damit das DataGrid Objekt nun auch noch sichbar wird, wird es einfach mit addChild der Bühne hinzugefügt.
Der DataProvider besitzt keine grafischen Elemente sondern stellt nur eine Art Datenbank da.
Er ist keine eigene Komponente, jedoch benötigt der DataProvider eine Komponente welche die entsprechende Klasse zur Verfügung stellt.
Der DataProvider wird rein über ActionScript initalisiert und wird auch von anderen Komponenten unterstützt bzw. verwendet z.B: der ComboBox.
Eine Zuweisung mit einem DataGrid geschied mit dem Befehl .dataProvider=....
import fl.data.DataProvider;
var dp_test:DataProvider = new DataProvider();
/* Zuweisung zu einem DataGrid */
dg_test.DataProvider = dp_test;
Da dieser DataProvider keine Einträge enthält würde bei einer Kombination mit dem vorherigen Beispiel eine leeres DataGrid erscheinen.
Falls keine Komponente vorhanden ist welche die DataProvider Klasse zur verfügung stellt, erhält man in der Regel folgende Fehlermeldungen:
...
1172: Definition fl.data:DataProvider could not be found.
1046: Type was not found or was not a compile-time constant: DataProvider.
1180: Call to a possibly undefined method DataProvider.
...
Da der DataProvider eine Art Datenbank ist, können alle Arten von Einträge eingefügt werden.
Man kann also auch binäre Daten und Objekte in einem DataProvider ablegen.
Natürlich können diese Daten nicht direkt angezeigt werden.
Im DataGrid werden nur die Einträge anzeigen, die als columns definiert worden sind.
Einträge mit addItem() hinzufügen
Falls die Reihenfolge der Einträge egal ist können diese einfach mit addItem() hinzugefügt werden.
Es ist natürlich kein Problem diese in einer anderen Reihenfolge anzuzeigen oder dem entsprechenden zu sotieren.
Wenn man sich also sich ist das die entsprechenden Daten nicht geändert werden müssen so sollte man mit addItem() arbeiten.
import fl.data.DataProvider;
var dp_test:DataProvider = new DataProvider();
/* Einzelner Eintrag hinzufügen */
dp_test.addItem({"Spalte 1" : "Wert von Spalte 1"});
/* Mehrere Einträge hinzufügen */
dp_test.addItem({
"Spalte 1" : "Wert von Spalte 1",
"Spalte 2" : "Wert von Spalte 2",
"Spalte 3" : "Wert von Spalte 3"
});
/* Sortierung */
dp_test.sortOn("Spalte 1");
/* Trace Ausgabe */
trace('DataProvider: ' + dp_test)
Auch dieses Beispiel alleine würde noch keine Daten auf dem Bildschirm ausgeben.
Abgesehen von der Trace Anweisung am Ende des Beispiels.
import fl.data.DataProvider;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dp_test:DataProvider = new DataProvider();
/* Einzelner Eintrag hinzufügen */
dp_test.addItem({"Spalte 1" : "Wert von Spalte 1"});
/* Mehrere Einträge hinzufügen */
dp_test.addItem({
"Spalte 1" : "Wert von Spalte 1",
"Spalte 2" : "Wert von Spalte 2",
"Spalte 3" : "Wert von Spalte 3"
});
/* Sortierung */
dp_test.sortOn("Spalte 1");
/* DataGrid generieren und ausgeben */
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(250,250);
dg_test.move(10,10);
dg_test.columns=[new DataGridColumn("Spalte 1"), new DataGridColumn("Spalte 2")];
dg_test.editable = false;
/* DataProvider zu DataGrid zuweisen */
dg_test.dataProvider = dp_test;
/* DataGrid auf der Bühne (Stage) plazieren und anzeigen */
this.addChild(dg_test);
Das vollständige Beispiel sollte eine Tabelle anzeigen mit den entsprechenden Daten.
Was hier zu sehen ist werden die Daten von Spalte 3 nicht im DataGrid angezeigt, weil hier keine entsprechende Spalte definiert worden ist.
Einträge mit addItemAt() hinzufügen
Mit addItemAt() kann man entsprechende Einträge an einer bestimmten Stelle einfügen, dies ist vor allem wichtig wenn man eigenen Unique IDs verwendet.
Da man bei addItemAt() nur Items einfügen kann wenn die Reihenfolge stimmt, kann also keine beliebige Indexzahl verwenden sondern es müssen fortlaufende Numern verwendet werden.
Wird dies nicht beachtet erhält man folgende Fehlermeldung:
...
RangeError: DataProvider index (33) is not in acceptable range (0 - 0)
...
Diesen Fehler kann man relative einfach umgehen indem man die aktuelle größe des DataProvider prüft oder als Parameter übergibt.
import fl.data.DataProvider;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
dp_test.addItemAt({"Spalte 1" : "1. Wert von Spalte 1"},0);
dp_test.addItemAt({"Spalte 1" : "2. Wert von Spalte 1"},1);
dp_test.addItemAt({"Spalte 1" : "3. Wert von Spalte 1"},2);
/* Mehrere Einträge hinzufügen */
dp_test.addItemAt({
"Spalte 1" : "x. Wert von Spalte 1",
"Spalte 2" : "x. Wert von Spalte 2",
"Spalte 3" : "x. Wert von Spalte 3"
},dp_test.length);
/* Sortierung */
dp_test.sortOn("Spalte 1");
/* Trace Ausgabe */
trace('DataProvider: ' + dp_test)
Anbei das entsprechende Beispiel mit grafischer Ausgabe.
import fl.data.DataProvider;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
dp_test.addItemAt({"Spalte 1" : "1. Wert von Spalte 1"},0);
dp_test.addItemAt({"Spalte 1" : "2. Wert von Spalte 1"},1);
dp_test.addItemAt({"Spalte 1" : "3. Wert von Spalte 1"},2);
/* Mehrere Einträge hinzufügen */
dp_test.addItemAt({
"Spalte 1" : "x. Wert von Spalte 1",
"Spalte 2" : "x. Wert von Spalte 2",
"Spalte 3" : "x. Wert von Spalte 3"
},dp_test.length);
/* Sortierung */
dp_test.sortOn("Spalte 1");
/* DataGrid generieren und ausgeben */
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(250,250);
dg_test.move(10,10);
dg_test.columns=[new DataGridColumn("Spalte 1"), new DataGridColumn("Spalte 2")];
dg_test.editable = false;
/* DataProvider zu DataGrid zuweisen */
dg_test.dataProvider = dp_test;
/* DataGrid auf der Bühne (Stage) plazieren und anzeigen */
this.addChild(dg_test);
Das vollständige Beispiel sollte eine Tabelle anzeigen mit den entsprechenden Daten.
Was hier zu sehen ist werden die Daten von Spalte 3 nicht im DataGrid angezeigt, weil hier keine entsprechende Spalte definiert worden ist.
Da es sich wie schon gesagt beim DataProvider um eine Art Datenbank handelt ist es auch möglich entsprechende Einträge wieder zu entfernen.
Zum entfernen muss entweder der derzeitige Index oder das entsprechende Object bekannt sein.
Einträge mit removeItem() entfernen
Um Einträge mit removeItem() zu entfernen muss das entsprechende Object angegeben bzw. ermittelt werden.
In dem einfachsten Fall kann man durch einfaches durchsuchen das entsprechende Element ermitteln.
Alternative kann man entsprechende Events verwenden um den ausgewählten Eintrag zu ermitteln.
import fl.data.DataProvider;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
dp_test.addItemAt({"Spalte 1" : "345534534"},0);
dp_test.addItemAt({"Spalte 1" : "654563243"},1);
dp_test.addItemAt({"Spalte 1" : "453543345"},2);
dp_test.addItemAt({"Spalte 1" : "543435435453"},3);
dp_test.addItemAt({"Spalte 1" : "543543543"},4);
dp_test.addItemAt({"Spalte 1" : "43435345"},5);
/* Mehrere Einträge hinzufügen */
dp_test.addItemAt({
"Spalte 1" : "x. Wert von Spalte 1",
"Spalte 2" : "x. Wert von Spalte 2",
"Spalte 3" : "x. Wert von Spalte 3"
},dp_test.length);
/* Objekt ermitteln */
for (var i = 0; i < dp_test.length; i++) {
var current_item = dp_test.getItemAt(i);
if (current_item["Spalte 1"] == "543543543") {
trace("Found at " + i);
dp_test.removeItem(current_item); /* Objekt gefunden und entfernen */
}
}
/* Sortierung */
dp_test.sortOn("Spalte 1");
/* Trace Ausgabe */
trace('DataProvider: ' + dp_test)
Anbei das entsprechende Beispiel mit grafischer Ausgabe.
import fl.data.DataProvider;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
dp_test.addItemAt({"Spalte 1" : "345534534"},0);
dp_test.addItemAt({"Spalte 1" : "654563243"},1);
dp_test.addItemAt({"Spalte 1" : "453543345"},2);
dp_test.addItemAt({"Spalte 1" : "543435435453"},3);
dp_test.addItemAt({"Spalte 1" : "543543543"},4);
dp_test.addItemAt({"Spalte 1" : "43435345"},5);
/* Mehrere Einträge hinzufügen */
dp_test.addItemAt({
"Spalte 1" : "x. Wert von Spalte 1",
"Spalte 2" : "x. Wert von Spalte 2",
"Spalte 3" : "x. Wert von Spalte 3"
},dp_test.length);
/* Objekt ermitteln */
for (var i = 0; i < dp_test.length; i++) {
var current_item = dp_test.getItemAt(i);
if (current_item["Spalte 1"] == "543543543") {
trace("Found at " + i);
dp_test.removeItem(current_item); /* Objekt gefunden und entfernen */
}
}
/* Sortierung */
dp_test.sortOn("Spalte 1");
/* DataGrid generieren und ausgeben */
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(250,250);
dg_test.move(10,10);
dg_test.columns=[new DataGridColumn("Spalte 1"), new DataGridColumn("Spalte 2")];
dg_test.editable = false;
/* DataProvider zu DataGrid zuweisen */
dg_test.dataProvider = dp_test;
/* DataGrid auf der Bühne (Stage) plazieren und anzeigen */
this.addChild(dg_test);
Dieses Beispiel sollte alle Daten anzeigen auser "543543543", da wird dieses vor der anzeige entfernt haben.
Natürlich kann das entsprechende Object auch auf eine Interaction hin entfernt werden.
Einträge mit removeItemAt() entfernen
Der Befehl removeItemAt() erwartet nicht das Object sondern die entsprechende Index Nummer.
Falls man die Index Nummern selber vergeben hat so kann man relative einfach das entsprechende Object entfernen.
import fl.data.DataProvider;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
dp_test.addItemAt({"Spalte 1" : "345534534"},0);
dp_test.addItemAt({"Spalte 1" : "654563243"},1);
dp_test.addItemAt({"Spalte 1" : "453543345"},2);
dp_test.addItemAt({"Spalte 1" : "543435435453"},3);
dp_test.addItemAt({"Spalte 1" : "543543543"},4);
dp_test.addItemAt({"Spalte 1" : "43435345"},5);
/* Mehrere Einträge hinzufügen */
dp_test.addItemAt({
"Spalte 1" : "x. Wert von Spalte 1",
"Spalte 2" : "x. Wert von Spalte 2",
"Spalte 3" : "x. Wert von Spalte 3"
},dp_test.length);
/* Objekt an bestimmter Stelle löschen */
dp_test.removeItemAt(3);
/* Sortierung */
dp_test.sortOn("Spalte 1");
/* Trace Ausgabe */
trace('DataProvider: ' + dp_test)
Anbei das entsprechende Beispiel mit grafischer Ausgabe.
import fl.data.DataProvider;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
dp_test.addItemAt({"Spalte 1" : "345534534"},0);
dp_test.addItemAt({"Spalte 1" : "654563243"},1);
dp_test.addItemAt({"Spalte 1" : "453543345"},2);
dp_test.addItemAt({"Spalte 1" : "543435435453"},3);
dp_test.addItemAt({"Spalte 1" : "543543543"},4);
dp_test.addItemAt({"Spalte 1" : "43435345"},5);
/* Mehrere Einträge hinzufügen */
dp_test.addItemAt({
"Spalte 1" : "x. Wert von Spalte 1",
"Spalte 2" : "x. Wert von Spalte 2",
"Spalte 3" : "x. Wert von Spalte 3"
},dp_test.length);
/* Objekt an bestimmter Stelle löschen */
dp_test.removeItemAt(3);
/* Sortierung */
dp_test.sortOn("Spalte 1");
/* DataGrid generieren und ausgeben */
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(250,250);
dg_test.move(10,10);
dg_test.columns=[new DataGridColumn("Spalte 1"), new DataGridColumn("Spalte 2")];
dg_test.editable = false;
/* DataProvider zu DataGrid zuweisen */
dg_test.dataProvider = dp_test;
/* DataGrid auf der Bühne (Stage) plazieren und anzeigen */
this.addChild(dg_test);
Beide Methoden haben Ihre Vorteile und Nachteile somit kommt es immer darauf an, wie man die Daten verarbeiten will um die richtige Methode zu verwenden.
Es gibt verschiedene Möglichkeiten Daten innerhalb eines DataProviders zu ändern.
Es kann ein einzelner Wert geändert werden oder aber es kann auch das gesamte Object mit einem neuen ersetzt werden.
In den meisten Fällen muss nur ein entsprechender Wert geändert werden.
Ändern einzelner Einträgen über das Object
import fl.data.DataProvider;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
for (var i = 0; i < 10; i++){
var zufallszahl1:Number = 1 + Math.floor(Math.random() * 10);
var zufallszahl2:Number = 1 + Math.floor(Math.random() * 10);
dp_test.addItem({
"Wert 1" : zufallszahl1,
"Wert 2" : zufallszahl2,
"Ergebniss" : "-"
});
}
/* Einzelne Einträge ändern */
for (var i2 = 0; i2 < dp_test.length; i2++) {
var current_item = dp_test.getItemAt(i2);
current_item["Ergebniss"] = current_item["Wert 1"] + current_item["Wert 2"];
}
/* DataGrid generieren und ausgeben */
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(250,250);
dg_test.move(10,10);
dg_test.columns=[new DataGridColumn("Wert 1"), new DataGridColumn("Wert 2"), new DataGridColumn("Ergebniss")];
dg_test.editable = false;
/* DataProvider zu DataGrid zuweisen */
dg_test.dataProvider = dp_test;
/* DataGrid auf der Bühne (Stage) plazieren und anzeigen */
this.addChild(dg_test);
Zuerst werden bei diesem Beispiel zwei Zufahlszahlen ermittelt und dem DataProvider hinzugefügt.
Anschließend werden diese Werte ausgelesen und das Ergebniss der Addition beider Werte in das Feld "Ergebniss" geschrieben.
Entsprechenden Object mit replaceItem ersetzten
import fl.data.DataProvider;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
for (var i = 0; i < 10; i++){
var zufallszahl1:Number = 1 + Math.floor(Math.random() * 10);
var zufallszahl2:Number = 1 + Math.floor(Math.random() * 10);
dp_test.addItem({
"Wert 1" : zufallszahl1,
"Wert 2" : zufallszahl2,
"Ergebniss" : "-"
});
}
/* Einträge ersetzten */
for (var i2 = 0; i2 < dp_test.length; i2++) {
var current_item = dp_test.getItemAt(i2);
/* Neues Item definieren */
var new_item = {
"Wert 1" : current_item["Wert 1"],
"Wert 2" : current_item["Wert 2"],
"Ergebniss" : current_item["Wert 1"] + current_item["Wert 2"]
};
/*
Item ersetzten: replaceItem(Neues Item, Altes Item)
*/
dp_test.replaceItem(new_item, current_item);
}
/* DataGrid generieren und ausgeben */
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(250,250);
dg_test.move(10,10);
dg_test.columns=[new DataGridColumn("Wert 1"), new DataGridColumn("Wert 2"), new DataGridColumn("Ergebniss")];
dg_test.editable = false;
/* DataProvider zu DataGrid zuweisen */
dg_test.dataProvider = dp_test;
/* DataGrid auf der Bühne (Stage) plazieren und anzeigen */
this.addChild(dg_test);
Zuerst werden bei diesem Beispiel zwei Zufahlszahlen ermittelt und dem DataProvider hinzugefügt.
Anschließend werden diese Werte ausgelesen und ein neues Object erstellt welches die Zahlen und das Ergeniss enthält.
Zum Schluss wird das alte Object "current_item" mit diesem neuen Object ersetzt "new_item".
Entsprechenden Object mit replaceItemAt ersetzten
import fl.data.DataProvider;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
for (var i = 0; i < 10; i++){
var zufallszahl1:Number = 1 + Math.floor(Math.random() * 10);
var zufallszahl2:Number = 1 + Math.floor(Math.random() * 10);
dp_test.addItem({
"Wert 1" : zufallszahl1,
"Wert 2" : zufallszahl2,
"Ergebniss" : "-"
});
}
/* Einträge ersetzten */
for (var i2 = 0; i2 < dp_test.length; i2++) {
var current_item = dp_test.getItemAt(i2);
/* Neues Item definieren */
var new_item = {
"Wert 1" : current_item["Wert 1"],
"Wert 2" : current_item["Wert 2"],
"Ergebniss" : current_item["Wert 1"] + current_item["Wert 2"]
};
/*
Item ersetzten: replaceItemAt(Neues Item, Index)
*/
dp_test.replaceItemAt(new_item, i2);
}
/* DataGrid generieren und ausgeben */
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(250,250);
dg_test.move(10,10);
dg_test.columns=[new DataGridColumn("Wert 1"), new DataGridColumn("Wert 2"), new DataGridColumn("Ergebniss")];
dg_test.editable = false;
/* DataProvider zu DataGrid zuweisen */
dg_test.dataProvider = dp_test;
/* DataGrid auf der Bühne (Stage) plazieren und anzeigen */
this.addChild(dg_test);
Zuerst werden bei diesem Beispiel zwei Zufahlszahlen ermittelt und dem DataProvider hinzugefügt.
Anschließend werden diese Werte ausgelesen und ein neues Object erstellt welches die Zahlen und das Ergeniss enthält.
Zum Schluss das neuen Object "new_item" mit dem Object unter der Index Numer "i2" ersetzt.
In den meisten Fällen wird eine vorhandene Liste aktualisiert, jedoch gibt es hier einen wichtigen Punkt der beachtet werden muss.
Aktualisiert man nur den Dataprovider so kann es sein das die Änderungen durchgeführt worden sind aber nicht im Datagrid angezeigt werden.
Dies ist vor allem der Fall wenn man mehrere Daten gleichzeitig ändert oder der User keine Interaktion wie scrollen ausführt.
Bei einem Klick auf "Simple Replace" sieht man keine Änderung am DataGrid, erst wenn anschließen das DataGrid geklickt oder gescrollt wird, sind die entsprechenden Änderungen sichtbar.
Jedoch bei einem Klick auf "Advance Replace" sieht man die Änderungen sofort ohne dass das entsprechenden DataGrid geklickt oder gescrollt werden muss.
Mit "Init" kann man weitere Werte hinzufügen um den Test so oft man will wiederholen kann.
import fl.controls.Button;
import fl.data.DataProvider;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.*;
var dp_test:DataProvider = new DataProvider();
/* Einzelne Einträge hinzufügen */
function init(e) {
for (var i = 0; i < 10; i++) {
var zufallszahl1:Number = 1 + Math.floor(Math.random() * 10);
var zufallszahl2:Number = 1 + Math.floor(Math.random() * 10);
dp_test.addItemAt({
"Wert 1" : zufallszahl1,
"Wert 2" : zufallszahl2,
"Ergebniss" : "-"
},i);
}
}
function simple_replace(e) {
/* Einzelne Einträge ändern */
for (var i2 = 0; i2 < dp_test.length; i2++) {
var current_item = dp_test.getItemAt(i2);
current_item["Ergebniss"] = current_item["Wert 1"] + current_item["Wert 2"];
}
}
function advance_replace(e) {
/* Einzelne Einträge ändern */
for (var i2 = 0; i2 < dp_test.length; i2++) {
var current_item = dp_test.getItemAt(i2);
current_item["Ergebniss"] = current_item["Wert 1"] + current_item["Wert 2"];
}
/* DataGrid refreshen */
dg_test.dataProvider = dp_test;
}
/* DataGrid generieren und ausgeben */
var dg_test:DataGrid = new DataGrid();
dg_test.setSize(325,225);
dg_test.move(10,60);
dg_test.columns = [new DataGridColumn("Wert 1"),new DataGridColumn("Wert 2"),new DataGridColumn("Ergebniss")];
dg_test.editable = false;
/* DataProvider zu DataGrid zuweisen */
dg_test.dataProvider = dp_test;
/* Buttons erstellen */
var bt_init = new Button();
bt_init.label = "Init";
bt_init.move(10,30);
bt_init.addEventListener(MouseEvent.CLICK, init);
var bt_update1 = new Button();
bt_update1.label = "Simple Replace";
bt_update1.move(120,30);
bt_update1.addEventListener(MouseEvent.CLICK, simple_replace);
var bt_update2 = new Button();
bt_update2.label = "Advance Replace";
bt_update2.move(230,30);
bt_update2.addEventListener(MouseEvent.CLICK, advance_replace);
/* Init Felder */
init(null);
/* DataGrid auf der Bühne (Stage) plazieren und anzeigen */
this.addChild(dg_test);
/* Buttons auf der Bühne (Stage) plazieren */
this.addChild(bt_init);
this.addChild(bt_update1);
this.addChild(bt_update2);
Diese Aktionscript Code erstellt das Beispiel das vorher zu sehen ist.
Der einzige unterschied in der "advance_replace" Funktion ist, das der DataProvider dem DataGrid nochmal neu zugewiesen wird.
Durch diese neuzuweisung wird das DataGrid aktualisiert und die entsprechenden geänderten Daten sind sichtbar ohne das der Benutzer klicke oder scrollen muss.
Adobe Flex kennt kein "Dataprovider" Object, hier muss mit "ArrayCollection" gearbeitet werden, diese kann entweder per AktionScript oder auch per XML definiert werden.
Auf diesem Grund sind folgenden Fehlermeldungen im Adobe Flex normal:
...
1046: Typ wurde nicht gefunden oder war keine Kompilierungszeit-Konstante: DataProvider.
1180: Aufruf einer möglicherweise undefinierten Methode DataProvider.
1172: Definition fl.controls.dataGridClasses wurde nicht gefunden.
...
Auch in Adobe Flex muss das entsprechende DataGrid hinzugefügt werden dies geht aber recht einfach durch einen leeren XML Eintrag wie z.B.: <mx:DataGrid></mx:DataGrid> im XML Code.
