Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

Les Contrôles WPF Z Julien DOLLON Dotnet France Association 2 Les Contrôles WPF

Les Contrôles WPF Z Julien DOLLON Dotnet France Association 2 Les Contrôles WPF [07/01/09] Sommaire 1 Introduction ..................................................................................................................................... 3 2 Les contrôles de base ...................................................................................................................... 4 2.1 Gestion du texte en WPF ......................................................................................................... 4 2.1.1 TextBlock ......................................................................................................................... 4 2.1.2 TextBox ............................................................................................................................ 6 2.1.3 RichTextBox ..................................................................................................................... 7 2.2 Boutons ................................................................................................................................... 8 2.3 Gestion de formulaires ............................................................................................................ 9 2.3.1 CheckBox ......................................................................................................................... 9 2.3.2 RadioButton ................................................................................................................... 10 2.3.3 ComboBox ..................................................................................................................... 10 2.4 Listes et hiérarchies de données ........................................................................................... 12 2.4.1 ListView ......................................................................................................................... 12 2.4.2 TreeView ........................................................................................................................ 13 3 Les contrôles complexes ............................................................................................................... 14 3.1 Les éléments principaux ........................................................................................................ 14 3.1.1 Menu ............................................................................................................................. 14 3.1.2 ToolBar et StatusBar ...................................................................................................... 20 3.2 Les éléments secondaires ...................................................................................................... 21 3.2.1 TabControl ..................................................................................................................... 21 3.2.2 Expander ........................................................................................................................ 23 4 Les contrôles utilisateurs ............................................................................................................... 25 4.1 Qu’est ce qu’un UserControl ? .............................................................................................. 25 4.2 Création pas à pas d’un UserControl ..................................................................................... 26 4.2.1 Interface Graphique ...................................................................................................... 26 4.2.2 Code Behind .................................................................................................................. 29 4.2.3 Réutilisation d’un UserControl ...................................................................................... 31 5 Conclusion ..................................................................................................................................... 31 Dotnet France Association 3 Les Contrôles WPF [07/01/09] 1 Introduction Après avoir vu comment disposer nos contrôles dans une fenêtre en WPF et les différents panels qui existent, nous allons voir quels sont les contrôles proposé par WPF, comment les utiliser et ce qu’ils nous permettent de faire ? Mais pour commencer qu’est‐ce qu’un contrôle ? Un contrôle c’est tout simplement un objet du Framework .NET. Il est donc fournit par le Framework, ce qui va nous permettre de gagner énormément de temps. Vous vous rendrez compte que la plupart de ces contrôles étaient déjà présent avec les WinForms. En revanche il faut garder à l’esprit qu’un contrôle est avant toute chose un objet, un élément d’une fenêtre qui va permettre à l’utilisateur de cette dernière d’interagir avec la couche métier de notre application. Ce chapitre est extrêmement important car il en découlera les chapitres sur les Templates, très important en WPF, et la création de nos propres contrôles. Pour finir, de nombreux développeurs ont tendance à faire de plus en plus abstraction de l’IHM et à se concentrer sur la couche métier. En revanche il faut garder à l’esprit que moins l’IHM sera facile d’utilisation moins les fonctionnalités métier de votre application seront facile d’accès ! C’est pourquoi je vous invite à être attentif et à connaître l’utilité de chacun des contrôles qui vous seront présenté ici de façon à pouvoir varier et choisir le bon contrôle le moment venu. Dotnet France Association 4 Les Contrôles WPF [07/01/09] 2 Les contrôles de base 2.1 Gestion du texte en WPF Nous verrons dans cette partie les contrôles qui permettent la manipulation de texte en WPF. Vous noterez en revanche que nous ne parlerons pas du label, tout simplement car il n’a pas changé avec WPF. 2.1.1 TextBlock Un TextBlock ou System.Windows.Controls.TextBlock est un contrôle destiné à être léger et par conséquent à afficher de petites quantités de texte. Un TextBlock peut contenir toute les propriétés de contenu de type Inlines, c'est‐à‐dire Bold, Italic, Hyperlink etc. Pour ce première exemple nous verrons comment déclarer un TextBlock en XAML et en C# mais par la suite nous conserverons seulement le XAML. Comme vous pouvez le voir rien de sorcier cela reste similaire à ce qu’on a vu précédemment dans le cours sur le layout WPF au niveau de la déclaration en XAML. Comme vous pouvez le voir à l’intérieur de notre TextBlock on a utilisé deux propriétés de type Inlines Bold et Italic. Pour ce qui est de la déclaration en C# : //C# TextBlock textBlock1 = new TextBlock(); textBlock1.TextWrapping = TextWrapping.Wrap; textBlock1.Name = "DFTextBlock"; Thickness myThickness = new Thickness(); myThickness.Bottom = 10; myThickness.Left = 10; myThickness.Right = 10; myThickness.Top = 10; textBlock1.Margin = myThickness; textBlock1.Height = 170; textBlock1.Width = 215; textBlock1.FontWeight = FontWeights.UltraBold; textBlock1.Text = "Dotnet-France formez vous pour passer vos certifications"; this.Content = textBlock1;  <TextBlock Name="DFTextBlock" Margin="10,10,10,10" TextWrapping="Wrap" Height="170" Width="215"> <Bold>Dotnet-France</Bold> formez vous pour passer vos <Italic>certifications</Italic> </TextBlock> Dotnet France Association 5 Les Contrôles WPF [07/01/09] On arrive au résultat suivant : ’ VB Dim textBlock1 As New TextBlock() textBlock1.TextWrapping = TextWrapping.Wrap textBlock1.Name = "DFTextBlock" Dim myThickness As New Thickness() myThickness.Bottom = 10 myThickness.Left = 10 myThickness.Right = 10 myThickness.Top = 10 textBlock1.Margin = myThickness textBlock1.Height = 170 textBlock1.Width = 215 textBlock1.FontWeight = FontWeights.UltraBold textBlock1.Text = "Dotnet-France formez vous pour passer vos certifications" Me.Content = textBlock1 Dotnet France Association 6 Les Contrôles WPF [07/01/09] 2.1.2 TextBox Un TextBox ou System.Windows.Controls.TextBox est un contrôle qui offre la possibilité d’entrer du texte simple dans vos applications WPF. Il fonctionne pratiquement de la même manière qu’avec les WinForms, le dépaysement ne sera donc pas total : nous allons juste rajouter une notion d’XAML. Voici comment on déclare une textbox en XAML : Dans notre exemple vous pouvez voir qu’on peut limiter le nombre de caractères que peut contenir la Textbox, très pratique dans un formulaire ou on a besoin par exemple d’une référence avec un nombre de caractères bien définis. Comme on le verra tout à l’heure une Textbox requiert moins de ressources qu’une RichTextBox en revanche elle ne permet pas autant de choses. La Textbox permet tout de même d’avoir accès aux fonctionnalités de vérification orthographique en temps réel et à un menu contextuel.  <TextBox Height="23" Name="DFTextBox" MaxLength="12" Width="120"> Démo </TextBox> Dotnet France Association 7 Les Contrôles WPF [07/01/09] 2.1.3 RichTextBox Une RichTextBox ou System.Windows.Controls.RichTextBox est un contrôle d’édition avancé qui propose plus de fonctionnalité que la TextBox. En effet, comme on a pu le voir, les fonctionnalités proposées par une Texbox restent tout de même limitées. La RichTextBox va posséder les mêmes fonctionnalités de base qu’une Textbox avec en plus la possibilité de mettre en forme notre texte ou encore avoir du contenu tel que des images des tableaux etc., tout cela fait un peu penser aux WYSIWYG. Voici comment déclarer une RichTextBox en XAML : Comme vous pouvez le voir ici, nous avons décidé d’implémenter à notre RichTextBox l’option de correction orthographique qui peut s’avérer être très pratique. Pour ce faire, nous avons utilisé la propriété SpellCheck.IsEnabled qu’on a défini à True puis on a spécifié la langue grâce à la propriété Language. Ainsi en deux temps trois mouvements on a une entrée texte avec correction orthographique dans notre programme. Et voici le résultat :  <RichTextBox SpellCheck.IsEnabled="True" Language="en-us" Height="100" Name="DFRichTextBox" Width="200" /> Dotnet France Association 8 Les Contrôles WPF [07/01/09] 2.2 Boutons Nous allons maintenant baser notre étude sur un contrôle de base mais très important dans notre application, ce contrôle est bien sûr le bouton en WPF System.Windows.Controls.Button. Concrètement, le bouton va permettre à votre utilisateur d’exécuter l’action en cours de façon explicite. Pour créer un bouton, rien de très difficile, tout en continuant dans notre lancé sur du code XAML, voici comment se déroule la déclaration d’un bouton en XAML : Et voici le Résultat : On ne se penchera pas ici sur la gestion des événements liés à ce bouton car comme énoncé précédemment les événements sont le sujet des chapitres suivants que je vous invite donc à consulter.  <Button Height="50" Name="DFButton" Width="150">Exit</Button> Dotnet France Association 9 Les Contrôles WPF [07/01/09] 2.3 Gestion de formulaires Nous allons continuer notre découverte des contrôles de WPF par celle des contrôles de formulaires. Un formulaire est clairement ce qui va proposer à l’utilisateur un espace de saisi dans l’interface de votre programme, cet espace de saisi n’est bien sûr pas limité à des contrôles comme les Textbox ou Richtextbox mais peut aussi être des CheckBox, RadioButton ou encore ComboBox comme on pourra le voir dans cette partie. 2.3.1 CheckBox Les CheckBox ou System.Windows.Controls.Checkbox sont utilisé dans une application généralement pour présenter une option à l’utilisateur qu’il peut activer ou désactiver. Les CheckBox peuvent avoir par contre 3 états : activé, désactivé et indéterminé. Vous pouvez utiliser une CheckBox seule, comme par exemple pour que l’utilisateur décide de se loger automatiquement… Ou plusieurs pour la même question comme par exemple pour un moteur de recherche immobilier ou on choisirait de rechercher une villa avec 2 OU 3 chambres. Voici comment en XAML on déclare une CheckBox : Comme on peut l’observer rien de très compliqué encore une fois, voici le résultat que nous donne ce code : Pour exploiter en C# une TextBox il suffit d’utiliser la méthode IsChecked qui renvoie un booléen, true si coché false dans le cas contraire.  <CheckBox Height="16" Name="DFCheckBox1" Margin="79,0,79,102"> Célibataire </CheckBox> <CheckBox Height="16" Name="DFCheckBox2" Margin="79,0,79,50"> Divorcé </CheckBox> Dotnet France Association 10 Les Contrôles WPF [07/01/09] 2.3.2 RadioButton Pour continuer sur les contrôles de formulaires on va étudier maintenant le RadioButton ou System.Windows.Controls.RadioButton. Le but d’un radio bouton est de donner le choix et un seul et unique choix parmi un ensemble de propositions/options. En effet, on ne peut sélectionner qu’un seul RadioButton à la fois. C’est la seule convergence qu’il y a entre la CheckBox et le Radiobutton. En effet on va continuer d’utiliser la méthode IsChecked pour vérifier si le RadioButton est sélectionné ou pas. Généralement pour ce type de sélection nous apprécions utiliser un StackPanel, uploads/Management/ les-controles-wpf.pdf