windev-tp02.pdf

5/19/2018 windev-tp02.pdf

1/22

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 lexcutionde 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 WLangageest trs simple.

Une application est un outil qui permet de raliser des tchesou des actions automatiquement.

Une application est constitue d'un programme excutable (ou d'un ensemble de programmes

excutables), de librairies, de fichiers de donnes,...


2/22

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.


3/22


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 deWinDev.

Environnement complet: Ce mode propose toutes les fonctionnalits de WinDev.

Rcuprer la configuration de votre environnement XX : Ce mode reprend lesfonctionnalits disponibles en version XX (si la version XX est installe sur votre poste).


4/22

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 assistantvouspermet 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 estaffich. 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 quelquesexemples 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.


5/22


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 debienvenue.

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


6/22

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.


7/22


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 soustraire1 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 desdiffrents 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"


8/22

("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 valeurdans le champ.


9/22


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. Cetype 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:

=

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.


10/22

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 champspin 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.


11/22


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 legabarit 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 enmaintenant 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 boutonsprdfinis 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


12/22

"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 poursaisir 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 decration de fentres s'affiche.

3. Slectionnez Vierge dans la liste des fentres standards affiche sur la gauche. Dansla liste des gabarits prsente sur la droite, le gabarit Elgant est proposautomatiquement.

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 desaisie . 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 proposspar 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.


13/22


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 1re 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 lelibell 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


14/22

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 diffrentslments 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 Infoaffiche 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.


15/22


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.


16/22

Pour crer le champ dans lequel sera affich le rsultat :

1. Cliquez sur la flche droite de licne . La liste des diffrents champs de saisiedisponibles saffiche. Slectionnez le champ Montaire et positionnez le champ dansla fentre.

2.

Saisissez les informations du champ : faites un clic droit sur le champ et slectionnezl'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 enligne).

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 decode).


5. Testez la fentre (bouton ). Saisissez une valeur dans le champ Prix HT . Lersultat 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 trecr ( ct du champ Prix HT ).

2. L'assistant de cration de combo s'affiche. Cet assistant permet de dfinir simplementles principales caractristiques du champ.

3. Slectionnez loption 'Remplir le combo par programmation ou saisir directement uneliste de valeurs". Affichez lcran suivant.

4. Laissez les options proposes par dfaut. Affichez lcran suivant.


17/22


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 : ..

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 parexemple).

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 .


18/22

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


19/22


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".


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 aprsl'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


20/22

(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" etsaisissez &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.


21/22


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 :


22/22

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.

windev-tp02.pdf

Documents

lanalyse windev

donnes delapplication

mmes fichiers de donnes

zone dun fichier de

base de donnes hyperflesql

projets windev

nombreuses bases de

terme fichier