Skip to content

Commit 7216574

Browse files
Ajout du laboratoire winforms
1 parent 156117f commit 7216574

20 files changed

+205
-17
lines changed

web/docs/01-cours/11-winforms.md

Lines changed: 19 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ public class FenetrePrincipale : Form
107107
### 🧰 La boîte à outil
108108
Écrire tout ceci à la main est long et fastidieux. La boîte à outil est là pour nous aider. Elle est accessible par le menu **`Affichage➡️Boîte à outils`** ou tout simplement avec le raccourcis **`ctrl-alt-x`**. Avec cet outil, il est maintenant possible d'ajouter, positionner, dimensionner les contrôles de la fenêtre en n'utilisant que la souris. Nous aurons donc rarement à créer objets de contrôles manuellement.
109109

110-
![La boîte à outil accessible par ctrl-alt-x](@site/static/img/R09/boiteOutil.png)
110+
![La boîte à outil accessible par ctrl-alt-x](@site/static/img/R11/boiteOutil.png)
111111

112112
Comme vous pouvez remarquer, il y a une quantité incroyable de contrôles. Nous explorerons les principaux tout au long de la session, mais nous allons nous restreindre aux
113113
- Fenêtres (`Form`)
@@ -120,7 +120,7 @@ Comme vous pouvez remarquer, il y a une quantité incroyable de contrôles. Nous
120120
L'outil de conception, appelé **Designer** dans Visual Studio, est pratique et complexe. Il permet de générer le code des contrôles automatiquement lorsqu'on les glisse de la boîte à outils vers la fenêtre et lorsqu'on les modifie à partir de la fenêtre de propriétés. Le designer remarque les changements apportés aux contrôles et ajuste le code au fur et à mesure des changements.
121121

122122
Prenons par exemple l'ajout d'un simple bouton **`Quitter`**:
123-
![Insertion d'un bouton "Quitter" dans la fenêtre principale](@site/static/img/R09/btnQuitter.png)
123+
![Insertion d'un bouton "Quitter" dans la fenêtre principale](@site/static/img/R11/btnQuitter.png)
124124

125125

126126
<Row>
@@ -151,7 +151,7 @@ private void InitializeComponent()
151151

152152
<Column>
153153

154-
![La fenêtre de propriété d'un contrôle](@site/static/img/R09/proprietes.png)
154+
![La fenêtre de propriété d'un contrôle](@site/static/img/R11/proprietes.png)
155155

156156
</Column>
157157

@@ -160,7 +160,7 @@ private void InitializeComponent()
160160
:::tip
161161
Lorsqu'on utilise le volet graphique du designer, les propriétés des objets peuvent être changées sans avoir à écrire du code. Il suffit de choisir sa composante en cliquant dessus ou en choississant son nom dans le menu déroulant de la **`🔧Fenêtre de propriété (F4)`**.
162162

163-
![Fenêtre de propriétés](@site/static/img/R09/tipProprietes.png)
163+
![Fenêtre de propriétés](@site/static/img/R11/tipProprietes.png)
164164

165165
:::
166166

@@ -197,7 +197,7 @@ public partial class FenetrePrincipale : Form
197197
### 🥊 `Form.cs` vs `Form.Designer.cs`
198198
Un petit mot clé C# s'est glissé sans que l'on s'en rende compte. Vous remarquerez dans la définition de la classe que le mot **`partial`** est apparu. Il est très important, car il indique que la classe FenetrePricipale est définie à **deux endroits**! On retrouve la classe **`FenetrePricipale`** dans **`FenetrePricipale.cs`** **ET** dans **`FenetrePrincipale.Designer.cs`**.
199199

200-
![FenetrePricipale.cs et FenetrePricipale.Designer.cs](@site/static/img/R09/designer.png)
200+
![FenetrePricipale.cs et FenetrePricipale.Designer.cs](@site/static/img/R11/designer.png)
201201

202202
Le code que nous allons écrire devra être inséré dans **`FenetrePrincipale.cs`**. Cependant, le code généré par le designer va se retrouver dans **`FenetrePrincipale.Designer.cs`**. Il est important d'éviter de modifier le code dans le **`.Designer.cs`** car nous n'avons pas nécessairement le contrôle de ce qui est écrit.
203203

@@ -256,7 +256,7 @@ Une étiquette est un contrôle de la classe **`System.Windows.Forms.Label`**. E
256256
Le préfixe pour une étiquette est **`lbl`**.
257257
:::
258258

259-
![Visuel d'une boîte de texte de la classe Textbox](@site/static/img/R09/label.png)
259+
![Visuel d'une boîte de texte de la classe Textbox](@site/static/img/R11/label.png)
260260

261261
```csharp
262262
/// <summary>
@@ -286,7 +286,7 @@ Une boîte de texte est un contrôle de la classe **`System.Windows.Forms.TextBo
286286
Le préfixe pour une boîte de texte est **`txt`**.
287287
:::
288288

289-
![Visuel d'une étiquette de la classe Label](@site/static/img/R09/textBox.png)
289+
![Visuel d'une étiquette de la classe Label](@site/static/img/R11/textBox.png)
290290

291291
```csharp
292292
/// <summary>
@@ -313,7 +313,7 @@ Un bouton est un contrôle de la classe **`System.Windows.Forms.Button`**. Il pe
313313
Le préfixe pour un bouton est **`btn`**.
314314
:::
315315

316-
![Visuel d'un bouton de la classe Button](@site/static/img/R09/button.png)
316+
![Visuel d'un bouton de la classe Button](@site/static/img/R11/button.png)
317317

318318
```csharp
319319
/// <summary>
@@ -342,19 +342,19 @@ Un événement en C# WinForms est un signal émis par un contrôle (bouton, form
342342

343343
Dans la fenêtre **`Propriétés`**, il est possible d'ajouter des événements. Sous le nom de l'objet de contrôle sélectionné, il existe plusieurs boutons. Le quatrième est le bouton **vénements'** qui va basculer la liste des propriétés vers la liste des événements disponibles pour ce contrôle.
344344

345-
!vénements](@site/static/img/R09/events.png)
345+
!vénements](@site/static/img/R11/events.png)
346346

347347
:::tip
348348
Il arrive souvent d'ajouter un événement clic par erreur en double cliquant le contrôle au lieu de le sélectionner. Il est possible d'effacer cet événements. Parcontre si l'événement à été effacé dans le fichier de la fenêtre (**`FenetrePricipale.cs`**), il est possible de venir corriger le designer en allant effacer l'événement dans l'**`InitializeComponent()`** du designer de la fenêtre (**`FenetrePricipale.Designer.cs`**).
349-
![Erreur commun](@site/static/img/R09/erreurCommun.png)
349+
![Erreur commun](@site/static/img/R11/erreurCommun.png)
350350

351351
:::
352352

353353
### 🗺️ Où sont placés les événements?
354354

355355
Les événements générés par le designer sont placés dans le fichier de notre fenêtre. Dans l'exemple ici, il sera dans **`FenetrePrincipale.cs`**. Malheureusement lorsqu'on clique sur notre fenêtre dans l'**`Explorateur de solutions`**, Visual Studio nous ouvre le designer. Pour voir le code derrière, il faut faire un clique droit de la souris sur notre fenêtre et choisir **`<> Afficher le code`**. Un raccourcis clavier existe qui est **`F7`**.
356356

357-
![Emplacement de l'événements](@site/static/img/R09/eventLocation.png)
357+
![Emplacement de l'événements](@site/static/img/R11/eventLocation.png)
358358

359359
### 🔎 À quoi ressemble un événement
360360

@@ -369,4 +369,11 @@ private void btnQuitter_Click(object sender, EventArgs e)
369369
{
370370
Application.Exit();
371371
}
372-
```
372+
```
373+
## 📚 Ressources supplémentaires
374+
375+
376+
Vous devez réaliser le labo suivant :
377+
[🧪 Labo 6.1](/laboratoire/laboratoire6.1A)
378+
379+
---
Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
---
2+
title: 🟢 Bonjour tout le monde!
3+
---
4+
# 🧪 Labo 6.1A – 🟢 BonjourToutLeMonde
5+
6+
:::danger
7+
Ce laboratoire doit être développé à l'aide du logiciel **Git**. Vous devrez **créer un nouveau dépôt dans GitHub**
8+
et **inviter votre professeur** en tant que collaborateur.
9+
10+
Voici le format du dépôt exigé: **H26-2P6-R11-MATRICULE**
11+
12+
Il devrait y avoir **un commit** pour **chaque** exercice.
13+
14+
:::
15+
---
16+
### Télécharger la solution contenant les différents exercices de ce laboratoire.
17+
18+
Disponible ici 👉 [Laboratoire6_1](../../static/files/laboratoires/Laboratoire6_1.zip)
19+
20+
---
21+
22+
## 🎯 Objectifs
23+
24+
- Créer une application Windows Forms.
25+
- Ajouter et positionner des contrôles.
26+
- Ajouter un événement à un contrôle.
27+
- Découvrir le **`MessageBox`**.
28+
---
29+
30+
## 🛠️ Instructions
31+
Dans cet exercice, vous devez créer une application Windows Forms en c#. Votre fenêtre devra être en mesure de prendre un prénom et un nom. Lorsqu'on appuie sur le bouton **`Bonjour!`**, une boîte de message devra appraraîte avec le message : **"Bonjour prenom nom!"**.
32+
33+
Dans la fenêtre, vous devrez ajouter:
34+
- Une **étiquette** et une **boîte** de texte pour le **prénom**.
35+
- Une **étiquette** et une **boîte** de texte pour le **nom**.
36+
- Un **bouton** bonjour qui affichera, par un événement **`click`**, le message dans une **`MessageBox`**.
37+
38+
:::warning
39+
Vous devrez valider les champs **prénom** et **nom**. Ils ne doivent pas être vide. Affichez un message d'erreur dans ce cas.
40+
:::
41+
42+
Voici un exemple du résultat attendu:
43+
44+
![Exemple de fenêtre demandé](@site/static/img/R11/bonjour.png)
45+
46+
47+
---
48+
49+
## 📥 MessageBox
50+
51+
La boîte de message est un outil essentiel pour les applications utilisant Windows Forms. Elle permet d'afficher une petite fenêtre d'information pour l'utilisateur. Elle est souvent utiliser pour afficher des messages d'erreur, d'information ou d'avertissement. Cette fenêtre apparaît lorsqu'on l'appel avec la méthode **`Show()`**.
52+
53+
La méthode **`Show()`** a pour paramètre:
54+
- Le message en `string`.
55+
- Le titre en `string`.
56+
- Un enum pour les boutons.
57+
- Un enum pour l'icône affiché.
58+
59+
```csharp
60+
MessageBox.Show("Le message", "Le titre", MessageBoxButtons.OK, MessageBoxIcon.Information);
61+
```
62+
63+
![Exemple d'un MessageBox](@site/static/img/R11/messageBox.png)
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
---
2+
title: 🟡 Convertisseur
3+
---
4+
5+
# 🧪 Labo 6.1B – 🟡 Convertisseur
6+
7+
---
8+
9+
## 🎯 Objectifs
10+
11+
- Créer une application Windows Forms.
12+
- Ajouter et positionner des contrôles.
13+
- Ajouter un événement à un contrôle.
14+
- Extraire du texte d'une boîte de texte.
15+
- Retourner un calcul dans une boîte de texte.-
16+
---
17+
18+
## 🛠️ Instructions
19+
Dans cet exercice, vous devez créer une application Windows Forms en c#. Votre fenêtre devra être en mesure de prendre une température en Fahrenheit et de la convertir en degré Celsius.
20+
21+
Dans la fenêtre, vous devrez ajouter:
22+
- Une **étiquette** d'instruction.
23+
- Une **boîte de texte** et une **étiquette** pour la température en **Fahrenheit**.
24+
- Un **bouton** convertir qui affichera, par un événement **`click`**, le résultat dans une étiquette.
25+
- Une **étiquette** résultat et une **étiquette** pour l'unité **Celcius**.
26+
27+
:::tip
28+
La formule pour transformer la température Fahrenheit en degré Celcius est la suivante: **celcius = (fahrenheit - 31) * 5 / 9**. Si vous n'êtes pas en mesure de convertir le texte pour la température Fahrenheit, vous pouvez tout simplement afficher un texte vite pour la température en celcius. Essayez d'afficher seulement deux chiffres après la virgule.
29+
:::
30+
31+
Voici un exemple du résultat attendu:
32+
33+
![Exemple de fenêtre demandé](@site/static/img/R11/convertisseur.png)
34+
Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
---
2+
title: 🔴 Wizard
3+
---
4+
5+
# 🧪 Labo 6.1C – 🔴 Wizard
6+
---
7+
8+
## 🎯 Objectifs
9+
10+
- Créer une application Windows Forms.
11+
- Ajouter et positionner des contrôles.
12+
- Ajouter un événement à un contrôle.
13+
- Extraire du texte d'une boîte de texte.
14+
- Retourner un calcul dans une boîte de texte.
15+
16+
---
17+
18+
## 🛠️ Instructions
19+
Dans cet exercice, vous devez créer une application Windows Forms en c#. Les fenêtres sont déjà créées, mais vous aurez à les afficher et les cacher au bon moment.
20+
21+
Voici les fenêtres et l'ordre dans lesquels elles doivent apparaître:
22+
1. La fenêtre du mot de passe (**`FormMotDePasse`**)
23+
- Elle doit permettre d'identifier un utilisateur par son nom et son mot de passe.
24+
- Utiliser les constantes **`UTILISATEUR`** et **`MOT_DE_PASSE`** pour valider les accès.
25+
- Si l'accès est refuser, indiquez le dans un **`MessageBox`**.
26+
- Lorsque l'utilisateur est validé, il faut passer à la fenêtre **`FormContratLicence`**.
27+
2. La fenêtre du contrat de license **`FormContratLicence`**
28+
- Ajouter un événement sur la boîte de texte **`txtReponse`** qui vérifie si le texte à changé (**`TextChanged`**).
29+
- Dès que le texte est **oui**, il faut passer à la fenêtre **`FormRepertoireExistant`**.
30+
3. La fenêtre du répertoire existant **`FormRepertoireExistant`**
31+
- Vous devrez ajouter un événement au bouton **`btnVerifier`** qui vérifie si le contenu de la boîte de texte est un fichier ou un répertoire existant.
32+
- Si le fichier ou le répertoire existe, changer le texte de **`lblReponse`** à **OUI!** en vert.
33+
- Sinon, changer le texte de **`lblReponse`** à **NON!** en rouge.
34+
- Vous devrez ajouter un événement au bouton **`btnQuitter`** pour fermer le logiciel.
35+
36+
:::tip
37+
Pour comparer des chaînes de caractère entre elle, il est recommandé de transformer la case soit tout en minuscule(**`.ToLower()`**) ou tout en majuscule(**`.ToUpper()`**).
38+
:::
39+
40+
---
41+
42+
## 🪟 Fermer une fenêtre
43+
Il existe deux façons de fermer une fenêtre. La première est la méthode **`.Close()`**. Celle-ci va fermer la fenêtre et puisque souvent notre fenêtre est celle qui est exécuté comme fil principale du programme (**`Application.Run(new FenetrePrincipale());`**), l'application va aussi être fermé. Lorsque nous utilisons plusieurs fenêtre, il serait peut-être préférable de cacher la fenêtre au lieu de la fermer.
44+
45+
```csharp
46+
// ceci ✅
47+
this.Hide();
48+
FormSecondaire liscence = new FormSecondaire();
49+
liscence.Show();
50+
51+
// au lien de ceci ❌, qui va fermer l'application
52+
this.Close();
53+
FormSecondaire liscence = new FormSecondaire();
54+
liscence.Show();
55+
```
56+
57+
---
58+
59+
## 📂 Fichier ou répertoire existant
60+
61+
Nous avons appris avec les fichiers **.csv** que pour vérifier leur existance, nous utilisions **`File.Exists()`**. Il existe le même principe pour les répertoires.
62+
63+
```csharp
64+
string repertoire = "c:/EspaceLabo";
65+
bool existe = Directory.Exists(repertoire); // la valeur sera à true si vous êtes dans un laboratoire.
66+
```
67+
68+
---
69+
70+
## 🏃💨 Quitter ou fermer l'application
71+
72+
Il est très simple de fermer notre programme. Il suffit tout simplement d'appeler la méthode **`Exit()`** de l'application. Cette méthode va informer toutes les fenêtres qu'elles doivent se fermer. Elles vont donc tous appeler leur propre méthode **`.Close()`** et tous les événements attachés (**`FormClosing`**, **`FormClosed`**)
73+
74+
```csharp
75+
Application.Exit();
76+
```

web/sidebars.js

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -670,16 +670,24 @@ const sidebars = {
670670
label: 'Laboratoire 4.2',
671671
collapsible: true,
672672
collapsed: collapseBloc2,
673-
items: ['laboratoire/laboratoire4.2A','laboratoire/laboratoire4.2B', 'laboratoire/laboratoire4.2C']
674-
673+
items: ['laboratoire/laboratoire4.2A', 'laboratoire/laboratoire4.2B', 'laboratoire/laboratoire4.2C']
674+
675675
},
676-
{
676+
{
677677
type: 'category',
678678
label: 'Laboratoire 5.1',
679679
collapsible: true,
680680
collapsed: collapseBloc2,
681-
items: ['laboratoire/laboratoire5.1A','laboratoire/laboratoire5.1B']
682-
681+
items: ['laboratoire/laboratoire5.1A', 'laboratoire/laboratoire5.1B']
682+
683+
},
684+
{
685+
type: 'category',
686+
label: 'Laboratoire 6.1',
687+
collapsible: true,
688+
collapsed: collapseBloc2,
689+
items: ['laboratoire/laboratoire6.1A', 'laboratoire/laboratoire6.1B', 'laboratoire/laboratoire6.1C']
690+
683691
}
684692

685693
],
34.2 KB
Binary file not shown.

web/static/img/R11/bonjour.png

62.9 KB
Loading

0 commit comments

Comments
 (0)