Tutorial Datagrid débutant

Bonjour,

Savez vous SVP où je pourrais trouver un bon tutorial pour l'utilisation des datagrid. J'ai du mal à trouver.

Pour info, je cherche à construire un tableau dans un swf qui contiendrait les infos d'un fichier texte préformaté (séparateur | pour les cellules et retour à la ligne pour les lignes). Et il faudrait que je rajoute dans la premier cellule de chaque ligne une checkbox.

Merci d'avance. A bientot

J'ai trouvé un projet sur le net proche de ce que je veux faire.
Le datagrid est créé dans le code AS.

Qui peut me donner la fonction pour le charger à partir d'un fichier texte avec séparateur | (pipe).

Merci d'avance. :)

salut
tu trouveras des exemples ici : http://philflash.inway.fr/example.html

Voilà, j'ai trouvé ce que je cherchais. Pour ceux que ça intéresse :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
var myDP : Array = new Array();
 
System.useCodepage = true;
Stage.scaleMode ="showAll";
 
import mx.controls.DataGrid;
 
//création du loadVars 
monLoadVars = new LoadVars(); 
//chargement des variables dans le loadvars  
monLoadVars.load( "monTexte.txt" );                   
//fonction qui va rentrer les valeurs dans un tableau
var leftLayout:Number = 0;
var topLayout:Number = 50;
var widthLayout:Number = 1000;
 
var datas :Array = new Array();
monLoadVars.onData = function (data) {
    DataLigne = data.split(';');
	//trace(DataLigne.length);return;
	for (j=0; j<DataLigne.length-1; j++) {
			datas = DataLigne[j].split('|');
            myDP.push({Sel:false, numero:datas[1],Intitule:datas[2], Description:datas[3], Euros_HT:datas[4]});
			grid.setStyle("alternatingRowColors", "#8BCC0C"); 
   		 	grid.getColumnAt(0).cellRenderer = "CheckBoxCell";
		    grid.getColumnAt(0).width = 30;
			grid.getColumnAt(1).width = 80;
		    grid.getColumnAt(2).width = 160;
		    grid.getColumnAt(3).width = 420;
		    grid.getColumnAt(4).width = 100;
		    grid.resizableColumns = true;
		    grid.vScrollPolicy = "auto";
 
			// Style for DataGrid
			grid.setStyle("color", 0x2E0C96); // Couleur du texte
			grid.setStyle("alternatingRowColors", Array(0xDFDAFF, 0xDCE5EE)); // Couleur des lignes
			grid.setStyle("hGridLines", false); // Afficher séparateur lignes 
			grid.setStyle("hGridLineColor", 0xA2A6A9); // Couleur lignes
    		grid.setStyle("vGridLines",false);  // Affichier séparateur colonnes
			grid.setHeaderHeight(20); // Hauteur de l'entete
			grid.setStyle("headerColor", 0xD5A3F4); // Couleur de l'entete
			grid.setStyle("textAlign", "left");
			grid.dataProvider = myDP;
			}
}; 
 
// Create a DataGrid.
createClassObject(DataGrid, "grid", this.getNextHightestDepth());
grid.setSize(widthLayout, 500);
grid.move(leftLayout, topLayout);
 
// Add a listener for the the grid cellPress event.
grid.addEventListener("cellPress", this);
 
stop();

Et un bouton de validation :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
on(release){
	MonTexte = "Merci de bien vouloir me faire parvenir des informations concernant les scripts : %0a" ;
	Nb_sel = 0;
	for (m=0; m<grid.dataProvider.length-1; m++) 
	{
	  if (grid.dataProvider[m].Sel == true)
	  {
		  {
			  MonTexte = MonTexte + "%0a" + " - " + grid.dataProvider[m].numero + " (" + grid.dataProvider[m].Intitule + ") ";
			  Nb_sel = Nb_sel +1 ;
		  }
	  }
  }
  if (Nb_sel < 1)
  {gotoAndPlay(2)}
  else
  {
  MonTexte = MonTexte + "%0a%0a Informations complémentaires : ";
  MonTexte = MonTexte + "(Entrez ici vos coordonnées, ainsi que vos éventuels questions ou remarques.) %0a"
  MonTexte = MonTexte + "----------------------------------------------------------------------------------------------------------------------------------------------------------------- \r\r";
  destinataire = "toto@toto.fr"; 
  sujet = "Demande d'informations :"; 
  corps =MonTexte;
  chaine = "mailto:" ; 
  chaine += destinataire ; 
  chaine += "&subject="+sujet; 
  chaine += "&body="+corps; 
  getURL (chaine) ;
  }
}

Mon fichier texte ressemble à ça :

Code:

1
2
3
|Champ 0a|champ 1a|champ2a|Montant;
|Champ 0b|champ 1b|champ2b|Montant;
...

et j'ai posé dans mon repertoire de travail ce fichier .as

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
ï»¿/****************************************************************************
Copyright (C) 2005 Macromedia, Inc. All Rights Reserved.
The following is Sample Code and is subject to all restrictions on
such code as contained in the End User License Agreement accompanying
this product.
Class: CheckBoxCell
Description: Example of a class that can be assigned as a cell renderer to a list
type component -- in this case, a cell of a DataGrid.  This cellRenderer class
displays a CheckBox component.
****************************************************************************/
 
import mx.core.UIComponent
import mx.controls.CheckBox
 
class CheckBoxCell extends UIComponent
{
 
	private var check : MovieClip;
	private var listOwner : MovieClip; 		// the reference we receive to the list
	private var getCellIndex : Function; 	// the function we receive from the list
	private var	getDataLabel : Function; 	// the function we receive from the list
 
	private static var PREFERRED_HEIGHT = 16; 	// The preferred height of the cell containing the ComboBox.
	private static var PREFERRED_WIDTH = 20; 	// The preferred width of the cell containing the Combobox.
 
	// Constructor:  Should be empty.
	public function CheckBoxCell()
	{
	}
 
	/* UIObject expects you to fill in createChildren by instantiating
	all the movie clip assets you might need upon initialization. 
	In this case we are creating one label*/
	public function createChildren(Void) : Void
	{
		check = createObject("CheckBox", "check", 1, {styleName:this, owner:this});
		check.addEventListener("click", this);
		size();
	}
 
	/* Note: setSize is implemented by UIComponent and calls size(), after setting
	__width and __height.  You can use __width and __height to determine how to size
	the cell contents. */
	public function size(Void) : Void
	{
		check.setSize(PREFERRED_WIDTH, PREFERRED_WIDTH);
		check._x = (__width - PREFERRED_WIDTH)/2;
		check._y = (__height - PREFERRED_HEIGHT)/2;
	}
 
	// Called by the owner to set the value in the cell.  Inherited method.
	public function setValue(str:String, item:Object, sel:Boolean) : Void
	{
		/* Note:If item is undefined, nothing should be rendered in the cell, 
		so set the label as invisible. Note: For scrolling List type components
		like a scrolling datagrid, the cells are intended to be empty as they scroll
		just out of sight, and then the cell is reused again and set to a new value 
		producing an animated effect of scrolling.  For this reason, you cannot rely on
		any one cell always having data to show or the same value.*/
		check._visible = (item!=undefined);
		check.selected = item[getDataLabel()];
	}
 
	public function getPreferredHeight(Void) : Number
	{
		return PREFERRED_HEIGHT;
	}
 
	public function getPreferredWidth(Void) : Number
	{
		return PREFERRED_WIDTH;
	}
 
	public function click()
	{
		listOwner.dataProvider.editField(getCellIndex().itemIndex, getDataLabel(), check.selected);
	}
 
}

Dernière question, après, j'arrête de vous embêter.
Comment puis-je mettre ma seconde colonne (champs 1a, champs 1b....) en gras ? (et seulement cette colonne).
Merci d'avance et merci à tous.

A +