C#2 (csharp 2) : dessiner avec gdi+ (partie 1)

I. Introduction à gdi avec c#2

GDI+ (Graphical Device Interface) permet de dessiner des formes (lignes, rectangles, ellipses...) ou du texte, mais aussi de manipuler des images. Il n'a pas la puissance de DirectX mais il est relativement facile à utiliser à condition de le connaître un minimum.

Ce tutorial est divisé en deux parties. La première (celle-ci) un peu théorique présente sommairement des outils qui seront utilisés dans la seconde partie, plus pratique. Je ne détaillerai pas toutes les propriétés et méthodes des outils traités ici le but étant simplement d'assurer une prise en main minimum. Les fichiers d'aide vous permettront ensuite d'approfondir vos connaissances en fonction de vos besoins.

II. Explications

Commençons par examiner quelques outils intervenant dans l'utilisation du GDI+ :

- la gestion des couleurs (color)

- les stylos (pen)

- les brosses (brush)

- l'outil graphique

2.1 - La gestion des couleurs

Difficile d'imaginer le dessin sans couleurs. Dans C# plusieurs méthodes permettent de préciser ou modifier une couleur.

2.1.1 - La classe Color

La classe Color permet de spécifier une couleur soit en reprenant une de ses constantes, soit en créant une couleur en mélangeant le rouge, le vert et le bleu (RVB ou RGB en anglais).

Pour changer la couleur de fond (BackColor) d'une fenêtre Form1 en bleu on écrit dans le code de la forme :

this.BackColor = Color.Blue;

ou :

this.BackColor = Color.FromArgb(0, 0, 255);

Dans la pratique l'utilisation des contantes de Color est plus simple. Vous accédez à la liste des couleurs disponibles grâce à Intellisense en tapant Color. :

tuto csharp gdi image 1

2.1.2 - La classe SystemColors

Cette classe de permet de récupérer et appliquer une couleur système, laquelle peut donc varier d'un poste à l'autre selon le règlage des préférences.

Si je veux que ma Form1 ait la couleur jaune des infobulles j'écris :

this.BackColor = SystemColors.Info;

Là aussi utilisez intellisense ou l'aide en ligne dont voici un extrait :

tuto csharp gdi image 2

2.2 - Les stylos (Pen)

Pour dessiner nous avons bien sûr besoin de stylos (pen). Pour les utiliser vous devrez avoir inclus dans votre projet les espaces de noms suivants :

using System.Drawing;
using System.Drawing.Drawing2D;

La classe Pen comprend quatre constructeurs :

Pen (Brush) : crée un stylo avec le pinceau (Brush) spécifié d'une épaisseur de un pixel,

Pen (Color): crée un stylo avec la couleur spécifiée d'une épaisseur de un pixel,

Pen ( Brush, Single) : où Single est un float, crée un stylo avec le pinceau (Brush) et de l'épaisseur spécifiés,

Pen ( Color, Single): où Single est un float, crée un stylo avec la couleur et de l'épaisseur spécifiés.

Pour créer un stylo rouge d'une épaisseur de 5 pixels on écrit :

Pen stylo = new Pen (Color.Red, 5);

2.3 - Les pinceaux (Brush)

Cette classe sert de base à 5 classes dérivées :

SolidBrush : peinture unie

HatchBrush : peinture avec hachures

TextureBrush : peinture avec une texture

LinearGradientBrush et PathGradientBrush : peinture avec dégradé de couleur

SolidBrush et TextureBrush font partie de l'espace de nom System.Drawing. HatchBrush, LinearGradientBrush et PathGradientBrush de l'espace de nom System.Drawing.Drawing2D.

Pour créer un pinceau uni de couleur jaune on écrit :

Brush pinceau = new SolidBrush(Color.Yellow);

2.4 - L'outil graphique (la classe Graphics)

Pour dessiner avec GDI+ nous avons besoin d'un objet Graphics. Cet objet se crée ainsi :

Graphics graphic = CreateGaphics();

Une fois créé, nous pourrons utiliser ses méthodes pour dessiner ou afficher :

du texte (DrawString)

des lignes (DrawLine)

des rectangles (DrawRectangle, DrawRectangles, FillRectangle et FillRectangles)

des ellipses ( DrawEllipse et FillEllipse)

des courbes (DrawCurve, DrawClosedCurve et FillClosedCurve)

des courbes de béziers (DrawBezier)

des arcs (DrawArc)

des grapiques en forme de camembert (DrawPie)

des images (DrawImage et DrawImageUnscaled)

A noter que Microsoft conseille de libérer l'objet Graphics après utilisation par un Dispose, et ce pour une meilleure gestion de la mémoire. Nous retrouverons ainsi le code suivant :

Graphics graphic = CreateGaphics();

........ // ici notre code de création de dessins

graphic.Dispose();

Vous trouverez souvent également le code suivant :

using (Graphics graphic = CreateGaphics())

{

........ // ici notre code de création de dessins

}

ce qui revient au même car à la fin du using, Dispose() est automatiquement appelé.

Pour dessiner une ligne jaune d'une épaisseur de 2 pixels du point 10,10 au point 50,50 nous écrirons le code suivant :

Graphics graphic = CreateGaphics();

graphic.DrawLine(new Pen (Color.Yellow),2,new Point (10,10),new Point(50,50));

graphic.Dispose();

III. Conclusion du tutorial

Cette première partie est terminée. Rendez-vous dans la seconde pour mettre en pratique. Une fois la seconde étape lue, vous pourrez revoir chaque outil abordé superficiellement ici et parfaire vos connaissances en épluchant l'aide en ligne :) .