I. Création d'un composant pas à pas

Dans ce tutoriel nous allons donc voir comment créer un composant visuel pour WinForms. (Dans l'environnement .Net ce type de composant s'appelle un "Contrôle".) Quand il sera terminé, ce composant apparaîtra donc sur la palette des composants, vous n'aurez plus qu'à le poser sur une Winform pour l'utiliser. Les explications données sur l'EDI seront celles de C# Builder, le code étant le même, quel que soit l'EDI. N'ayant pas Visual Studio .Net à ma disposition, je ne pourrai pas vous éclairer à ce sujet, mais je suppose que le principe est semblable. Nous créerons pour l'exemple un LabelDate, composant qui affichera la date du jour, soit en chiffres, soit en lettres.

II. Création du composant

Sur le menu faire "Fichier" puis "Nouveau" puis "Bibliothèque de classe C#" ce qui a pour effet d'ouvrir la boîte de dialogue "Nouvelle application".

Image non disponible Image non disponible

Nous remplacerons la valeur de son champ Nom "ProjectX" par "Composant", ce sera le nom du projet. Puis faire "OK".
Maintenant nous avons le code source minimum pour notre composant :

Fichier Class.cs :

 
Sélectionnez
using System;



namespace Composant

{

  /// <summary>

  /// Description Résumé de Class.

  /// </summary>

  public class Class

  {

    public Class()

    {

      //

      // TODO : Ajouter ici la logique du constructeur

      //

    }

  }

}

Maintenant, il nous faut ajouter les références aux assemblages nécessaires au projet. En l'occurrence System.Drawing et System.Windows.Forms. Pour cela, faites un clic droit sur le gestionnaire de projet puis sur le PopupMenu choisir "Ajouter une référence…", ce qui nous ouvre la boîte de dialogue "Ajouter une référence" (voir image si dessous). Dans la liste du haut sélectionner System.Drawing puis faire "Ajouter référence", faire la même opération pour System.Windows.Forms, puis faire "OK". Maintenant nos deux références sont visibles dans la liste des références du gestionnaire de projet.

Image non disponible

III. Code du composant

Class.cs :

 
Sélectionnez
using System;

using System.Drawing;

using System.Windows.Forms;

using System.ComponentModel;



namespace Composant

{



  public class LabelDate : Label   // Hérite de Label

  {

    private bool flettre;

    private DateTime d1;

    //--------------------------------------------------------

    // Nouvelle propriété



    [Category("Appearance"),

     Description("Affiche la date en lettres si à true sinon en chiffres."),

     DefaultValue(true)]



    public bool Lettre      // Propriété Lettre

    {

       get

       {

      return flettre;

       }

       set

       {

      flettre = value;

      SetTexte();

       }

    }

   //--------------------------------------------------------

    public LabelDate() : base()    // Constructeur

    {

      flettre = true;

      d1 = DateTime.Now;

      Size = new System.Drawing.Size(200, 30);

      TextAlign = System.Drawing.ContentAlignment.MiddleCenter;

    }

   //--------------------------------------------------------

    protected void SetTexte()

    {

      if (flettre) Text = d1.ToLongDateString();

      else Text = d1.ToShortDateString();

    }

   //--------------------------------------------------------

    protected override void OnCreateControl()

    {

      base.OnCreateControl();

      SetTexte();

    }

   //--------------------------------------------------------

    protected override void OnTextChanged( EventArgs e )

    {

      Invalidate();

    }

  }

}

Nous y renommons la Classe "Class" en "LabelDate", ceci est important, car ce sera le nom du composant. (Renommer aussi son constructeur.) Elle héritera de la classe Label.
Nous y ajoutons les directives "using" pour System.Drawing, System.Windows.Forms et System.ComponentModel. .
Nous déclarons deux données membres d1 de type DateTime et flettre de type bool. Le constructeur appellera le constructeur de la classe héritée. (Base.) Nous y initialiserons quelques propriétés héritées (Size et TextAlign), d1 avec la date du jour actuel et flettre à true.
Nous redéfinissons la méthode OnCreateControl pour initialiser la propriété Text de notre composant (cette propriété ne peut pas s'initialiser à la construction) par l'appel de SetTexte, dans cette dernière, on affecte à Text la date en chiffres ou en lettres en fonction de la valeur de flettre.

Nouvelle propriété :
Nous allons maintenant créer la nouvelle propriété qui nous permettra d'afficher la date en chiffres ou en lettres. La valeur de cette propriété sera conservée dans la donnée membre privé "flettre". Elle aura pour nom "Lettre" et sera bien sûr du même type que la donnée membre lui correspondant, elle sera déclarée "public" pour y avoir accès de l'extérieur de la classe. Ce qui la différencie d'une donnée membre ordinaire, c'est qu'elle possède deux méthodes : "get" et "set" servant à lire ou modifier sa valeur. Ce système permet de garder l'encapsulation des données tout en utilisant les propriétés comme si elles étaient des données membres déclarées public. Donc sa méthode "get" retourne la valeur contenue dans flettre et sa méthode "set" affecte la nouvelle valeur à flettre, puis rafraîchit l'affichage du composant. (On y trouve souvent la méthode Invalidate, quand il s'agit de rafraîchir un dessin.) Dans le cas de notre label nous appellerons SetLettre pour changer son texte en fonction de la valeur de flettre. Le rafraîchissement se fera dans la méthode OnTextChanged qui est appelée automatiquement quand le texte du label a changé.
Autre avantage d'une propriété, c'est que l'on y a accès à la conception par l'intermédiaire de l'inspecteur d'objet. (Voir image ci-dessous.)

Image non disponible



Juste avant la définition de la propriété Lettre on peut voir ces lignes entre crochets :

 
Sélectionnez
    [Category("Appearance"),

     Description("Affiche la date en lettres si à true sinon en chiffres"),

     DefaultValue(true)]

Ce sont les attributs de la propriété, ils doivent être définis avant chaque propriété que l'on a définie dans notre composant, ici ils servent à l'agencement de la propriété dans l'inspecteur d'objet. Category sélectionne la rubrique de propriétés où l'on veut voir apparaître la propriété. (Voir liste dans l'aide : Bibliothèque de classes -> System.ComponentModel ->CategoryAttribute) Description en donne une description qui apparaîtra dans la statut bar sous l'inspecteur d'objets et DefaultValue donne sa valeur par défaut. (En leur absence la propriété sera mise dans une catégorie nommée "Divers".)
À ce stade notre composant n'est toujours pas visible dans la palette, donc il nous faut l'installer. Ce que nous allons voir dans les étapes suivantes.

IV. Icône représentant le composant sur la palette de composants

Avant de compiler notre composant, nous allons lui ajouter une icône personnalisée qui le représentera sur la palette de composants. (Si vous ne faites pas cette opération, vous aurez l'icône par défaut.) Pour cela vous devez créer une image de dimension 16 x 16 pixels et l'enregistrer au format bitmap avec le même nom que la classe, donc pour notre labelDate ce sera "LabelDate.bmp". Puis il faut l'ajouter au projet pour cela faire dans le menu : "projet" puis "Ajouter au projet…" ce qui ouvre la boîte de dialogue "Ajout au projet" choisir type de fichier "Bmp (*.bmp)" puis sélectionner le fichier "LabelDate.bmp" préalablement créé et faire "Ouvrir".

V. Installation du composant sur la palette

Avant de l'installer, il nous faut d'abord le compiler. Pour cela, faire sur le menu : "Projet" puis "Construire Composant". Si vous n'avez aucun message d'erreur, c'est que tout s'est bien passé. Un Assembly nommé "Composant.dll" a été créé. C'est lui qui contient le composant. Nous allons donc le mettre sur la palette, pour cela sur le menu faites : "Composant" puis "Composant .Net installé…" Ce qui nous ouvre la boîte de dialogue "Composant .Net installé" Cliquer sur son bouton "Sélectionner assemblage…" ce qui nous ouvre la boîte de dialogue "Accéder à un assemblage ou exécutable", sélectionner l'Assembly "Composant.dll" créé lors de la précédente compilation et faire "Ouvrir". Maintenant votre composant va se trouver dans la liste de la boîte de dialogue "Composant .Net installé" onglet "Composant .Net installé".

Image non disponible

Faites "Ok", votre composant est maintenant installé. Il est visible dans la palette de composants. Vous pouvez le tester sur un nouveau projet.

Image non disponible



Bonne composition.
CGi

Avec la contribution de Stessy pour la relecture.

Télécharger les sources.