Prise en main de Visual studio

Visual Studio est l'environnement de développement proposé par Microsoft. Il permet d'utiliser différents langages et ceci au sein d'un même projet. Cet environnement allège un certain nombre de tâches, mais contrairement à VB6 le code généré n'est pas masqué, ce qui pourra troubler dans un premier temps. Nous allons le découvrir ici.

1) Création d'un projet.

fig 1 création d'un projet visuel de type C#

Nous avons sélectionné une application Windows en C#.

Cliquer sur OK.

Le projet s'ouvre sur le projet avec différentes fenètres, dont l'une correspondant au formulaire de démarrage.

Si nous ouvrons l'explorateur de solutions (Affichage/Explorateur de solutions), nous obtenons l'écran suivant :

fig 2 Eléments d'un projet

Le projet AppliTest contient :

• les références utilisées (bibliothèques -espaces de nommage en C#- nécessaires à l'application)
• App.ico : ressource de type icône qui représentera le projet dans le navigateur Windows; cette icône peut être modifiée en ouvrant le fichier App.ico
• un fichier AssemblyInfo.cs, fichier fournissant des informations sur le projet
• le formulaire Form1.cs, fichier en C#, c'est lui qui va être utilisé pour le développement.

2) Un exemple.

Si l'on déroule la boite à outils (sur la gauche) on fait apparaître les composants graphiques disponibles.

fig 3 composants disponibles

• Cliquez, glissez sur le formulaire deux composants, un TextBox et un Bouton :
  
  
  fig 4 le formulaire avec deux composants graphiques

• Chaque composant a des propriétés :
  
  

fig 5 propriétés d'un objet Bouton

Si cette fenètre de propriétés n'est pas visible, on peut faire (après avoir sélectionné le bouton) Affichage/Fenêtre propriétés

Remarquez que si un sélectionne le TextBox, la fenêtre de propriétés concernent cette fois un objet TextBox.

A retenir : chaque objet à sa fenêtre de propriété propre (même si on retrouve des propriétés communes).

• Modifions les propriétés d'un objet.
  

Parmi les propriétés d'un objet, l'une joue un rôle particulier -la propriété name- . C'est grâce à cette propriété que l'on peut utiliser un objet dans un programme. Cette propriété -comme pour toute variable- doit avoir une valeur ayant un sens.

A retenir : lorsque l'on dépose un objet, il faut modifier sa propriété Name en premier lieu.

Pour nommer un objet il faut utiliser des règles -de nommage-, par exemple :

- Pour un bouton : btnValider

- Pour une zone de texte : txtNom

- Pour un label : lblTitre

- Pour une liste déroulante : lstAdresse

A retenir : les objets doivent avoir un nom signifiant (utiliser toujours les mêmes règles de nommage)

fig 5 modification de la propriété Name (btnOK) et de la propriété Text (Valider)

Remarque : la propriété Text valorise la légende qui apparaîtra à l'utilisateur.

• Lancement du projet.

Le projet est lancé en appuyant sur F5 ou en cliquant sur la flèche bleue du menu.
On voit apparaître la fenêtre suivante :

fig 6 projet en mode exécution

A retenir : pour lancer un projet on fait F5

• Ajout de code.

Nous allons écrire le code permettant de réaliser l'interface suivante :

fig 7 exercice 1

Pour réaliser cela, revenir en mode conception (fermer la fenêtre d'exécution) et effectuer les modifications :

fig 8 modification en mode conception

Remarque : pour faire ces modifications, il faut faire apparaître la fenêtre de propriété relative à l'objet concerné.

Analyse : l'utilisateur saisit un message dans la zone de texte, lorsque l'on clique sur le bouton, le label en est modifié.

Il faut donc invervenir sur l'événement click du bouton.

• Faire apparaître le gestionnaire d'événement concernant l'événement click : on double-click sur le bouton.

Une procédure -en fait méthode ici- apparaît

Ecrire le code suivant dans la méthode :

private void btnOk_Click(object sender, System.EventArgs e)
{
             lblBonjour.Text = "Bonjour " + txtNom.Text;
}

Commentaire : la propriété Text du label (lblBonjour.Text) va être valorisée par la concaténation (opérateur +) de chaînes de caractères, "Bonjour" et la valeur de la propriété Text de la zone de texte (txtNom.Text)

A retenir : le code s'écrit dans les gestionnaires d'événement -pas uniquement, on le verra plus loin-

• Evolution.

Ajoutons un bouton (btnRaz) qui va effacer les contenus de la zone de texte et du label.

fig 9 ajout d'un second bouton.

Travail à faire.

Ecrire le code nécessaire. Tester en lançant l'application.

Solution

Lorsque l'on écrit du code, on doit utiliser l'environnement et l'aide contextuelle :

fig 10 utilisation de l'aide contextuelle

A retenir : utiliser l'aide contextuelle, cela permet de vérifier que le nom de l'objet existe.

Approfondissement. Observation du code de la page.

Lorsque l'on regarde la page de code on peut remarquer :

fig 11 page de code

On peut plier le code en cliquant sur les signe - (moins) :

fig 12 code "plié"

3) Une petite application. Le jeu "plus grand, plus petit"

Fermer le projet précédent et ouvrir un nouveau projet, appelez-le jeuPlusMoins.

Description.

Il s'agit de faire truover à un utilisateur un nombre compris entre 1 et 1000 en 8 essais maximum. Pour chacun des essais, on informe l'utilisateur en lui disant si son essai est inférieur, supérieur ou égal au nombre cherché.

fig 13 interface du jeu

Analyse .

Dès le lancement du jeu, l'application choisit un nombre aléatoire, l'essi numéro 1 s'affiche; à chaque pression sur le bouton "Tester"un test est fait sur le contenu de la zone de texte saisie, une boite de message s'affiche, le numéro de l'essai s'incrémente et s'affiche pour l'essai suivant. Si le numéro d'essai dépasse 8 le bouton "Tester" est invalidé.

Ressources.

Un certain nombre de variables doivent être déclarées dans le formulaire :

public class Form1 : System.Windows.Forms.Form
       {
        private System.Windows.Forms.TextBox txtEssai;
        private System.Windows.Forms.Label lblNumEssai;
        private System.Windows.Forms.Button btnTester;
        private System.Windows.Forms.Button btnEffacer;
        private int nbCherche;
        private int numEssai;
        private const int MAX = 8; 
        ...

travail à faire.

Construire l'interface en tenant compte des noms des composants fournis ici. Ajouter les deux variables et la constante

Réalisation. Première étape

On va uniquement afficher le nombre aléatoire suivi par l'interface prête pour le premier essai :

fig 14 ouverture

Ressources.

• Pour générer un nombre aléatoire, on donne le code suivant :
  Random r = new Random();
  nbCherche = r.Next(1000);
• Pour afficher une boite de dialogue :
  MessageBox.Show(nbCherche.ToString());

Travail à faire.

Ecrire le code nécessaire pour réaliser ce qui est demandé. tester

Solution

Approfondissement.

• Pour afficher une boite de message, on utilise MessageBox.Show("texte à afficher") ; l'argument doit être une chaîne de caractères, il se trouve que nbCherche est un entier. La boite de message ne "sait" pas afficher un nombre, il faut donc convertir le nombre en chaîne de caractères -nbCherche.ToString()-. Le langage C# est très sensible au type des variables, il faudra donc toujours utiliser les types attendus.

Réalisation. Deuxième étape

Travail à faire.

Terminer le programme. Tester

Ressources :

int nb = Convert.ToInt32(txtEssai.Text); // permet de convertir le contenu de la zone de texte en entier, cf l'approfondissement plus haut

btnTester.Enabled=false; // invalide le bouton

Solution.

Evolution du jeu.

1. Possibilité de rejouer

Dans le cas précédent, si l'on veut rejouer, il faut relancer l'application. Nous allons remédier à cela en proposant une nouvelle interface.

fig 15 évolution avec possibilité de rejouer

Le bouton Commencer le jeu permet de lancer le jeu ou de le recommencer.

Travail à faire.

Ajouter un bouton btnDebut. Faites apparaître son gestionnaire d'événement pour le click.

Déplacer le code nécessaire. Tester.

Solution

2. Chronométrage.

On se propose de proposer un temps miminum, ici une minute. Le temps restant apparaîtra à l'utilisateur :

fig 16 Evolution avec chronomètre

Nous allons utiliser un objet Timer présent dans les composants :

fig 17 objet Timer

Déposer un objet Timer sur le formulaire. Le Timer possède deux propriétés importantes Enabled (false par défaut) et Interval qui correspond à l'intervalle séparant deux événements -en millième de seconde- Ici le Timer est réglé à une seconde. Ainsi l'événement :

private void timer1_Tick(object sender, System.EventArgs e)
{

}

aura lieu chaque seconde, et le code écrit dans son gestionnaire d'événement se fera toute les secondes. On fait apparaître le gestionnaire d'événement en double-cliquant sur le Timer.

Travail à faire.

Ajouter un Label -lblTemps- dans le formulaire. Ajouter une constante MAXTEMPS et une variable tempsRestant. Tester

Solution

Tavail à faire

Ecrire le code nécessaire à la gestion de l'affichage du temps restant. Activer le timer dans le démarrage, ne pas oublier de désactiver le bouton Tester dans le cas ou le temps restant est terminé. Tester

Solution