Site:

Cours VB.net

3.16

Contrôles 'Grid'.

Qu'utiliser pour afficher dans une 'Grille'(Grid), un tableau (type tableur avec des lignes et des colonnes)?

Ici on affiche du texte directement dans les cellules SANS utiliser de liaison avec une base de données. On parle de grille 'indépendante'

MsFlexGrid de VB6

LameGrid 

DataGrid VB.Net 2003

DataGridView VB.Net 2005

 

A - Contrôle 'MsFlexGrid' de VB6

Microsoft fournissait avec VB6 l'activeX 'Microsoft Flexgrid 6' qui permettait de satisfaire à la plupart des demandes . Il est toujours possible d'utiliser cet activeX dans vos programmes mais ce n'est plus du .net (c'est du non managé).

Il faut l'ajouter dans la boite à outils:

En VB 2003 Bouton droit puis dans le menu 'Ajouter/Supprimer un composant'  puis 'Parcourir' , on ajoute MSFLXGRD.OCX qui est dans Windows/System32 ( si vb6 installé, ou sinon le demander à quelqu'un qui a VB6).

En VB 2005 menu 'Outils'  puis 'Choisir des éléments de la boite à outils' , onglet 'composant COM' puis bouton 'parcourir' on ajoute MSFLXGRD.OCX qui est dans Windows/System32 ( si vb6 installé, ou sinon le demander à quelqu'un qui a VB6).

Voila ce qu'il permet de faire en VB6: (Logiciel LDF de l'auteur)

Les propriétés Cols et Rows permettent de définir le nombre de colonne et de ligne.

FixedCols et FixedRows permettent de déterminer les colonnes et lignes qui ne bougent pas (titres); BackColorFixed donne une couleur à ces lignes fixes.

Modifier la largeur d'une colonne:

Grid.ColWidth(i) =150

Pour modifier une cellule:

Grid.Row = 2        'Coordonnées de la cellule
Grid.Col = 3
Grid.CellFontBold = True    'Texte en gras
Grid.CellForeColor = Color.Red 'Couleur du texte

Grid.Text= Texte 

ou  

Grid.TextMatrix(2, 3) = Texte

.TextMatrix est beaucoup plus rapide que .Text mais on n'a accès qu'au texte et pas à l'enrichissement.

Modifier la couleur de fond d'une cellule:

Grid.CellBackColor = Color.Red

Mettre une image dans une cellule

Grid.CellPictureAlignment = flexAlignCenterCenter '4= gère l'alignement
Set Grid.CellPicture = ImageCoche.Picture    'Syntaxe VB6, le Set doit disparaître en .Net

On peut gérer l'évènement Grid_RrowColChanged quand l'utilisateur change de cellule. Il existe bien sur Grid_Click...

Il n'y a pas de gestion de saisie dans les cellules, il faut le faire 'à la main', Grid_KeyPress appelle une routine qui simule une saisie dans la grille avec un textbox qui prend les dimensions de la cellule. ( Voir le code en annexe en bas de page )

Pour accélérer l'affichage et éviter le scintillement , surtout si il faut réafficher la totalité du tableau avec des couleurs et des images, il faut désactiver la mise à jour de l'affichage, afficher la page, réactiver. L'affichage devient instantané.

L'exemple suivant colore une ligne sur deux, c'est instantané.

Dim i As Integer

Dim j As Integer

Grid.Redraw = False
Grid.Clear

For i = 0 To NbMaxLigne Step 2
Grid.Row = i
For j = 0 To MaxColonne - 1
Grid.Col = j
Grid.CellBackColor = VERTCLAIR
Next j
Next i

Grid.Redraw = True

B - Contrôles Freeware à télécharger, c'est du '.Net':

'lameGrid'en français +++++

Il existe un contrôle gratuit nommé lameGrid qui est du pur .Net et qui permet simplement d'afficher dans une  grid.

On le trouve ici avec son mode d'emploi:

http://kikos31.developpez.com/lamegrid/ par Christophe Holmes

C'est simple rapide, efficace. On le conseille.

Son usage est simple:

Grille(1.2).Forecolor= MyColor

Grille(1.2).Font= MyFont

Grille(1.2).Texte="Lulu"

Autre:

SourceGrid en Anglais.

http://www.devage.com/SourceGrid/SourceGrid2_EN.html

C - Contrôle 'DataGrid ' de VB 2003

C'est un des contrôles fournit avec VB.Net 2003 les plus puissant. Il est très adapté pour faire une liaison avec une base de données, mais pour l'utiliser simplement, dur, dur!!

Il est composé de lignes et de colonnes:

Aspect du contrôle 'DataGrid'

Mettre un 'DataGrid' dans le formulaire en cours en allant le chercher dans la boite à outils.

On peut modifier l'aspect du DataGrid1

• en dans la fenêtre de propriété les propriétés

• en utilisant la mise en forme automatique (lien en bas de la fenêtre de propriétés.)

Pour travailler avec un DataGrid, on peut:

•  écrire directement dedans

•  créer un DataSet (un DataSet c'est un objet qui a la structure d'une base de données mais en local, il comporte des lignes , des colonnes.. voir la chapitre 6-5).Ce DataSet  sera ensuite lié au DataGrid par DataGrid1.DataSource= MonDataSet. Toute modification du Dataset sera ensuite répercutée automatiquement sur le DataGrid. Et toute modification du DataGrid sera répercutée sur le DataSet.

Comment modifier le texte d'une cellule?

Pour modifier une cellule du Datagrid, il faut modifier le DataSet (pas le DataGrd)

MonDataSet.Tables(0).Rows (0) (1)= "Montexte" '0 et 1 sont respectivement le numéro de ligne et de colonne.

Comment lire le texte d'une cellule?

TextBox1.Text = CType(DataGrid1(1, 1), String)

Comment sélectionner une ligne?

Il faut taper

DataGrid1.Select(1)

Comment cacher une colonne?

MonDataSet.Tables["Employees"].Columns["LastName"].ColumnMapping = MappingType.Hidden
 

Comment améliorer la rapidité de l'affichage:

Si on fait un grand nombre de modifications dans un DataGrid, le DataGrid est remis à jour à chaque modification, c'est long et souvent l'affichage clignote.

Pour éviter cela, il faut désactiver l'affichage par BeginUpdate, afficher toutes les modifications puis réactiver l'affichage par EndUpdate: la mise à jour se fait en une fois très rapidement.

Private Sub BeginEndUpdate()
' MyDataGridColumnStyle is a class derived from DataGridColumnStyle.
Dim dgc As MyDataGridColumnStyle
Dim dgCols As GridColumnStylesCollection
dgCols = DataGrid1.TableStyles(0).GridColumnStyles
For Each dgc In dgCols
dgc.BeginUpdate
Next

' Code to update not shown here.

For Each dgc In dgCols
dgc.EndUpdate
Next

End Sub
 

D - Contrôle 'DataGridView ' de VB

C'est celui qu'il faut utiliser.

Il remplace le DataGrid dans  VB.Net 2005 Il est bien plus simple à utiliser surtout pour modifier directement la grille sans passer par un DataSet.(Contrôle indépendant)

Exemple 1: On crée la Grid puis des colonnes de la grid; on crée les lignes que l'on ajoute à la grille.

Exemple de Microsoft: afficher dans le contrôle MyDataGridView 5 colonnes( nommées date, piste, titre, artiste, album) et 6 lignes de chanson.(exemple à partir d'un exemple de Microsoft)

'création de la grille

Private WithEvents MyDataGridView As New DataGridView

Me.Controls.Add(MyDataGridView)

'On met 5 colonnes

MyDataGridView.ColumnCount = 5

'On colore les en-têtes, on met les fonts

With MyDataGridView.ColumnHeadersDefaultCellStyle

.BackColor = Color.Navy

.ForeColor = Color.White

.Font = New Font(MyDataGridView.Font, FontStyle.Bold)

End With

'on positionne la grille

With MyDataGridView

.Name = "MyDataGridView"

.Location = New Point(8, 8)

.Size = New Size(500, 250)

.AutoSizeRowsMode = DataGridViewAutoSizeRowsMode.DisplayedCellsExceptHeaders

.ColumnHeadersBorderStyle = DataGridViewHeaderBorderStyle.Single

.CellBorderStyle = DataGridViewCellBorderStyle.Single

.GridColor = Color.Black

.RowHeadersVisible = False

'On donne le nom des colonnes

.Columns(0).Name = "Date"

.Columns(1).Name = "Piste"

.Columns(2).Name = "Titre"

.Columns(3).Name = "Artiste"

.Columns(4).Name = "Album"

.Columns(4).DefaultCellStyle.Font = New Font(Me.MyDataGridView.DefaultCellStyle.Font, FontStyle.Italic)

.SelectionMode = DataGridViewSelectionMode.FullRowSelect

.MultiSelect = False

.Dock = DockStyle.Fill

End With

'Création d'un tableau de 5 strings pour chaque ligne

Dim row0 As String() = {"11/22/1968", "29", "Revolution 9", _

"Beatles", "The Beatles [White Album]"}

Dim row1 As String() = {"1960", "6", "Fools Rush In", _

"Frank Sinatra", "Nice 'N' Easy"}

Dim row2 As String() = {"11/11/1971", "1", "One of These Days", _

"Pink Floyd", "Meddle"}

Dim row3 As String() = {"1988", "7", "Where Is My Mind?", _

"Pixies", "Surfer Rosa"}

Dim row4 As String() = {"5/1981", "9", "Can't Find My Mind", _

"Cramps", "Psychedelic Jungle"}

Dim row5 As String() = {"6/10/2003", "13", _

"Scatterbrain. (As Dead As Leaves.)", _

"Radiohead", "Hail to the Thief"}

Dim row6 As String() = {"6/30/1992", "3", "Dress", "P J Harvey", "Dry"}

With Me.MyDataGridView.Rows

'Ajout de ligne

.Add(row0)   

.Add(row1)

.Add(row2)

.Add(row3)

.Add(row4)

.Add(row5)

.Add(row6)

End With

With Me.MyDataGridView

'Ordre des colonnes

.Columns(0).DisplayIndex = 3

.Columns(1).DisplayIndex = 4

.Columns(2).DisplayIndex = 0

.Columns(3).DisplayIndex = 1

.Columns(4).DisplayIndex = 2

End With

'Ajouter une ligne

Me.MyDataGridView.Rows.Add()

'Enlever la ligne pointée

If Me.MyDataGridView.SelectedRows.Count > 0 AndAlso _

Not Me.MyDataGridView.SelectedRows(0).Index = _

Me.MyDataGridView.Rows.Count - 1 Then

Me.MyDataGridView.Rows.RemoveAt( _

Me.MyDataGridView.SelectedRows(0).Index)

End If

'Faire disparaître toutes es lignes

Me.MyDataGridView.Rows.Clear()  'il ne reste plus que les en-têtes de colonnes

Exemple 2: On crée la grid avec des lignes et des colonnes puis on modifie les cellules.

'Mettre 5 colonnes et 50 lignes dans la grid

Grid.RowCount = 50

Grid.ColumnCount = 5

With Me.Grid

'Une ligne sur 2 en bleue

.RowsDefaultCellStyle.BackColor = Color.White

.AlternatingRowsDefaultCellStyle.BackColor = Color.AliceBlue

'Interdir la selection de plusieurs cellules

.MultiSelect = False

'Empeche la saisie dans les cellules (en faite, le permet par programmation)

.EditMode = DataGridViewEditMode.EditProgrammatically

End With

'Gestion des en-têtes de colonne

With Grid.ColumnHeadersDefaultCellStyle '

.BackColor = Color.Blue  'ça marche pas!!??

.ForeColor = Color.Blue

.Font = New Font(Grid.Font, FontStyle.Bold)' en gras

End With

With Grid

'Empêche les modifications de lignes, colonnes, l'ajout, la suppression

.AllowUserToAddRows = False

.AllowUserToDeleteRows = False

.AllowUserToOrderColumns = False

.AllowUserToResizeColumns = False

.AllowUserToResizeRows = False

'Nomme les colonnes (en têtes)

.Columns(0).Name = "Date"

.Columns(1).Name = "Libellé"

.Columns(2).Name = "Montant"

.Columns(3).Name = "Origine"

.Columns(4).Name = "Cochée"

.RowHeadersVisible = False 'pas de première colonne d'en tête

.Columns(2).Width = 30 'modifie la largeur de la colonne 2

End With

Pour avoir une 2 lignes d'en-tête:

.Columns(2).Name = "Montant" & ControlChars.CrLf & "en euros"

(ColumnsHeaderHeightSizeMode est par défaut à AutoSize)

'On modifie la couleur de fond d'une cellule, on aligne au milieu, impose un format et affiche "12"

Grid.Item(3, 3).Style.BackColor = Color.Coral

Grid.Item(3, 3).Style.Alignment = DataGridViewContentAlignment.MiddleRight

Grid.Item(3, 3).Style.Format = "#####"

Grid.Item(3, 3).Value = 12

'On modifie la couleur de fond d'une cellule, on aligne au milieu, on met en italique et affiche "Toro"

Grid.Item(3, 4).Style.BackColor = Color.Chartreuse

Grid.Item(3, 4).Style.Alignment = DataGridViewContentAlignment.MiddleRight

Grid.Item(3, 4).Style.Font = New Font(Grid.Font, FontStyle.Italic)

Grid.Item(3, 4).Value = "Toro"

If Not Button1.Font.Style = FontStyle.Bold Then 

Button1.Font = New Font(FontFamily.GenericSansSerif, _ 12.0F, FontStyle.Bold) 

End If 

'On force la cellule à accepter une image, on aligne au milieu, donne une couleur de fond et affiche une image à partir d'un fichier.

Grid.Item(2, 2) = New DataGridViewImageCell

Grid.Item(2, 2).Style.Alignment = DataGridViewContentAlignment.MiddleCenter

Grid.Item(2, 2).Style.BackColor = Color.Wheat

Grid.Item(2, 2).Value = New Bitmap("viconote.gif")

'On  autorise le redimensionnement  auto, marche pas?

Grid.AutoResizeColumns()

'Positionner la cellule courante, le curseur sur la cellule 1,1

Grid.Rows(1).Cells(1).Selected = True

'Connaître la ligne et la colonne de la cellule  courante

Dim x As Integer = Grid.CurrentCellAddress.X

Dim y As Integer = Grid.CurrentCellAddress.Y

'Effacer le contenu de toutes les cellules de la grid

Grid.Rows.Clear()

Grid.RowCount = 50

Grid.ColumnCount = 5

'Modifier le ToolTipText (Petit rectangle jaune contenant un test qui apparait quand le curseur de la souris reste un moment sur une cellule)

Private Sub Grid_CellFormatting(ByVal sender As Object, ByVal e As System.Windows.Forms.DataGridViewCellFormattingEventArgs) Handles Grid.CellFormatting

Dim cell As DataGridViewCell = Grid(e.ColumnIndex, e.RowIndex)

cell.ToolTipText = "oui"

End Sub

On rappelle que la première cellule en haut à gauche est la cellule  '0,0'; on ne compte pas les en-têtes.

Annexe: code permettant de simuler la saisie dans un MsFlexGrid:

Mettre dans un formulaire une grille MSFLEXGRID nommée Grid, une TextBox (avec borderSTyle =None) nommée TxtEdit.

Grid_KeyPress appelle une routine qui affiche le textbox (qui prend les dimensions de la cellule), l'utilisateur tape son texte dans le textbox, quand il sort, le textbox est effacé et le texte affiché dans la cellule de la grid.

AJOUTER DANS LES PROCEDURES:

Private Sub Grid_DblClick()
If Txtedit.Visible = True Then Exit Sub 'evite une boucle
'edite
MSHFlexGridEdit Grid, Txtedit, 32 ' Simule un espace.
End Sub


Private Sub Grid_GotFocus()
If Txtedit.Visible = True Then
Grid = Txtedit
Txtedit.Visible = False
End If
End Sub


Private Sub Grid_KeyPress(KeyAscii As Integer)
MSHFlexGridEdit Grid, Txtedit, KeyAscii
End Sub



Private Sub Grid_RowColChange()
EditKeyCode Grid, Txtedit, 27, 0
End Sub


Private Sub Txtedit_KeyDown(KeyCode As Integer, Shift As Integer)
EditKeyCode Grid, Txtedit, KeyCode, Shift
End Sub



AJOUTER LES 3 routines:

Sub EditKeyCode(MSHFlexGrid As Control, Edt As Control, KeyCode As Integer, Shift As Integer)
' Traitement de contrôle d'édition standard.
Select Case KeyCode
Case 27 ' ÉCHAP : masque, renvoie le focus à MSHFlexGrid.
Edt.Visible = False
MSHFlexGrid.SetFocus
Case 13 ' ENTRÉE renvoie le focus à MSHFlexGrid.
Edt.Visible = False
MSHFlexGrid.SetFocus
MiseaJourLigne
Case 38 ' Haut.
MSHFlexGrid.SetFocus: DoEvents
Edt.Visible = False
MiseaJourLigne
If MSHFlexGrid.Row > MSHFlexGrid.FixedRows Then
MSHFlexGrid.Row = MSHFlexGrid.Row - 1
End If
Case 40 ' Bas.
MSHFlexGrid.SetFocus: DoEvents
Edt.Visible = False
MiseaJourLigne
If MSHFlexGrid.Row < MSHFlexGrid.Rows - 1 Then
MSHFlexGrid.Row = MSHFlexGrid.Row + 1
End If
Case 39 ' droit.
' MSHFlexGrid.SetFocus: DoEvents
' If MSHFlexGrid.Col < MSHFlexGrid.Cols Then
' MSHFlexGrid.Col = MSHFlexGrid.Col + 1
' End If
' Edt.Visible = False
' MiseAJourLigne
' Case 37 ' Gauche.
' MiseAJourLigne
' MSHFlexGrid.SetFocus: DoEvents
' If MSHFlexGrid.col > MSHFlexGrid.FixedCols - 1 Then
' MSHFlexGrid.col = MSHFlexGrid.col - 1
' End If
End Select
End Sub

 

Sub MSHFlexGridEdit(MSHFlexGrid As Control, Edt As Control, KeyAscii As Integer)
' Utilise le caractère qui a été tapé.
Select Case KeyAscii
' Un espace signifie "modifier le texte en cours".
Case 0 To 32
Edt = Trim(MSHFlexGrid)
If Len(Edt) < 1 Then

Edt = Grid.Text
End If

Edt.SelStart = 1000
' Tout autre élément signifie "remplacer le ' texte en cours".
Case Else
Edt = Chr(KeyAscii)
Edt.SelStart = 1
End Select
' Affiche Edt au bon endroit.
Edt.Move MSHFlexGrid.Left + MSHFlexGrid.CellLeft, MSHFlexGrid.Top + MSHFlexGrid.CellTop, MSHFlexGrid.CellWidth - 8, MSHFlexGrid.CellHeight - 8
Edt.ForeColor = ROUGE
Edt.Visible = True
' Et laisse l'opération s'effectuer.
Edt.SetFocus
End Sub

 

Public Sub MiseaJourLigne()
'Met à jour la grid

Grid.text=Txtedit.text
End sub