Module ACSI : TP1 : Notions de base

1


Que fait-on avec WinDev ?
WinDev est un AGL (Atelier de Gnie Logiciel) complet permettant de dvelopper des applications
Windows dans de nombreux domaines : gestion, industrie, mdicale,...
En standard, WinDev inclut un puissant moteur de base de donnes HyperFileSQL. Le moteur
HyperFileSQL est disponible en version rseau, et en version Client/Serveur. De nombreuses autres
bases de donnes peuvent tre utilises.
Concepts de base
Pour crer un excutable. WinDev propose de crer un projet. Un projet relie entre eux les diffrents
lments du programme, et les organise. C'est partir du projet que pourra tre cr le programme
excutable.
Si votre application manipule des donnes. WinDev permet de dfinir la structure de la base de
donnes grce l'analyse. L'analyse WinDev contient la description des fichiers (appels souvent
Tables dans de nombreuses bases de donnes). Ces fichiers contiendront les donnes de
l'application.
Remarque : la description des fichiers de donnes dans lanalyse nentrane pas leur cration. Les
fichiers de donnes sont crs physiquement uniquement lexcution de l'application.
WinDev permet de crer simplement une application.
Un programme excutable est un fichier compos dlments directement manipulables par
lutilisateur (fentres, tats imprims....). Cest ce que lance l'utilisateur final dune application.
Le L5G (Langage de 5me Gnration) de WinDev, le WLangage est trs simple.
Une application est un outil qui permet de raliser des tches ou des actions automatiquement.
Une application est constitue d'un programme excutable (ou d'un ensemble de programmes
excutables), de librairies, de fichiers de donnes,...
Un ou plusieurs projets WinDev peuvent tre lis la mme analyse. Dans ce cas, on parle d'analyse
partage. Par exemple, une application de gestion commerciale peut tre spare en plusieurs modules
excutables. Chaque module utilise la mme analyse (et en excution, chaque excutable peut
galement utiliser les mmes fichiers de donnes).

Terminologie
Dans lanalyse
Fichier : L'analyse permet de dcrire la structure des fichiers de la BDD. Le terme Fichier
correspond dans certaines BDD 'une table".
Dans WinDev, le terme Table est rserv pour dsigner un objet graphique permettant de visualiser
le contenu d'un fichier de donnes sous forme de tableau, et/ou de saisir des lignes. Par exemple, une
table peut permettre de saisir le dtail d'une commande.
Enregistrement : Un enregistrement est quelquefois galement appel ligne. L'enregistrement d'un
fichier de donnes correspond lensemble des rubriques dfinies pour le fichier.
Rubrique : Dans l'analyse, le terme rubrique dsigne une zone dun fichier de donnes. L'ensemble
des rubriques d'un fichier de donnes permet de dfinir la structure d'un enregistrement.


Module ACSI : TP1 : Notions de base
3


Cl/Index : Avec WinDev et sa base de donnes HyperFleSQL, la notion d'index est lie la notion
de cl. La notion de cl fait partie des caractristiques dune rubrique. Les cls permettent d'acclrer
les accs aux donnes ou de faciliter les parcours des fichiers de donnes. En WinDev, si un fichier de
donnes HyperFileSQL a plusieurs rubriques cls, en excution, un seul fichier d'index sera cr.
Dans les fentres et les tats
Fentre : Les fentres permettent d'afficher ou de saisir l'cran des informations. Les fentres sont
galement appeles "crans" ou "Boites de dialogue". Lutilisateur peut agir directement sur les
fentres par lintermdiaire de champs, de boutons,
Etat : Les tats permettent d'obtenir une vue personnalise d'informations. Ces informations peuvent
provenir de la base de donnes, de fichiers texte, de champs prsents dans les fentres,... Les tats
peuvent tre visualiss lcran, imprims sur papier, gnrs en PDF ou en HTML,
Champ : Le mot "champ" est le terme utilis pour dsigner les diffrents objets graphiques affichs
dans une fentre ou dans un tat.
Gabarit : Le gabarit permet de dfinir le "look" de l'application : apparence visuelle des fentres, des
boutons, des champs,
Style : Le style regroupe les caractristiques graphiques d'un lment : image de fond, bordure,
police,... Les styles des diffrents lments constituant l'interface d'une application WinDev sont
regroups dans une feuille de styles.
Remarque : Dans une application, l'entit "NomClient" peut correspondre :
au nom d'un champ dune fentre
au nom d'un champ d'un tat
la rubrique d'un fichier de donnes
une variable dfinie par le programmeur
Nous avons vu les termes de base connatre pour raliser une application WinDev. Nous allons
commencer la programmation en concevant nos premires fentres.
Lancement de WinDev
Pour son utilisation, WinDev propose un paramtrage de l'environnement. Plusieurs modes sont
votre disposition :
Environnement simplifi : Ce mode permet de dcouvrir les principales fonctionnalits de
WinDev.
Environnement complet : Ce mode propose toutes les fonctionnalits de WinDev.
Rcuprer la configuration de votre environnement XX : Ce mode reprend les
fonctionnalits disponibles en version XX (si la version XX est installe sur votre poste).
A tout moment quel que soit le type d'environnement utilis, il est possible d'ajouter ou de supprimer
l'accs certaines fonctionnalits non utilises.
Mise en place
Pour utiliser lenvironnement simplifi de WinDev :
1. Lancez WinDev 17.
2. Si vous navez jamais lanc WinDev 17, un assistant de bienvenue se lance. Cet assistant vous
permet de choisir votre environnement de travail.
3. Slectionnez " Environnement simplifi" et validez.
Si WinDev a dj t lanc sur votre poste, cet assistant de bienvenue n'apparat pas. Pour vrifier et
modifier si ncessaire la configuration de votre environnement, effectuez les oprations suivantes :
1. Slectionnez l'option "Outils..Options..Options de l'environnement".
2. Cliquez sur "Relancer l'assistant de configuration de lenvironnement".
3. Slectionnez "Environnement simplifi" et passez l'cran suivant, Le mode slectionn est
affich. Passez l'cran suivant.
4. Choisissez la configuration de votre cran.
5. Validez votre choix.
6. Validez les options de l'environnement.
Application : Mes premires fentres
Pour commencer utiliser WinDev, nous allons simplement crer quelques fentres. Ces quelques
exemples vous permettront de connatre les bases de la programmation en WinDev et vous permettront
ensuite d'aborder des sujets plus complets.
Cette premire partie permet de :
crer des fentres simples,
manipuler des chanes, des numriques, des montaires,
manipuler des dates et des heures.
O, nous allons crer les fentres suivantes :
Une fentre compteur,
Une fentre de saisie de texte,
Une fentre de calcul,
Un menu pour rassembler les fentres cres prcdemment.
Ces fentres seront regroupes pour des besoins pratiques dans un projet.


Module ACSI : TP1 : Notions de base
5


La premire fentre : un compteur
Nous allons raliser la fentre suivante :

Le compteur numrique sera incrment ou dcrment avec les boutons flchs.
Ralisation
Lancez WinDev 17.Si ncessaire, fermez le projet en cours pour faire apparatre la fentre de
bienvenue.
Crer un nouveau projet mes_premires_fentres
Pour crer la fentre :
1. Cliquez sur le bouton nouveau dans la barre d'outils de WinDev :

Une fentre en forme de roue s'affiche. Cette fentre permet de crer tous les lments
pouvant tre associs un projet.
2. Survolez la catgorie "Fentre", puis slectionnez loption "Fentre". L'assistant de
cration de fentres s'affiche.
3. Slectionnez "Vierge" dans la liste des fentres standard affiche sur la gauche.
Dans la liste des gabarits prsente sur la droite, slectionnez par exemple le gabarit
"Elgant". Vous pouvez choisir un autre gabarit propos dans la liste.
4. Validez. La fentre est automatiquement cre sous l'diteur.
Nous allons renseigner les informations de la fentre (nom, titre, description).
Faites un clic droit sur la fentre qui vient d'tre cre et slectionnez l'option "Description" dans le
menu contextuel qui s'affiche. La fentre de description saffiche. Cette fentre contient par dfaut le
nom de la fentre FEN_SansNoml
Remarque : Observez bien le nom de la fentre que WinDev propose par dfaut : ce nom commence
par les lettres FEN_ . Ce prfixe est automatiquement ajout car le projet utilise une charte de
programmation. La charte de programmation permet de dfinir un prfixe pour chaque type d'objet.
Nous verrons cette charte de programmation en dtail plus loin dans ce cours.
Saisissez les informations suivantes :
Description de la fentre

1. Le nom logique de la fentre : remplacez FEN_SansNoml par FEN_Compteur . Ce
nom sera le nom sous lequel sera enregistre la fentre sur le disque (avec l'extension
WDW ) dans le rpertoire des sources du projet. Ce nom sera galement utilis en
programmation pour manipuler la fentre, nous y reviendrons.
2. La description de la fentre : Fentre permettant de grer un compteur . Cette description
n'est pas destine lutilisateur final mais au dveloppeur. Cette description est affiche par
exemple dans le dossier, lors de la visualisation des lments du projet,
Remarque : L'emplacement sera automatiquement renseign lors de l'enregistrement de la fentre.
Cette zone contient le chemin complet du fichier correspondant la fentre.
3. Le titre de la fentre : remplacez Titre de la fentre par Exemple d'un compteur . Ce
titre est affich dans la barre de titre de la fentre. Ce titre permet de renseigner lutilisateur
final sur les fonctionnalits de la fentre.
Validez (bouton vert). Le titre apparat dans la barre de titre.


Module ACSI : TP1 : Notions de base
7


Enregistrez la fentre.
Par dfaut :
le nom de l'lment est le nom logique de la fentre.
Lemplacement propos correspond au rpertoire du projet.
Validez en cliquant sur le bouton vert.
Gestion du compteur
Pour grer le compteur numrique, vous allez crer :
1. Un champ dans lequel va s'afficher la valeur numrique.
2. Un champ spin (compos de deux boutons) qui va permettre dajouter 1 ou de soustraire
1 au compteur.
WinDev permet de crer ces diffrents champs en une seule opration grce aux champs prdfinis
proposs la cration.
Pour crer les diffrents champs du compteur :
1. Cliquez sur la flche prsente ct de l'icne de la barre d'outils. La liste des
diffrents champs de saisie prdfinis s'affiche. Le champ numrique de type Entier +
Spin correspond ce que nous voulons.
2. Cliquez sur le champ "Entier + Spin".
3. Cliquez dans la fentre l'endroit o le champ doit tre cr.
Remarque : Une fentre de champs prdfinis peut tre affiche pour tous les champs possdant une
flche droite de leur icne.
Un clic sur l'icne associe au champ permet de crer le champ par dfaut.
Un clic sur la flche permet d'afficher la liste des champs prdfinis. Il suffit alors de cliquer sur le
type de champ voulu.
4. Sauvegardez la fentre.
Remarque :
L'enregistrement de la fentre permet par la suite WinDev :
de proposer le nom des champs automatiquement dans le code.
de proposer le renommage automatique des champs dans le code.
Nous allons maintenant modifier les caractristiques des champs que nous venons de crer.
Cliquez dans la fentre.
Double-liquez sur le champ de saisie.
La fentre de description du champ apparat.
Cette fentre contient les informations gnres par dfaut : le nom du champ 'SAI_Entier_Spin"
("SAI_ correspondant au prfixe utilis pour identifier les champs de saisie dans la charte de
programmation), son libell et son type.
Nous allons modifier ces informations :

1. Saisissez le nom SAI_Compteur .
2. Entrez le libell Compteur .
Ce champ est de type numrique.
Modifiez le format (option Masque de saisie ) : droulez la liste des formats proposs par dfaut et
slectionnez 999 999 (il est galement possible de saisir directement la valeur 999 999 dans le
champ "Masque de saisie"). Le masque '999 999" signifie que :
le nombre peut comporter jusqu' 6 chiffres.
le nombre ne comporte aucune partie dcimale.
le sparateur de milliers est un espace.
Deux types de masques sont disponibles :
Le masque d'affichage : il correspond au format utilis lorsque la valeur est affiche dans le
champ.
Le masque de saisie : il correspond au format utilis lorsque l'utilisateur va saisir la valeur
dans le champ.


Module ACSI : TP1 : Notions de base
9


Nous voulons donner une valeur initiale au compteur. Pour cela, il suffit d'initialiser le contenu du
champ avec cette valeur (onglet Contenu ).
Remarque : Beaucoup de dveloppeurs feraient cette opration par programme : il faudrait crire une
ligne de code pour affecter une valeur dans ce champ. Avec WinDev, pas besoin de saisir du code. Ce
type d'information fait partie des caractristiques du champ.
Cliquez sur l'onglet Contenu et saisissez la valeur initiale, par exemple. 100 .
Bien entendu, comme partout dans WinDev, vous pouvez procder de manire traditionnelle en
saisissant la ligne suivante en WLangage dans le code d'initialisation du champ :
SAI_Compteur = 100
Remarque : Dans cette ligne de code, le signe = permet daffecter le champ SAI_Compteur
avec la valeur indique. La syntaxe utilise est la suivante:
<Destination> = <Valeur affecter>
Validez les informations du champ.
Sous l'diteur, le champ contient maintenant la valeur 100. Ce concept se nomme Live Data : vous
voyez les donnes en temps rel ! Vous retrouverez ce concept un peu plus tard, lors de la
manipulation des fichiers de donnes.
Enregistrez la fentre. Un "warning" et plusieurs erreurs de compilation apparaissent
automatiquement dans le volet "Erreur de compilation".

Ces erreurs indiquent que le nom "SAI_Entier_Spin" est inconnu. Ce nom est utilis dans un des
traitements de la fentre FEN_Compteur. WinDev a dtect qu'un champ a t renomm (dans notre
cas, le nom du champ de saisie a t modifi), et affiche une erreur de compilation pour chaque
utilisation du champ. Le menu contextuel de l'erreur (affich par un clic droit sur l'erreur) propose de
renommer automatiquement ce champ dans toutes les utilisations qui sont faites dans la fentre
(notamment dans les traitements WLangage).
Slectionnez l'option Renommez toutes les rfrences du menu contextuel de lerreur.
Le champ Spin a automatiquement t cr ct du champ de saisie. Ce champ affiche
deux petites flches permettant de modifier la valeur prsente dans le champ de saisie. Nous
allons maintenant le modifier pour grer la valeur du compteur.
Affichez le code du champ Spin :
Affichez le menu contextuel du champ (clic droit sur le champ).
Slectionnez l'option Code prsente dans le menu contextuel.
Ce champ contient en plus du code d'initialisation, deux codes spcifiques :
Le code d'incrmentation : ce code est excut lorsque l'utilisateur manipule le champ
spin pour augmenter une valeur.
Le code de dcrmentation : ce code est excut lorsque lutilisateur manipule le champ
spin pour diminuer une valeur.
Dans le code dincrmentation, le code suivant est affich :
SAI_Compteur++
Cette ligne de code signifie que lon ajoute 1 la valeur du champ SAI_Compteur.
Le champ SAI_Compteur est alors manipul co-+
mme une variable.
Remarque :
Vous pouvez galement utilise les syntaxes :
SAI_Compteur +=1
SAI_Compteur = SAI_Compteur + 1

Le principe est le mme pour le code de dcrmentation :
SAI_Compteur--
Ce code signifie que l'on enlve 1 la valeur du champ SAI_Compteur.
Testons cette fentre :
1. Enregistrez les modifications
2. Cliquez sur l'icne "GO" (ou [F9]).
3. Testez les diffrents champs, et observez les changements du champ de saisie.
Tout dveloppeur sait que tester un programme est souvent long, voire fastidieux. Avec WinDev, en
UN CLIC, vous testez la fentre, l'tat, ou la procdure que vous tes en train de raliser.
Cliquez sur le bouton X situ dans la barre de titre pour fermer la fentre.


Module ACSI : TP1 : Notions de base
11


L'diteur de WinDev rapparat.
Amlioration du look de la fentre et cration dun bouton pour quitter la fentre
Lors de ce premier test, vous avez remarqu que votre fentre est trop grande, et qu'elle peut tre
redimensionne alors qu'elle ne contient que quelques champs.
Nous allons revoir rapidement l'interface de cette fentre.
Pour rduire la taille de la fentre sous l'diteur :
1. Cliquez sur la fentre : des poignes bleues apparaissent autour de la fentre (selon le
gabarit utilis, la couleur de ces poignes peut tre diffrente).
2. Cliquez sur la poigne situe en bas droite, et rduisez la taille de la fentre en
maintenant le bouton de la souris enfonc.
Pour que la fentre ne soit pas redimensionnable pendant l'excution :
1. Double-cliquez sur la fentre. La fentre de description s'affiche.
2. Dans longlet IHM , dcochez loption Redimensionnable .
3. Validez.
Dans une fentre, il y a toujours un bouton ou une option pour quitter la fentre. Bien entendu, si vous
n'ajoutez pas de bouton ou doption, il reste toujours la possibilit de fermer la fentre en cliquant sur
l'icne "X" de la barre de titre, mais ce nest pas trs convivial.
Pour crer le bouton de fermeture :
1. Cliquez sur la flche ct de licne dans la barre doutils. La liste des boutons
prdfinis saffiche.
2. Cliquez sur le bouton de type Fermer .
3. Cliquez dans la fentre la position o le bouton doit tre cr.
Vrifions la description du bouton cr :
1. Affichez la description du champ (option Description du menu contextuel ou double-
clic sur le bouton).
2. Dans l'onglet Gnral :
Le nom du bouton respecte la charte de programmation.
Une action prdfinie est associe au bouton : cette action permet de fermer la fentre.
Les images correspondant au gabarit utilis sont automatiquement associes au bouton.

3. Dans l'onglet IHM , le bouton est de type "Abandon".
Remarque : WinDev propose plusieurs types pour les boutons. Nous les verrons en dtail
dans le chapitre consacr lergonomie. Pour fermer une fentre, le bouton utilis doit tre de type
"Abandon".
4. Fermez la fentre de description du bouton.
Vous pouvez facilement dplacer le bouton de fermeture : cliquez sur le bouton de fermeture avec le
bouton gauche de la souris. Tout en maintenant le bouton de la souris enfonc, faites glisser la souris
(et le champ) lemplacement voulu.
Relancez le test de cette fentre, pour visualiser le rsultat en excution.
Nous en avons termin avec notre compteur!
Grer la saisie dun texte
Nous allons maintenant voir comment manipuler un champ de saisie texte.
Dans une nouvelle fentre, vous allez maintenant crer un champ de saisie. Ce champ sera utilis pour
saisir un prnom. Un bouton permettra d'afficher ce prnom.

Pour crer une nouvelle fentre :
1. Cliquez sur l'icne Nouveau .
2. Survolez la catgorie Fentre , puis slectionnez l'option Fentre . L'assistant de
cration de fentres s'affiche.
3. Slectionnez Vierge dans la liste des fentres standards affiche sur la gauche. Dans
la liste des gabarits prsente sur la droite, le gabarit Elgant est propos
automatiquement.
4. Validez
5. Faites un clic droit sur la fentre puis slectionnez l'option Description .
6. Donnez la fentre le nom FEN_Saisie , le titre et la description Exemple de
saisie . Validez la fentre de description.
7. Enregistrez la fentre.
Pour crer le champ de saisie :
1. Cliquez sur la flche prsente ct de licne .La liste des champs de saisie proposs
par dfaut saffiche. Slectionnez "Texte simple" puis positionnez le champ dans la fentre.
2. Faites un clic droit sur le champ et slectionnez l'option Description .
3. Modifiez les caractristiques du champ.


Module ACSI : TP1 : Notions de base
13


Ce champ a pour nom : "SAI_Prnom".
Ce champ a pour libell : "Prnom"
Ce champ est de type texte.
Remarque :
Par dfaut les caractres seront saisis en majuscules ou en minuscules selon la position de la touche
[CAPSLOCK] du clavier. Ce genre de saisie peut tre trs gnant lors dune recherche par exemple.
WinDev propose la gestion dun masque de saisie pour un champ. Le masque de saisie permet de
mettre en forme la valeur saisie, automatiquement et sans aucune ligne de code.
Modifiez le format du champ de saisie (masque de saisie) et slectionnez 1
re
lettre en
majuscule (la premire lettre saisie sera en majuscule et les autres seront en minuscules). Ce
masque de saisie va nous tre utile pour afficher le prnom saisi avec une majuscule comme
premire lettre. Puis, validez.
Le libell du champ apparat tronqu sous l'diteur. Pour afficher correctement le champ :
1. Slectionnez le champ.
2. Utilisez l'option Adapter la taille du menu contextuel.
Pour crer le bouton Afficher :
1. Cliquez sur licne , puis positionnez le champ dans la fentre.
2. Cliquez sur le bouton. Le texte affich dans le bouton passe en dition. Saisissez le
libell Afficher . Le nom du bouton devient automatiquement "BTN_Afficher".
Pour afficher le rsultat de la saisie, vous auriez peut-tre envie de crer une nouvelle fentre et
dafficher le rsultat dans un champ "Libell". Or, il existe en WLangage des fonctions permettant
dafficher un rsultat dans des fentres systme. Ces fonctions se nomment Info ou Erreur. Pour notre
exemple, nous utiliserons la fonction Info.
Saisissez le code suivant dans le code de clic du bouton Afficher (option "Code" du menu
contextuel du champ) :
Info ("Vous avez saisi " + SAI Prnom)
Remarque : Ds la saisie des trois premiers caractres. WinDev propose tous les mots du vocabulaire
WLangage contenant ces caractres. Lassistance au dveloppement est pousse trs loin. Vous ne
pouvez plus vous tromper en saisissant le nom dun lment : les erreurs de syntaxes sont minimises.
Il suffit de slectionner le mot dsir et de valider par la touche [Entre]. Vous pourrez ainsi vous
concentrer sur lalgorithme. Vous constaterez galement que mme les chanes de caractres disposent
de la saisie assiste. De cette faon, une question rcurrente sera propose avec la mme formulation
aux diffrents endroits o elle est utilise.
Remarque : Cest pour cela que la charte de programmation est trs importante. Tous les lments
manipuls dans le code de lapplication utilisent la mme norme et peuvent ainsi tre facilement
retrouvs lors de la saisie du code.
En saisissant ce code sous lditeur de code, vous constatez que les diffrents lments saisis utilisent
des couleurs diffrentes. En effet lditeur de code permet ainsi didentifier rapidement les diffrents
lments manipuls par le code :
les fonctions du WLangage apparaissent en bleu.
les chanes de caractres (entre guillemets) apparaissent en violet.
les noms de champs apparaissent en cyan.
La fonction Info affiche dans une bote de dialogue le message pass en paramtre. Notre message est
construit partir du texte "Vous avez saisi " et de la valeur du champ SAI_Prnom . Le signe +
indique une opration dite de concatnation entre deux chanes.
Pour avoir plus d'informations sur cette fonction, affichons l'aide en ligne : il suffit de se
positionner sur le nom de la fonction, et d'utiliser la touche [Fl]. Laide de la fonction s'affiche
dans un browser d'aide spcifique.
A tout moment, si vous possdez un accs Internet valide, il est possible dafficher la page daide
actuelle. Si vous avez accs Internet, laide souvre directement dans votre navigateur.



Module ACSI : TP1 : Notions de base
15


Pour lancer directement l'aide en ligne Internet depuis le produit :
1. Slectionnez l'option Outils.. Options.. Options gnrales de WinDev .
2. Dans longlet Aide , slectionnez le mode d'accs la base daide.
Enregistrez la fentre et testez-la
1. Cliquez sur le bouton Afficher . Puis, validez.
2. Pour sortir cliquez sur licne X" de la barre de titre.
Grer la saisie dun numrique pour faire un calcul
Dans la mme fentre, nous allons maintenant :
Crer deux champs de saisie numriques.
Calculer et afficher la valeur TTC du montant HT saisi.
Le rsultat du calcul sera affich dans le champ "Prix TTC'.
Nous allons sparer les deux parties de la fentre grce un sparateur.
Pour crer un sparateur:
1. Slectionnez l'option Insertion.. Champ.. Sparateur .
2. Dans l'assistant qui se lance, indiquez le sens du sparateur (horizontal) et son nom.
3. Validez l'assistant.
4. Redimensionnez si ncessaire le sparateur afin qu'il occupe toute la largeur de la
fentre.
5. Dplacez ensuite le sparateur sa position finale (sous le champ de saisie et le bouton
existants).
Remarque : Le sparateur peut galement tre cr en utilisant directement licne associe (cliquez
dans la barre d'icnes sur Autre puis sur l'icne ).
Pour crer le champ de saisie du prix HT:
1. Cliquez sur la flche droite de licne . La liste des diffrents champs de saisie
disponibles saffiche. Slectionnez le champ Montaire et positionnez le champ dans
la fentre.
2. Faites un clic droit sur le champ et slectionnez l'option Description .
3. Dans la fentre de description :
Saisissez le nom du champ SAI_PrixHT .
Saisissez le libell Prix HT .
Slectionnez le type Montaire + Euro .
4. Validez.
Pour crer le champ dans lequel sera affich le rsultat :
1. Cliquez sur la flche droite de licne . La liste des diffrents champs de saisie
disponibles saffiche. Slectionnez le champ Montaire et positionnez le champ dans
la fentre.
2. Saisissez les informations du champ : faites un clic droit sur le champ et slectionnez
l'option "Description".
Indiquez le nom du champ 'SAI_PrixTTC".
Modifiez le libell par 'Prix TTC".
Slectionnez le type "Montaire + Euro".
3. Le rsultat affich dans ce champ ne doit pas tre modifiable. Cliquez sur l'onglet
IHM et choisissez l'tat initial Affichage seul .
4. Validez.
5. Sauvez la fentre.
Il existe galement des champs de saisie Numriques (pour plus de dtails, consultez laide en
ligne).
Le calcul du montant TTC va tre ralis chaque modification du champ contenant le montant HT.
Pour raliser le calcul du montant TTC :
1. Affichez le code du champ "S4l_PrixHT" (option "Code' du menu contextuel du
champ).
2. Dans le code "A chaque modification", saisissez le code suivant :
// On fixe la TVA 19.6% pour l'exemple. Cela aurait pu tre une variable quelconque
// provenant d'une base de donnes SAI_PrixTTC = SAI_PrixHT * 1.196
3. Fermez la fentre de code (option "Fichier.. Fermer" ou licne x de la fentre de
code).
4. Enregistrez la fentre.
5. Testez la fentre (bouton ). Saisissez une valeur dans le champ Prix HT . Le
rsultat apparat immdiatement dans le champ Prix TTC .
6. Fermez la fentre de test.
Ce calcul prend en compte un taux fixe de TVA. Pour compliquer un peu notre exemple, nous allons
donner la possibilit de slectionner le taux de TVA dans une liste droulante (appele combo ).
Pour crer le champ combo de slection de la TVA :
1. Cliquez sur licne puis cliquez dans la fentre la position o le champ doit tre
cr ( ct du champ Prix HT ).
2. L'assistant de cration de combo s'affiche. Cet assistant permet de dfinir simplement
les principales caractristiques du champ.
3. Slectionnez loption 'Remplir le combo par programmation ou saisir directement une
liste de valeurs". Affichez lcran suivant.
4. Laissez les options proposes par dfaut. Affichez lcran suivant.


Module ACSI : TP1 : Notions de base
17


5. Saisissez la liste des valeurs de TVA possibles :
5.5.
Appuyez sur la touche ENTREE
19.6
Appuyez sur la touche ENTREE
25.
6. Affichez lcran suivant, et donnez un nom au champ (COMBO_TVA) et un libell
(TVA).
7. Validez.
Nous allons maintenant modifier le code du champ Prix HT pour prendre en compte le montant de
la TVA slectionn dans la combo.
Pour prendre en compte le montant de la TVA slectionn :
1. Affichez le code du champ Prix HT (option "Code" du menu contextuel).
2. Modifiez le code de la faon suivante :
SAIPrixTTC = SAI_PrixHT*(l+Val(COMBO_TVA..ValeurAffiche)/100)
Ce code calcule le montant TTC en utilisant la valeur slectionne dans la combo (donne obtenue
avec la proprit ..ValeurAffiche). Le contenu de la combo tant une chane de caractres, la fonction
Val permet d'obtenir une valeur numrique afin de calculer le montant TTC.
Remarque : Le WLangage est compos de fonctions et de proprits. Les fonctions peuvent attendre
des paramtres et renvoient des rsultats. Les proprits sont directement appliques aux champs grce
la syntaxe : <Nom du champ>..<Nom de la proprits>
3. Testez votre fentre. Saisissez une valeur dans le champ "Prix HT". Le rsultat apparat
immdiatement dans le champ "Prix TTC" en fonction de la TVA slectionne.
Cependant si vous changez le taux de TVA. la valeur du champ Prix TTC n'est pas
modifie. Nous allons maintenant corriger ce problme.
4. Fermez la fentre. L'diteur de code est de nouveau affich.
Pour prendre en compte le montant de la TVA. chaque modification de la valeur de la TVA
dans la combo. il suffit de recopier le code A chaque modification de Prix HT dans le
code Slection dune ligne de la combo COMBOJTVA :
1. Affichez le code du champ Prix HT (option "Code" du menu contextuel par
exemple).
2. Slectionnez le code prsent dans le traitement 'A chaque modification" de "Prix HT".
3. Utilisez les touches CTRL" + C .
4. Affichez le code du champ combo TVA".
5. Placez-vous dans le traitement "Slection d'une ligne", et utilisez les touches CTRL+
T .
6. Testez votre fentre et slectionnez les diffrentes valeurs dans la combo.

Maintenant, notre fentre fonctionne correctement. Mais le mme code est utilis 2 endroits
diffrents! Comment grer les modifications et leur report? Le plus simple est dutiliser une pro-
cdure. Cest ce que nous allons faire maintenant.
Utiliser une procdure
La cration d'une procdure partir dun code existant est trs simple avec WinDev : une option de
menu se charge de tout.
Pour crer la procdure de calcul de la TVA :
1. Slectionnez le code prsent dans le traitement "Slection dune ligne" de la combo
TVA .
2. Slectionnez l'option de menu "Code.. Refactoring.. Crer une procdure locale
contenant le code slectionn".
3. Donnez le nom de la procdure crer : CalculTVA. Validez.
4. La procdure locale CalculTVA est automatiquement cre avec le code
slectionn. Votre code a t remplac par lappel la procdure CalculTVA() .
5. Pour terminer, il suffit de remplacer le second code de calcul de la TVA (prsent dans le
code "A chaque modification* du champ 'Prix HT) par lappel la procdure
"CalcuiVAO".
6. Voil, c'est termin. Vous pouvez enregistrer et tester votre fentre pour vrifier si tout
fonctionne correctement.
Cration dune fentre avec un menu
Voil, nous venons de raliser quelques fentres. Nous allons maintenant crer la fentre principale de


Module ACSI : TP1 : Notions de base
19


cet exemple. Cette fentre contiendra le menu organisant laccs aux diffrentes fentres de
l'application.
WinDev permet de crer des menus droulants.
Un menu est toujours associ une fentre. Ainsi, pour crer un menu, il faut en premier crer la
fentre affichant ce menu.
Dcrire le menu
Pour crer une fentre comportant un menu :
1. Cliquez sur l'icne pour crer une nouvelle fentre.
2. Survolez la catgorie 'Fentre", puis slectionnez loption "Fentre'.
3. Dans lassistant qui s'affiche, slectionnez Vierge et validez.
4. Donnez un nom et un titre et une description cette fentre. Cette fentre a pour nom
'FEN_Menu" et pour titre et description "Menu principal".
5. Enregistrez la fentre.
6. Slectionnez l'option de menu Fentres.. Menu principal.. Ajouter le menu principal .
Un menu sinsre dans la fentre sous la barre de titre. Ce menu contient par dfaut une
option qui se nomme 'Menu'.
Remarque : Chaque option de menu est saisie directement dans le menu.
Chaque option comporte une lettre d'appel. Cette lettre d'appel permet d'accder directement l'option
avec la combinaison de touches [Alt]+Lettre. Le caractre '&' doit alors prcder la lettre d'appel (par
exemple &Fentres ).
Pour crer une option de menu et pour la modifier, il suffit d'utiliser le menu contextuel du
menu ou de l'option de menu. Pour afficher le menu contextuel dune option de menu :
1. Slectionnez le menu.
2. Cliquez avec le bouton droit de la souris.
3. Le menu contextuel s'affiche.
Plusieurs choix sont possibles. Les principales options de gestion de menu sont :
"Description de loption" pour modifier le libell de l'option et la lettre d'appel.
"Code' pour saisir le code source correspondant au traitement excuter lors du clic sur cette
option.
"Ajouter aprs" pour ajouter une option de menu aprs l'option en cours.
"Ajouter avant" pour ajouter une option de menu avant l'option en cours.
"Transformer pour drouler un sous-menu' pour ajouter dans loption en cours un sous- menu
(arborescence).
Ralisez le menu suivant :

Pour le menu "Fichier.. Quitter :
1. Affichez la description de l'option 'Menu" insre par dfaut, et changez le libell en
Fichie&r . Validez la fentre de description.
2. Dans le menu contextuel de l'option "Fichier*, slectionnez l'option Transformer pour
drouler un sous-menu" et saisissez "Quitter".
Pour le menu "Fentres" :
1. Slectionnez l'option Fichier .
2. Dans le menu contextuel de l'option Fichier , slectionnez l'option 'Ajouter
aprs' et saisissez &Fentres .
3. Dans le menu contextuel de loption "Fentres*, slectionnez Transformer pour
drouler un sous-menu" et saisissez "&Compteur".
4. Dans le menu contextuel de l'option "Compteur, slectionnez "Ajouter aprs" et
saisissez &Saisies .
Nous allons maintenant ajouter le raccourci [ALT + F4] pour l'option "Quitter".
1. Slectionnez l'option "Quitter".
2. Affichez la description de l'option (option "Description de l'option" du menu
contextuel).
3. Dans la zone "Raccourci clavier", droulez la combo, parcourez les lments et
slectionnez F4 . Puis cochez la case Alt .
4. Validez.
Lorsque toutes les options de menu sont saisies, visualisez la fentre (option "Affichage.. Afficher la
fentre' ou la combinaison de touches [SHIFT]+[F9]). Ce mode de visualisation permet de visualiser
l'aspect final du menu. Pour fermer cette fentre, utilisez le bouton 'Fermer" de la tlcommande de
l'aperu.

Rappel : Le "&" permet de dfinir la lettre d'appel de l'option de menu.


Module ACSI : TP1 : Notions de base
21


Remarque :
Dans vos applications, nous vous conseillons de suivre le standard des menus Windows, Veillez en
particulier aux points suivants :
Chaque option du menu principal doit proposer au moins une sous-option.
La premire lettre de chaque option doit tre en majuscules, mme si ce n'est pas la lettre
d'appel. La lettre d'appel est souligne (utilisez le caractre & ).
Si un choix de menu appelle une fentre de traitement, terminez le libell par trois points ().
L'option 'Quitter' doit tre la dernire sous-option de la premire option de la barre de menu
(exemple : 'Fichier., Quitter'),
Si une option d'aide est prsente, elle doit se trouver la fin de la premire ligne de menu
(l'option la plus droite).
Associer un code aux options de menu
Chaque option terminale de menu doit comporter un traitement associ. Classiquement, ce traitement
ouvre une fentre, mais n'importe quel type de traitement peut tre excut,
Nous allons saisir le code des diffrentes options :
1. Slectionnez loption "Quitter'. Cette option va permettre de quitter l'application. Dans
le menu contextuel, slectionnez loption "Code". Dans la fentre dcod qui s'ouvre,
saisissez le code suivant :

Fermez ensuite la fentre de code. La fentre en cours d'dition apparat
2. Dans la fentre, slectionnez l'option de menu "Compteur". Cette option va permettre
douvrir la fentre 'Compteur', Dans le menu contextuel, slectionnez loption "Code",
Dans la fentre de code qui s'ouvre, saisissez le code suivant :

Fermez la fentre de code.
3. Rptez cette opration pour l'option 'Saisies" et saisissez le code suivant :

La fonction Ouvre permet d'afficher une fentre pour effectuer une saisie. La fonction Ferme
quant elle, ferme la fentre en cours.
Si la fentre contenant le menu est la premire fentre affiche par l'application, la fermeture de la
fentre contenant le menu (par l'option "Fichier.. Quitter dans notre exemple) quivaut quitter
lapplication.