Cours VB.NETDate de mise à jour : 05/12/2010
XI-F. Les différents contrôles
XI-F-1. Les Conteneurs
XI-F-1-a. Les Grid
XI-F-1-b. Les StackPanel
XI-F-1-c. Les WrapPanel
XI-F-1-d. Les DockPanel
XI-F-1-e. Les Canvas
XI-F-2. Les Boutons et RepeatButton
XI-F-2-a. Les 'Button'
XI-F-2-b. RepeatButton
XI-F-3. Les contrôles contenant du texte
XI-F-3-a. Les Labels
XI-F-3-b. Les TextBlock
XI-F-3-c. Les TextBox
XI-F-3-d. Les RichTextBox
XI-F-3-e. Les PasswordBox
XI-F-4. Les cases à cocher et RadioButton
XI-F-4-a. Case à cocher
XI-F-4-b. RadioButton
XI-F-5. Les Listes
XI-F-6. Les boîtes de dialogue
XI-F-6-a. MessageBox
XI-F-6-b. InputBox
XI-F-6-c. PrintDialog
XI-F-6-d. OpenFileDialog
XI-F-6-e. SaveFileDialog
XI-F-6-f. FolderBrowserDialog
XI-F-7. Les Menus et ToolBar
XI-F-8. Les DataGrid
XI-F-7-a. Le DataGrid des WindowsForms
XI-F-7-b. Le DataGrid WPF
XI-F. Les différents contrôles
XI-F-1. Les Conteneurs
Les conteneurs peuvent contenir plusieurs contrôles et permettent de les positionner.
XI-F-1-a. Les Grid
En WPF une Grid est un conteneur, contenant des cellules servant à aligner les contrôles (et pas une grille de données comme dans les Windows forms).
Aller chercher un 'Grid' dans la boite à outils à gauche et la mettre dans une fenêtre vide.
Cela donne dans le code XAML:
<Grid Margin="12,20,9,10" Name="Grid1" />
|
En fait dans VB quand on ajoute une fenêtre vide à un projet, la fenêtre contient déjà une grid.
Pour ajouter des lignes et des colonnes dans la grille, il faut cliquer dans les barres bleutées horizontales ou verticales et positionner les traits.
On voit dans le code XAML les largeurs des colonnes et les hauteurs des lignes.
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="74*" />
<RowDefinition Height="84*" />
<RowDefinition Height="121*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="37*" />
<ColumnDefinition Width="28*" />
<ColumnDefinition Width="31*" />
<ColumnDefinition Width="176*" />
</Grid.ColumnDefinitions>
</Grid>
|
On peut aussi vouloir définir le nombre de ligne et de colonne sans définir leurs largeurs: 3 lignes, 2 colonnes.
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
</Grid>
|
On peut ensuite ajouter des contrôles dans les cellules de la grille pour les positionner.
Pour chaque contrôle ajouté dans une cellule de la grid, on définira ses marges et son ancrage.
Ici on va ajouter une ListBox en bas à droite de la grille( en allant la chercher dans la boite à outils et en la déposant avec la souris), voyons ce que cela donne dans le code xaml.
<Grid Height="279" Name="Grid1" Width="272">
<Grid.RowDefinitions>
<RowDefinition Height="74*" />
<RowDefinition Height="84*" />
<RowDefinition Height="121*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="37*" />
<ColumnDefinition Width="28*" />
<ColumnDefinition Width="31*" />
<ColumnDefinition Width="176*" />
</Grid.ColumnDefinitions>
<ListBox Grid.Column="3" Grid.Row="2" Margin="22,26,21,19" Name="ListBox1">
<ListBoxItem>toto</ListBoxItem>
<ListBoxItem>lululu</ListBoxItem>
</ListBox>
</Grid>
|
ListBox Grid.Column="3" Grid.Row="2" indiquent dans quelle cellule est la ListBox.
Attention la première colonne est Column=0 et la première ligne est Row=0.
On aurait pu ajouter Grid.ColumnSpan=2 pour indiquer que la ListBox occupe 2 colonnes (la 3 et la 4 dans ce cas).
Il existe aussi Grid.RowSpan pour étendre le contrôle sur plusieurs lignes de la Grid.
La aussi Margin="22,26,21,19" indique les distances au conteneur autour de la ListBox.
Comment faire la même chose en VB? la Grid1 étant présente, ajoutons une ListBox comme ci dessus:
Dim lb As New ListBox
lb.Margin = New Thickness(22, 26, 11, 19)
Grid.SetColumn(lb, 3)
Grid.SetRow(lb, 2)
Grid1.Children.Add(lb)
|
Il existe aussi une UniformGrid qui reste similaire à la Grid à la seule différence que dans un UniformGrid les colonnes et les lignes ont forcément la même taille.
Enfin il y a à notre disposition un GridSplitter, qui ressemble au SplitContainer des WindowsForms, il permet de redimensionner les lignes et colonnes pendant de l'exécution de l'application.
XI-F-1-b. Les StackPanel
Arrange les contrôles sur une même ligne qui peut être horizontale ou verticale.
(On parle d'empilement)
En VB:
Dim instance As StackPanel
|
En XAML:
<StackPanel> Children </StackPanel>
|
La valeur par défaut de Orientation du StackPanel est Vertical, aussi les contrôles seront positionnés de haut en bas.
L'attribut Orientation="Horizontal" permet de mettre les contrôles enfant de gauche à droite.
On a ajouté dans le StackPanel un TextBlock et 3 boutons.
En XAML:
<StackPanel >
<TextBlock Margin="6" Padding="3" HorizontalAlignment="Center"
FontFamily="Verdana" FontSize="12" FontWeight="Bold">
Faire un choix:
</TextBlock>
<Button Margin="3,8,3,4" Padding="2">Option 1</Button>
<Button Margin="3,4,3,4" Padding="2">Option 2</Button>
<Button Margin="3,4,3,4" Padding="2">Option 3</Button>
</StackPanel>
|
On voit qu'il suffit de mettre les objets dans le StackPanel.
Ils seront empilés
En VB, voici un autre exemple, qui peut être collé dans la Sub New de Window1:
Dim StackPanel As New StackPanel
StackPanel.Orientation = System.Windows.Controls.Orientation.Horizontal
StackPanel.HorizontalAlignment = System.Windows.HorizontalAlignment.Right
StackPanel.VerticalAlignment = System.Windows.VerticalAlignment.Center
Dim MyButton1 As New Button
Dim MyButton2 As New Button
MyButton1.Content = "bouton1"
MyButton2.Content = "bouton2"
StackPanel.Children.Add(MyButton1)
StackPanel.Children.Add(MyButton2)
Me.content= StackPanel
|
On a instancié des boutons que l'on ajoute à la collection Children du StackPanel.
Enfin, on est probablement dans une Window completement vide, on met donc le StackPanel dans la propriété Content de Me (c'est à dire de la Window ici).
Cela donne
La dimension du bouton est définie par la dimension de son texte.
Si on modifie la hauteur de la fenêtre, on remarque que les boutons sont repositionnés automatiquement toujours au centre de la hauteur grâce au VerticalAlignment. c'est l'avantage du Layout.
On peut insérer un bouton3 supplémentaire à une position définie:
Dim MyButton3 As New Button
MyButton3.Content = "bouton3"
StackPanel.Children.Insert(1, MyButton3)
|
Le bouton2 est automatiquement repositionné.
XI-F-1-c. Les WrapPanel
Le WrapPanel est une variante ou les éléments sont mis à la suite l'un de l'autre mais ou il y a "retour à la ligne" quand on atteint la limite du conteneur.
Exemple : affichons les fichiers du répertoire c: dans un WrapPanel existant:
Dim WrapPanel As New WrapPanel
Dim dirs() As String = Directory.GetFiles("C:\")
For Each f As String In dirs
Dim file As New FileInfo(f)
Dim lbl As New Label
lbl.Width = 100
lbl.Content = file.Name.ToString
WrapPanel.Children.Add(lbl)
Next
Me.Content = WrapPanel
|
L'intérêt de ce contrôle est que si on élargit la fenêtre, l'affichage est automatiquement reformaté ( Il passe de 2 à 3 colonnes ici).
XI-F-1-d. Les DockPanel
Arrange les contrôles soit horizontalement soit verticalement mais en plus les contrôles sont dockés (attachés) à un des bords.
Cela remplace la propriété 'Dock' des windowsForms.
Dans un DockPanel, on met 2 boutons.
On peut utiliser dans la fenêtre de propriété des boutons la propriété DockPanel.Dock:
Pour le premier bouton DockPanel.Dock="Left" met le premier bouton contre le bord gauche.
Pour le second bouton DockPanel.Dock="Left" met le second bouton à gauche contre le premier.
Bel exemple d'une propriété des boutons attachée au DockPanel.
En XAML cela donne:
<DockPanel>
<Button DockPanel.Dock=“Left“>Button</Button>
<Button DockPanel.Dock=“Left“>Button</Button>
</DockPanel>
|
Ne pas oublier qu' on peut donner à Width et à Height la valeur "Auto" afin que le contrôle occupe la totalité de la largeur ou de la hauteur restante.
XI-F-1-e. Les Canvas
Il existe un contrôle Canvas qui permet de positionner des contrôles en indiquant leurs coordonnées (comme dans les Windows Forms), mais il n'y a pas de repositionnement automatique quand on modifie les dimensions de la fenêtre, ce qui limite son intérêt.
On positionne les contrôles avec Canvas.Top et Canvas.Left qui se trouve dans le code de chaque contrôle enfant.
En XAML:
<Canvas>
<Image Source="MyImage.gif" Canvas.Left="100" Canvas.Top="50"/>
<CheckBox Canvas.Top="80" Canvas.Left="0">Check Me</CheckBox>
<RadioButton Canvas.Top="0" Canvas.Left="80">Yes</RadioButton>
</Canvas>
|
XI-F-2. Les Boutons et RepeatButton
XI-F-2-a. Les 'Button'
Pour ajouter un bouton, on clique sur le bouton dans les outils à gauche puis sur le formulaire, on appuie (bouton gauche de la souris), on déplace puis on lâche. Le bouton apparaît.
En bas à droite, on a la fenêtre de propriétés du bouton.
Le nom du contrôle est en haut, après 'Name'.
Dans le designer, la propriété 'Content' contient le texte à afficher sur le bouton.
Si on double-clique sur un bouton, par exemple, on se retrouve dans la procédure évènement correspondante qui est Button1_Click:
Créons un bouton avec du code XAML:
Il faut taper dans la fenêtre XAML:
Cela crée un bouton sur lequel est affiché 'Ok'. Il apparaît en haut.
Faisons plus complet:
<Button Height="39" Margin="40,51,118,0" Name="Button1" VerticalAlignment="Top" Click="OnClick5">Ok</Button>
|
Voyons le détail de cette ligne:
La basile 'Button' crée un bouton.
Name="Button1" indique le nom du contrôle dans le designer.
VerticalAlignment="Top" indique que le contrôle est ancré en haut (il reste toujours à la même distance du bord sur lequel il est ancré. Valeur possible:Top, Bottom, Center.
HorizontalAlignment="Left" même chose pour l'alignement horizontal.
Margin définit la distance par rapport aux bords.
Width="50" Height="30" indiquent les dimensions du bouton (largeur, hauteur).
On peut aussi ajouter MinWidth MinHeight MaxWidth et MaxHeight qui indiquent les tailles minimales et maxilales.
On aurait pu utiliser l'attribut Content="Ok" pour mettre un texte dans le bouton.
Click="OnClick5" indique que l'action de cliquer sur le bouton déclenche la procédure OnClick5.
Cela crée automatiquement, dans le code VB, la routine suivante:
Sub OnClick5(ByVal sender As Object, ByVal e As RoutedEventArgs)
End Sub
|
sender est l'objet qui a déclenché l'évènement.
e contient les arguments de l'évènement, remarquons que e est de type RoutedEventArgs (et pas EventArgs comme dans les Windows Forms).
Dans VB si on n'ajoute pas 'Click=...' dans le code XAML la routine Button1_Click est automatiquement créée.
On peut ajouter du code dans la routine, pour modifier les propriétés du bouton par exemple:
Sub OnClick5(ByVal sender As Object, ByVal e As RoutedEventArgs)
Button1.FontSize = 16
Button1.Content = "Ok Ok.."
Button1.Background = Brushes.Red
End Sub
|
Voici le bouton de départ et le bouton quand on a cliqué dessus.
Pour mettre une image dans un bouton, pas de propriété 'Image'!! il faut avoir le fichier image et ajouter une balise Image:
<Button Height="38" Margin="94,22,14,0" Name="Button2" VerticalAlignment="Top" >
<Image Source="oktransp.GIF"></Image>
</Button>
|
Dans ce cas, pas de texte sur le bouton en même temps qu'une image: content="ok" est refusé car content ne peut contenir plus d'un objet et il y a déjà une image. Pour mettre un texte et une image dans le bouton, il faut mettre un conteneur comme une grid dans le bouton puis mettre dans les cellules de la grid le texte et l'image.
On a choisit un fichier GIF avec un fond 'transparent' ce qui permet de ne pas voir le fond de l'image.
Comment mettre un texte et une Image dans un bouton?
Il faut mettre un StackPanel dans le bouton (puisque celui-ci ne peut contenir qu'un seul objet), dans ce StackPanel mettre un TextBlock et une Image. Le faire en tapant du code XAML (dans le designer VB c'est difficile de mettre un StackPanel dans un Button, il se met dessus et pas dedans, donc copier coller le code XAML). De plus l'image doit être dans les ressources: voirce chapitre.
<Button Name="Button1">
<StackPanel Name="StackPanel">
<TextBlock TextAlignment="Center">
Ok
</TextBlock>
<Image Source="oktransp.GIF" Height="25.704" Width="127.092">
</Image>
</StackPanel>
</Button>
|
Cela donne:
Voir aussi le chapitre sur les ressources.
Bouton par défaut et Cancel.
Le bouton par défaut est activé quand l'utilisateur tape sur 'Enter'. Pour indiquer que le bouton est 'par défaut' il faut ajouter l'attribut IsDefault.
<Button Name="okButton" Click="okButton_Click" IsDefault="True">OK</Button>
|
Le bouton cancel est activé quand l'utilisateur tape sur 'Echap'. Pour indiquer que le bouton est 'Cancel' il faut ajouter l'attribut IsCancel.
<Button Name="cancelButton" IsCancel="True">Cancel</Button>
|
Bouton avec touche d'accès rapide (raccourci):
Il faut autoriser dans le ContentPresenter la reconnaissance des AccesKey puis dans le texte du bouton mettre un '_' avant la lettre désirée:
<Button Margin="0,0,30,15" Name="Button1" HorizontalAlignment="Right" Width="62"
Height="51" VerticalAlignment="Bottom">
<ContentPresenter RecognizesAccessKey="True" Content=" new _button"/>
</Button>
|
Ici le raccourci 'ALT B' déclenchera un click sur le bouton.
Autre exemple d'un bouton contenant du texte avec du gras de l'italique et ayant un ToolTip contenant une image et du texte:
<Button Margin="0,0,271,183">
<Button.ToolTip>
<StackPanel Orientation="Horizontal">
<Image Source="c:/test.jpg" Margin="3"/>
<TextBlock> <Run FontWeight="Bold">Aide contextuelle</Run> <LineBreak/> Un Tooltip formaté avec des images</TextBlock>
</StackPanel>
</Button.ToolTip>
<TextBlock>Exemple de <Run FontWeight="Bold">bouton</Run> avec <Run FontStyle="Oblique">du formatage !</Run></TextBlock>
</Button>
|
Cela donne:
Avec Expression Blend on peut créer des boutons d'aspect plus complexe avec par exemple un gradient de couleur, le code Xaml est beaucoup plus complexe. Exemple correspondant au bouton situé en haut de la page:
<Button HorizontalAlignment="Left" Margin="25,47,0,0" VerticalAlignment="Top" Width="159" Height="47"
Name="Button1" RenderTransformOrigin="0.5,0.5">
<Button.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFFFFFFF" Offset="0"/>
<GradientStop Color="#FFF0E5E3" Offset="0.505"/>
<GradientStop Color="#FFC6C5D7" Offset="1"/>
</LinearGradientBrush>
</Button.Background>
<Button.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleX="1" ScaleY="1"/>
<SkewTransform AngleX="0" AngleY="0"/>
<RotateTransform Angle="0"/>
<TranslateTransform X="0" Y="0"/>
</TransformGroup>
</Button.RenderTransform>
</Button>
|
Créons un bouton avec du code VB:
Dim myButton As New Button
myButton.Content = "ok"
myButton.Background = Brushes.AliceBlue
grid.Children.Add(myButton)
AddHandler myButton.Click, AddressOf click
|
On remarque que comme on crée par code, il faut soit même écrire la gestion des évènements.
Quand on crée le bouton en mode designer, et que l'on double-click sur le bouton, la routine myButton_Click est automatiquement affichée.
Utiliser les évènements:
L'évènement principalement utilisé est le Click(): quand l'utilisateur clique sur le bouton la procédure.
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
_Handles Button2.Click
End Sub
|
est exécutée.
Cette procédure contient le code qui doit être exécuté lorsque l'utilisateur clique sur le bouton.
Le bouton peut être sélectionné grâce à un clic de souris, à la touche ENTRÉE ou à la BARRE d'espacement si le bouton a le focus.
XI-F-2-b. RepeatButton
C'est comme un bouton mais quand on click dessus et qu'on tient le bouton gauche appuyé, il déclenche l'évènement click plusieurs fois.
<RepeatButton Width="100" DockPanel.Dock="Top" Delay="500" Interval="100" Click="Increase">
</RepeatButton>
|
Delay indique à quel moment démarrer l'évènement Click.
Interval indique l'intervalle entre chaque déclenchement.
Click= indique la sub évènement déclenchée par le Click.
Exemple de la routine évènement qui affiche le nombre d'évènement dans un champ text.
Sub Increase(ByVal sender As Object, ByVal e As RoutedEventArgs)
Num = CInt(valueText.Text)
valueText.Text = ((Num + 1).ToString())
End Sub
|
XI-F-3. Les contrôles contenant du texte
Les contrôles permettant de voir ou de modifier du texte sont:
- Les Labels
- Les TextBlock
- Les TextBox
- Les RichTextBox
- Les PasswordBox
XI-F-3-a. Les Labels
Permettent d'afficher du texte, non modifiable et qui ne peut pas prendre le focus mais accepte les raccourcis clavier.
Création d'un label en XAML:
<Label Name="MonLabel" FontSize="20">
Ceci est un cours de programmation
</label>
|
Cela affiche le texte "Ceci est un cours de programmation"
Le nom du label "MonLabel", n'est pas affiché, il sert à accéder à l'élément à partir d'un programme.
Dans le code VB la propriété 'Content' permet de modifier le texte affiché.
Montexte.Content= "nouveau texte"
|
Les labels permettent de créer des 'raccourcis clavier'.
Il y a une propriété nommée Taget qui définit l'élément qui reçoit le focus lorsque l'utilisateur appuie sur la touche d'accès rapide de l'étiquette:
Target="{Binding ElementName=listbox1}" indique que c'est listbox1 qui recevra le focus.
Pour indiquer la touche d'accès rapide (de raccourci) mettre un '_' avant la lettre désirée dans le texte du label.
Exemple: _Liste des noms
Cela donne:
<Label Target="{Binding ElementName=listbox1}" Name="MonLabel" >_Liste des noms</Label>
|
Quand on appuie sur Alt, le L de 'Liste des noms' se souligne indiquant que ALT L est un raccourci clavier.
Si l'utilisateur appuie toujours sur ALT et en même temps sur L, le focus passe sur la ListBox1.
Le label est souvent utilisé à coté d'un autre contrôle de saisie pour lequel il indique la fonction.
Les dimensions du contrôle ne s'adapte pas au texte.
XI-F-3-b. Les TextBlock
Permettent d'afficher du texte sur un formulaire sans possibilité de le modifier. Il est bien adapté pour afficher une ou au maximum quelques lignes.
Pas de raccourci clavier ici mais on peut utiliser le gras, l'italique, les liens Hypertexte.
Prendre un TextBlock dans les outils et le mettre dans un formulaire:
Pour mettre rapidement un petit texte dedans, utiliser la propriété Text.
En VB:
TextBlock1.Text= "Mon texte"
|
Ici pas de texte enrichi.
Le cadre gris ne sera pas affiché.
Cela donne en Xaml:
<TextBlock>
Mon texte
</TextBlock>
|
On peut utiliser les balises Bold (gras), Italic (Italique) pour 'enrichir' le texte.
<TextBlock Name="textBlock1" TextWrapping="Wrap">
<Bold>TextBlock</Bold> est fait pour <Italic>afficher</Italic> du texte.
</TextBlock>
|
On peut rajouter plein d'attributs: Background="AntiqueWhite" TextAlignment="Center"
En VB pour mettre du texte enrichi, on utilise la collection InLine:
Dim textBlock1 = new TextBlock()
textBlock1.TextWrapping = TextWrapping.Wrap
textBlock1.Background = Brushes.AntiqueWhite
textBlock1.TextAlignment = TextAlignment.Center
textBlock1.Inlines.Add(new Bold(new Run("TextBlock")))
textBlock1.Inlines.Add(new Run(" est fait pour "))
textBlock1.Inlines.Add(new Italic(new Run("afficher")))
textBlock1.Inlines.Add(new Run(", du texte "))
|
Les dimensions du contrôle ne s'adapte pas au texte.
XI-F-3-c. Les TextBox
Permettent d'afficher du texte, il est modifiable par l'utilisateur.
La police de caractère, sa taille, la couleur, l'enrichissement des caractères affectent la totalité du texte. Il n'est pas possible d'enrichir (gras, italique..) une partie du texte seulement.
Créons un TextBox en XAML:
Donnons lui un nom:
<TextBox Name="TextBox1"></TextBox>
|
Mettons un texte dedans:
<TextBox Name="TextBox1">Ceci est le texte</TextBox>
|
En VB:
Dim TextBox1 As New TextBox
|
TextBox1.Text contient le texte affiché dans la textBox. AppendText permet d'ajouter du texte.
TextBox1.IsReadOnly=True interdit les modifications du texte.
TextBox1.MaxLines et TextBox1.MinLines permettent de définir si le TextBox est multilignes.( S'ils sont égales à 1, on a une seule ligne).
TextBox1.AcceptEnter=True et TextBox1.AcceptTab=True autorise respectivement le passage à la ligne quand on tape 'Enter' et l'insertion de tabulation. Si AcceptEnter=False, on ne peut saisie qu'une seule ligne.
VerticalScrollBarVisibility=True affiche une scroll bar verticale.
TextBox1.MaxLength permettent de définir le nombre de caractères. 0 pour saisie illimitée.
TextBox1.Clear efface le texte.
TextBox1.LineCount donne le nombre de lignes TextBox1.GetLineText(2) indique le contenu de la ligne numéro 2 (sans oublier que la première ligne est la ligne 0).
Si l'utilisateur a sélectionné du texte, il est dans TextBox1.SelectedText.
TextBox1.SelectionStart, TextBox1.SelectionLength indique la position du premier caractère sélectionné (le premier caractère du texte étant le caractère 0) et le nombre de caractères sélectionnés. On peut utiliser ces propriétés pour sélectionner du texte avec du code ou utiliser TextBox1.Select(3, 2), il existe enfin SelectAll .
Si TextBox1.SpellCheck.IsEnabled = True le correcteur d'orthographe est opérationnel: il souligne les fautes et un click droit permet de voir une liste des corrections possibles:
TexBox.LineDown, LineUp permettent de faire défiler le texte en bas ou en haut . Il existe aussi LineLeft et LineRight PageDown, PagUp, PageRight, PageLeft.
TexBox1.ScrollToHome ScrollToEnd, ScrollToLine permettent de déplacer le texte visible.
On peut aussi utiliser TexBox1.Undo, Redo, Cut, Copy, Paste.
Si le texte est modifié cela déclenche:
Private Sub TextBox1_TextChanged(ByVal sender As System.Object, ByVal e As _
System.Windows.Controls.TextChangedEventArgs) _
Handles TextBox1.TextChanged
End Sub
|
Quand l'utilisateur frappe une touche cela déclenche les évènements KeyDown puis KeyUp (pas de keyPress!!)
Private Sub TextBox1_KeyUp(ByVal sender As Object, ByVal e As System.Windows.Input.KeyEventArgs) _
Handles TextBox1.KeyUp
If e.Key = Key.OemComma Then ...
End Sub
|
On note que la Sub KeyUp a un paramètre e de type System.Windows.Input.KeyEventArgs qui a la propriété Key qui contient la touche tapée. Malheureusement e.Key est en lecture seule!! on ne peut donc pas modifier le caractère tapé!!
XI-F-3-d. Les RichTextBox
Rich Text veut dire 'Texte enrichi'
Le contrôle RichTextBox permet d'afficher, d'entrer et de manipuler du texte mis en forme. Il effectue les mêmes tâches que le contrôle TextBox, mais il peut également afficher des polices, des couleurs pour une partie du texte et des liens, charger du texte et des images incorporées à partir d'un fichier, ainsi que rechercher des caractères spécifiques.
Toutes les propriétés de correction d'orthographe des TextBox s'appliquent aux RichTextBox.
Les RichTextBox en WPF n'affichent pas du RTF comme dans les WindowsForms mais des 'FlowDocument' qui sont en Xml.
En Xaml c'est simple, un FlowDocument est de la forme :
<FlowDocument>
</FlowDocument>
|
Dedans il y a des 'Paragraph', dans les paragraphes il y a le texte à afficher et l'enrichissement à l'aide de balise (Bold par exemple).
<FlowDocument>
<Paragraph>
Ceci est un texte avec une partie
<Bold>en gras</Bold>
</Paragraph>
</FlowDocument>
|
On le met dans une RichTextBox:
<RichTextBox>
<FlowDocument>
<Paragraph>
Ceci est un texte avec une partie
<Bold>en gras</Bold>
</Paragraph>
</FlowDocument>
</RichTextBox>
|
Cela donne:
Le texte est éditable, modifiable.
Dans le code, en VB, cela se complique:
Il faut instancier un FlowDocument, un Paragraph, ajouter une ligne au paragraphe puis ajouter le paragraphe au Blocks du FlowDocument. Enfin il faut affecter à la propriété Document du RichTextBox le FlowDocument.
Dim doc As New FlowDocument
Dim para As New Paragraph
para.Inlines.Add("Ceci est un texte")
doc.Blocks.Add(para)
RichTextBox1.Document = doc
|
Si on veut ajouter l'enrichissement , il faut instancier un Bold, y ajouter le texte, ajouter au paragraphe puis au Block!!
Dim doc As New FlowDocument
Dim para As New Paragraph
para.Inlines.Add("Ceci est un texte avec une partie")
Dim b As New Bold
b.Inlines.Add("en gras")
para.Inlines.Add(b)
doc.Blocks.Add(para)
RichTextBox1.Document = doc
|
Sélectionner la totalité du texte:
Dim tr As New TextRange(RichTextBox1.Document.ContentStart, RichTextBox1.Document.ContentEnd)
MessageBox.Show(tr.Text)
|
C'est du texte non enrichi!!
load save print
Créons un RichTextBox et 3 boutons pour enregistrer lire dans un fichier le texte ou pour l'imprimer.
<RichTextBox Name="richTB">
<FlowDocument>
<Paragraph> <Run>Paragraph 1</Run> </Paragraph>
</FlowDocument>
</RichTextBox>
<Button Click="SaveRTBContent">Enregistre texte </Button>
<Button Click="LoadRTBContent">Charge texte</Button>
<Button Click="PrintRTBContent">Imprime texte</Button>
|
Voici le code VB (donné par microsoft) contenant les 3 routines permettant les 3 actions.
Imports System
Imports System.IO
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Documents
Imports System.Windows.Media
Namespace SDKSample
Public Partial Class SaveLoadPrintRTB
Inherits Page
Private Sub SaveRTBContent(ByVal sender As Object, ByVal args As RoutedEventArgs)
SaveXamlPackage("C:\test.xaml")
End Sub
Private Sub LoadRTBContent(ByVal sender As Object, ByVal args As RoutedEventArgs)
LoadXamlPackage("C:\test.xaml")
End Sub
Private Sub PrintRTBContent(ByVal sender As Object, ByVal args As RoutedEventArgs)
PrintCommand()
End Sub
Private Sub SaveXamlPackage(ByVal _fileName As String)
Dim range As TextRange
Dim fStream As FileStream
range = New TextRange(richTB.Document.ContentStart, richTB.Document.ContentEnd)
fStream = New FileStream(_fileName, FileMode.Create)
range.Save(fStream, DataFormats.XamlPackage)
fStream.Close()
End Sub
Private Sub LoadXamlPackage(ByVal _fileName As String)
Dim range As TextRange
Dim fStream As FileStream
If File.Exists(_fileName) Then
range = New TextRange(richTB.Document.ContentStart, richTB.Document.ContentEnd)
fStream = New FileStream(_fileName, FileMode.OpenOrCreate)
range.Load(fStream, DataFormats.XamlPackage)
fStream.Close()
End If
End Sub
Private Sub PrintCommand()
Dim pd As New PrintDialog()
If (pd.ShowDialog() = True) Then
pd.PrintVisual(TryCast(richTB, Visual), "printing as visual")
pd.PrintDocument((DirectCast(richTB.Document, IDocumentPaginatorSource).DocumentPaginator), _
"printing as paginator")
End If
End Sub
End Class
End Namespace
|
XI-F-3-e. Les PasswordBox
Permet de saisir un mot de passe.
la propriété PasswordChar détermine le caractère affiché à la place des caractères tapés.
En XAML:
<PasswordBox Name="pwdBox" MaxLength="64" PasswordChar="#" PasswordChanged="PasswordChanged" />
|
Ici le fait de taper un mot de passe déclenche la Sub PasswordChanged.
En VB on récupère le mot de passe dans:
XI-F-4. Les cases à cocher et RadioButton
XI-F-4-a. Case à cocher
Créons une case à cocher:
C'est une CheckBox. L'utilisateur peut la cocher ou non en cliquant dessus.
Dans le designer, la propriété Content contient le texte à afficher à coté de la case.
Les évènements les plus utiles sont :Checked et Unchecked.
Private Sub CheckBox1_Checked(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
_Handles CheckBox1.Checked
End Sub
|
Private Sub CheckBox1_Unchecked(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
_Handles CheckBox1.Checked
End Sub
|
Il y a aussi l'évènement Click qui est exécuté lorsqu'on click sur la case.
Private Sub CheckBox1_Click(ByVal sender As Object, ByVal e As System.Windows.RoutedEventArgs)
_Handles CheckBox1.Click
If CheckBox1.IsChecked = True Then MsgBox("c'est coché‚ maintenant")
End Sub
|
On note que la propriété IsChecked permet de voir si la case est cochée ou non.
XI-F-4-b. RadioButton
Les RadioButton peuvent être cochés ou non.
ils sont généralement regroupés pour offrir aux utilisateurs un choix unique parmi plusieurs options, un seul bouton à la fois peut être coché. Si on clique sur un RadioButton dans un groupe, on le sélectionne, cela de-sélectionne les autres.
Vous pouvez regrouper des contrôles RadioButton en les plaçant dans un parent commun ou en leur attribuant un nom de groupe.
Quand un RadioButton est sélectionné, l'événement Checked est déclenché. Comme le montre l'exemple de code suivant, si votre application doit prendre une action quand la sélection de RadioButton change, vous pouvez gérer l'événement Checked.
<RadioButton Name="MyRadioBUtton"
IsChecked="True"
Checked="Myroutine"
GroupName="MyGroupe">
Texte
</RadioButton>
|
XI-F-5. Les Listes
Une ListBox est un contôle WPF qui contient une collection de ListBoxItem. Chaque ListBoxItem a une propriété 'Content'.
Créons une listBox:
On va la chercher dans la boite à outils et on la dépose ici sur une grid.
Dans la fenêtre XAML, cela donne:
<ListBox Name="ListBox1" />
|
Pour être plus complet, il y a aussi les attributs donnant la position de la ListBox dans la Grid et les marges autour:
<ListBox Grid.Column="3" Grid.Row="2" Margin="22,26,21,19" Name="ListBox1" />
|
Grid.Column="3" Grid.Row="2" indiquent les coordonnées de la cellule de la grid.
On peut ajouter des éléments dans la ListBox en mode conception dans le Designer.
Dans la fenêtre "propriétés" de la ListBox cliquer sur le bouton en face de Items. Cela ouvre une fenêtre permettant d'ajouter des éléments à la ListBox
Le bouton "Ajouter" permet d'ajouter des ListBoxItem, chacun ayant des propriétés. La propriété "Content" indique ce que contient chaque ListBoxItem, ici le texte qui sera affiché.
Cela modifie le code XAML en ajoutant les ListBoxItem.
<ListBox Grid.Column="3" Grid.Row="2" Margin="22,26,21,19" Name="ListBox1">
<ListBoxItem>toto</ListBoxItem>
<ListBoxItem>lululu</ListBoxItem>
</ListBox>
|
Pour créer une ListBox puis ajouter des éléments à la ListBox dans le code VB:
Private Sub Window1_Loaded
Dim ListBox1 As ListBox
ListBox1.Items.Add("toto")
ListBox1.Items.Add("lulu")
Grid.Children.Add(ListBox1)
End Sub
|
La ListBox à des procédures évènements dans le code VB. 'MouseDoubleClick' par exemple:
Private Sub ListBox1_MouseDoubleClick(ByVal sender As Object, ByVal e As _
System.Windows.Input.MouseButtonEventArgs) _
Handles ListBox1.MouseDoubleClick
MsgBox(ListBox1.SelectedItem.ToString)
End Sub
|
On remarque que l'élément sélectionné est SelectedItem.
Il y a aussi la procédure:
Private Sub ListBox1_SelectionChanged
|
Comment modifier la couleur de fond de l'élément sélectionné?
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Green" />
|
Mettre des boutons, des cases à cocher dans une listBox:
Les ListBoxItem d'une ListBox ont une propriété nommé 'Content' qui peut contenir un objet: du texte mais aussi une CheckBox, c'est ça la puissance des WPF.
Les CheckedListBox n'existent pas en WPF? On va les créer dans un ListBox1:
Private Sub Window1_Loaded
For i As Integer = 0 To 10
Dim chk As New CheckBox
chk.content = "Option " + i.ToString
Me.ListBox1.Items.Add(chk)
Next
End Sub
|
De la même manière; on peut créer une liste de boutons...
On peut aussi modifier fortement l'affichage des éléments dans un ListBox. Ici par exemple plutôt que d'afficher bêtement une liste de nom, je vais les afficher dans un cadre coloré en fonction du sexe grâce à un modèle de données (Data Template). Voir le chapitre sur les ressources
ListBox Horizontale:
Un ListBox a une propriété ItemsPanel qui permet de définir un ItemsPanelTemplate qui contrôle la disposition des éléments du ListBox. Une méthode consiste à créer un style ListBox et à définir la propriété ItemsPanel:
A mettre dans les ressources de la fenêtre.
<Style TargetType="ListBox">
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"
VerticalAlignment="Center"
HorizontalAlignment="Center"/>
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
</Style>
|
XI-F-6. Les boîtes de dialogue
Les projet WPF permettent d'utiliser des MessageBox et InputBox et des PrintDialog, pour le reste il faut ruser car nativement il n'y a rien d'autre!! (erreur de jeunesse de WPF?)
XI-F-6-a. MessageBox
Fenêtre de dialogue permettant de fournir un message, un titre, des boutons, une image (icône) et éventuellement de retourner une information:
Pas de problème dans un projet WPF, MessageBox appartient à System.Windows.Controls.
Ressemble au MessageBox des 'Windows Forms' sauf qu'on parle d'image et non d'icône, qu'il y a un argument de moins (celui de l'aide) et que les paramètres n'ont pas le même nom parfois!!.
Dans le code VB, on utilise la méthode Show pour afficher la boite.
MessageBox.Show("mon text", "titre", MessageBoxButton.YesNo, MessageBoxImage.Exclamation, _
MessageBoxResult.OK)
|
On doit fournir le texte à afficher, on peut aussi fournir le titre dans la barre, le type de bouton , le type d'image et le bouton par défaut, une option d'affichage.
Exemple:
Afficher simplement un texte d'information:
Affiche une box avec le message et un bouton 'Error', pas de valeur de retour.
Afficher une question et voir sur quel bouton l'utilisateur a cliqué:
Dim rep As String = MessageBox.Show("Annuler", "Attention", MessageBoxButton.OKCancel,
_MessageBoxImage.Exclamation, MessageBoxResult.OK, MessageBoxOptions.RightAlign)
|
Le nom du bouton cliqué par l'utilisateur (de type MessageBoxResult) est retourné dans Rep qui est une String .
On peut ensuite tester sa valeur:
If rep = MessageBoxResult.OK Then
..
End If
|
Paramètres
TexteAAfficher
Obligatoire. Expression String affichée comme message de la boîte de dialogue (longueur maximale 1 024 caractères comme dans les WIndows Forms?). N'oubliez pas d'insérer un retour chariot si le texte est long, cela crée 2 lignes.
Titre
Expression String affichée dans la barre de titre de la boîte de dialogue. Si l'argument Titre est omis, il n'est rien affiché (voir premier exemple).
TypeBouton
-le nombre et le type de boutons à afficher (MessageBoxButton sans 's' maintenant):
- MessageBoxButton.OK = Un seul bouton 'Ok'
- MessageBoxButton.YesNo = Deux boutons 'Oui' 'Non'
- MessageBoxButton.OkCancel = 'Ok' et 'Annuler'
- MessageBoxButton.YesNoCancel :
Image
-l'icône à utiliser
- MessageBoxImage.Error
- MessageBoxImage.Exclamation
- MessageBoxImage.Information
- MessageBoxImage.Question
et aussi
- MessageBoxImage.Asterisk
- MessageBoxImage.Hand
- MessageBoxImage.Warning
- MessageBoxImage.Stop
- MessageBoxImage.None
L'identité du bouton par défaut.
- MessageBoxResult.Ok
- MessageBoxResult.Cancel
Les options
MessageBoxOptions.RightAlign
Comme d'habitude, il suffit de taper MessageBox.Show( pour que VB proposer les paramètres).
Retour de la fonction :
Retourne une constante de type MessageBoxResult ( et non plus DialogResult comme dans les Windows Forms) qui indique quel bouton à été pressé.
- MessageBoxResult.Yes
- MessageBoxResult.No
- MessageBoxResult.Cancel
- MessageBoxResult.Retry
- MessageBoxResult.Ok
XI-F-6-b. InputBox
Pose une question, retourne une String contenant la réponse tapée par l'utilisateur.
Pas de problème dans un projet WPF, InputBox appartient à System.Windows.Controls.
Dim Nom As String
Nom = InputBox("Bonjour", "Tapez votre nom ?")
|
XI-F-6-c. PrintDialog
Pas de problème dans un projet WPF, PrintDialog appartient à System.Windows.Controls. (Ne pas confondre avec PrintDialog de System.Windows.Forms)
Cette Classe va plus loin que l'ancienne car elle permet donc d'afficher la boite de dialogue mais aussi d'imprimer. On peut faire l'un ou l'autre ou les 2.
Il faut instancier une PrintDialog qui permet d'afficher la boite de dialogue 'Imprimer' avec ShowDialog et/ou d'imprimer avec la méthode PrintDocument.
Exemple:
On crée un bouton ayant comme texte 'Imprimer' en XAML.
<Button Height="33" Margin="41,0,68,12" Name="Button1" >Imprimer</Button>
|
Dans le code, on affiche la boite de dialogue d'impression.
Private Sub Button1_Click
Dim pDialog As New PrintDialog()
pDialog.PageRangeSelection = PageRangeSelection.AllPages
pDialog.UserPageRangeEnabled = True
Dim print As Boolean = pDialog.ShowDialog()
If print = True Then
End If
End Sub
|
XI-F-6-d. OpenFileDialog
Fenêtre de dialogue permettant de choisir un fichier à ouvrir:
Elle n'existe pas en Wpf on va donc utiliser la boite de dialogue standard de Windows.
Il faut donc importer l'espace Microsoft.Win32 en haut du module pour pouvoir l'utiliser!!
Puis, par exemple quand on clique sur le bouton Buttom1, cela ouvre la boite de dialogue permettant de choisir un fichier.
Private Sub Button1_Click
Dim dlg As New OpenFileDialog
dlg.ShowDialog()
Dim fichier As String = dlg.FileName
End Sub
|
Le nom du fichier à ouvrir est dans la propriété FileName.
XI-F-6-e. SaveFileDialog
Fenêtre de dialogue permettant de choisir un nom de fichier d'enregistrement.
Elle n'existe pas en Wpf.
Il faut importer l'espace Microsoft.Win32 en haut du module pour pouvoir l'utiliser!!
Puis, par exemple quand on clique sur le bouton Buttom1, ouvrir la boite de dialogue permettant de choisir un fichier.
Private Sub Button1_Click
Dim dlg As New SaveFileDialog
dlg.ShowDialog()
Dim fichier As String = dlg.FileName
End Sub
|
XI-F-6-f. FolderBrowserDialog
Fenêtre de dialogue permettant de choisir un répertoire:
Elle n'existe pas en Wpf et n'est pas dans Win32.
Pour cela on va faire de l'interopérabilité entre WPF et Windows Forms:
Il faut ajouter dans les références (menu 'Projet', 'Propriétés de..'; onglet 'Références' bouton 'Ajouter') System.Windows.Forms
Il faut importer l'espace System.Windows.Forms en haut du module pour pouvoir l'utiliser!!
On aurait pu écrire :Imports System.Windows.Forms mais comme certains éléments sont dans plusieurs espaces de nom et entraînent des ambiguïtés, on va importer avec un alias (swf qui sera l'alias de System.Windows.Forms) :
Imports swf = System.Windows.Forms
|
Puis, par exemple quand on clique sur le bouton Buttom1, on ouvre la boite de dialogue permettant de choisir un répertoire.
Private Sub Button1_Click
Dim dlg As New swf.FolderBrowserDialog
dlg.ShowDialog()
Dim fichier As String = dlg.SelectedPath
MessageBox.Show(fichier)
End Sub
|
De la même manière on peut ouvrir
FontDialog
PrintPreviewDialog
ColorDialog
Ce n'est pas du WPF!!
XI-F-7. Les Menus et ToolBar
La balise Menu permet de créer un menu, les MenuItem permettent d'ajouter les items des menus et sous-menus.
Le Header permet de donner le libellé du menu.
<Grid>
<Menu>
<MenuItem Header="Calcul">
<MenuItem Header="Calcul somme"/>
<Separator/>
<MenuItem Header="Calcul différence"/>
</MenuItem>
</Menu>
...
</Grid>
|
Ici on a un menu 'Calcul' et 2 sous-menus 'Calcul somme' et 'Calcul différence'.
Le fait d'ajouter un MenuItem dans un MenuItem crée un sous-menu.
On remarque que ,bien sur ,le menu est dans le conteneur principal, ici une grid.
La balise 'Separator' permet d'ajouter une ligne de séparation entre les sous-menus.
On peut ajouter une touche de raccourci:
<MenuItem Header="_Find" InputGestureText="Ctrl+F"/>
|
Il faut gérer l'évènement 'Click' du menu pour que quand l'utilisateur du logiciel clique sur un item cela exécute une routine:
<Menu>
<MenuItem Header="Calcul">
<MenuItem Header="Calcul total"
Click="Total_Click"/>
</MenuItem>
</Menu>
|
Quand on clique sur le sous-menu 'Calcul total' la Sub Total_Click s'exécute (Elle est dans le code VB).
Private Sub Total_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
MsgBox("hello")
End Sub
|
On peut ajouter facilement des sous-menus couper, copier, coller (grâce à 'Command') et des sous-menus coché/décoché (grâce à 'IsCheckable="True"'):
<Menu>
<MenuItem Header="_Edition">
<MenuItem Command="ApplicationCommands.Copy"/>
<MenuItem Command="ApplicationCommands.Cut"/>
<MenuItem Command="ApplicationCommands.Paste"/>
</MenuItem>
<MenuItem Header="_Font">
<MenuItem Header="_Gras" IsCheckable="True"
Checked="Bold_Checked"
Unchecked="Bold_Unchecked"/>
<Separator/>
<MenuItem Header="_Italic" IsCheckable="True"
Checked="Italic_Checked"
Unchecked="Italic_Unchecked"/>
</MenuItem>
<MenuItem Header="Calcul">
<MenuItem Header="Calcul total"
Click="Total_Click"/>
<Separator/>
<MenuItem Header="Calcul différence" IsCheckable="True"
Checked="Italic_Checked"
Unchecked="Italic_Unchecked"/>
</MenuItem>
</Menu>
|
Il faut des Sub nommées 'Bold_Checked', 'Bold_Unchecked', 'Italic_Checked'.
On peut ajouter un style au menu pour en modifier l'aspect: Ici grâce à un Style, on va modifier la couleur de fond de tous les MenuItem:
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<Style TargetType="{x:Type MenuItem}">
<Setter Property = "Background" Value= "LightBlue"/>
</Style>
</Window.Resources>
|
On peut modifier le Style quand un évènement se déclenche: Si le 'Target' est le survol du MenuItem, mettre le texte en rouge:
<Window.Resources>
<Style TargetType="{x:Type MenuItem}">
<Style.Triggers>
<Trigger Property="MenuItem.IsMouseOver" Value="true">
<Setter Property = "Foreground" Value="Red"/>
<Setter Property = "FontSize" Value="12"/>
<Setter Property = "FontStyle" Value="Italic"/>
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
|
Comment ajouter une image à un MenuItem?
<MenuItem Header="Calcul total"
Click="Total_Click">
<MenuItem.Icon>
<Image Source="c:/test.jpg" Width="20" Height="20" ToolTip="Calcul" ToolTipService.HasDropShadow="True"/>
</MenuItem.Icon>
</MenuItem>
|
En plus on a mis un ToolTip sur l'image!!
Pour les ToolBar on utilise la basile ToolBarTray qui permet de positionner les ToolBar. La position de chaque ToolBar est dépendante de la Band (de haut en bas) et de la BandIndex qui permet de définir des groupes dans la band.
Dans chaque ToolBar on met des boutons.
<Grid>
<ToolBarTray >
<ToolBar Band="1" BandIndex="1">
<Button Click="Total_Click" ToolTip="Open">
<Image Source="C:/test.JPG" Height="52" Width="78" />
</Button>
<Button>
<Image Source="C:/test1.JPG" />
</Button>
<Button>
<Image Source="c:/test2.jpg" />
</Button>
</ToolBar>
<ToolBar Band="2" BandIndex="1">
<Button>
<Image Source="c:/test3.jpg" />
</Button>
<Button>
<Image Source="c:/test4.jpg" />
</Button>
</ToolBar>
<ToolBar Band="2" BandIndex="2">
<Button>
<Image Source="c:\test.jpg" />
</Button>
<Button>
<Image Source="c:/test.jpg" />
</Button>
<Separator/>
<Button>
<Image Source="c:/test.jpg" />
</Button>
<Button>
<Image Source="c:/test.jpg" />
</Button>
</ToolBar>
</ToolBarTray>
</Grid>
|
Ici on a 2 bands, 2 groupes de boutons dans la seconde band, on peut ajouter des séparators.
Dans le premier bouton (uniquement pour ne pas alourdir l'exemple) on gére l'évènement Click et on ajoute un ToolTip.
XI-F-8. Les DataGrid
Les datagrid sont des grilles du style tableur, ou on peut afficher des données.
XI-F-7-a. Le DataGrid des WindowsForms
On peut utiliser le DataGrid des WindowsForms. C'est un bel exemple de l'intégration d'un contrôle non WPF dans l'interface WPF.
Dans le code Xaml de la Window, il faut importer les espaces de nom:
xmlns:wfint="clr-namespace:System.Windows.Forms.Integration;assembly=WindowsFormsIntegration"
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
|
Ensuite, toujours en Xaml on met la DataGrid:
<wfint:WindowsFormsHost Height="100" Width="200">
<wf:DataGrid x:Name="myDataGridWF"><wf:DataGrid>
<wfint:WindowsFormsHost>
|
Enfin, on peut l'utiliser en VB:
DataTable dt = new DataTable()
dt.Columns.Add("Colonne 1", typeof(string))
dt.Columns.Add("Colonne 2", typeof(string))
dt.Rows.Add("Ligne1")
myDataGridWF.DataSource = dt
|
XI-F-7-b. Le DataGrid WPF
Dans les WPF du Framework 3.5, pas de DataGrid WPF.
Microsoft en propose un gracieusement dans les ToolKit.
Il faut avoir installer la mise à jour SP1 du Framework 3.5, charger le ToolKit ( à cette adresse: "http://www.codeplex.com/wpf/Release/ProjectReleases.aspx?ReleaseId=15598"), puis l'installer.
Dans le Framework 4 , à partir de vb 2010 le DataGrid est déjà là; Il n'y a rien à installer.
Ensuite dans la boite à outils on a:
On peut maintenant déposer un DataGrid dans la Window.
Cela ajoute le code Xaml suivant:
<my:DataGrid Name="DataGrid1" xmlns:my="http://schemas.microsoft.com/wpf/2008/toolkit" />
|
On va maintenant, grâce à un binding, remplir la DataGrid avec une ObservableCollection de NomPerson:
Dans un module de classe on ajoute la ObservableCollection 'Names' (voir le code dans le chapitre sur le binding). Puis on ajoute le code VB qui instancie MyNames et qui relie DataGrid et MyNames:
Class Window1
Public MyNames As New Names
Private Sub Window1_Loaded(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) _
Handles MyBase.Loaded
DataGrid1.DataContext = MyNames
End Sub
|
Enfin on ajoute dans le code xaml de la grid le ItemsSource:
<my:DataGrid Name="DataGrid1" xmlns:my="http://schemas.microsoft.com/wpf/2008/toolkit"
ItemsSource="{ Binding }"/>
|
Et là, en exécution , la grille se remplit automatiquement:
Si on ajoute un élément à la collection avec le code VB suivant, la DataGrid est mise à jour ( c'est l'avantage de la ObservableCollection).
MyNames.Add(New NomPerson("toto", "Zorro"))
|
Les sources présentés sur cette page sont libres de droits,
et vous pouvez les utiliser à votre convenance. Par contre cette page de présentation de ces sources constitue une oeuvre intellectuelle protégée par les droits d'auteurs. Copyright © .
Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu :
textes, documents, images, etc sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à 3 ans de prison et jusqu'à 300 000 E de dommages et intérêts.
Cette page est déposée à la SACD.
|
