TDF Tech 2015 Support de cours - PC SOFT WINDEV

87
TDF Tech 2015 Support de cours TDF Tech 2015 - www.pcsoft.fr - 1

Transcript of TDF Tech 2015 Support de cours - PC SOFT WINDEV

Page 1: TDF Tech 2015 Support de cours - PC SOFT WINDEV

TDF Tech 2015 Support de cours

TDF Tech 2015 - wwwpcsoftfr - 1

Le document que vous avez entre les mains nrsquoa pas la finaliteacute de remplacer les documentations techniques ou commerciales livreacutees avec WINDEV WEBDEV ou WINDEV Mobile

Ce document nrsquoest pas un cours drsquoauto-formation mais uni-quement un support ldquopapierrdquo de la preacutesentation technique que vous avez suivie

Ce document a eacuteteacute reacutealiseacute par lrsquoeacutequipe de la LST

TDF Tech 2015 - wwwpcsoftfr - 3

TDF Tech 2015 - wwwpcsoftfr - 3

TDF TECH 2015 SOMMAIRE

Retrouvez dans ce support de cours les sujets abordeacutes lors du TDF Tech 2015Le code source des diffeacuterentes applications et projets indiqueacutes dans ce support de cours est preacutesent sur le DVD du TDF Tech 2015

4 Sommaire

8 PC SOFT agrave votre service

10 WINDEV Preacutesentation rapide de WINDEV et de ses fonctionnaliteacutes

12 WEBDEV Preacutesentation rapide de WEBDEV et de ses fonctionnaliteacutes

14 WINDEV Mobile Preacutesentation rapide de WINDEV Mobile et de ses fonctionnaliteacutes

18 Centre de Suivi de Projets exigences tableau de bord Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de

bordrdquo Des onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

20 Composant CCFeedback Le composant CCFeedback permet agrave vos utilisateurs drsquoenvoyer des suggestions des tickets drsquoincidents ou des regravegles

meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

22 Le Centre de Controcircle HFSQL Le Centre de Controcircle HFSQL fait partie des outils incontournables

En version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

24 Le champ Carte LechampCartepermetdrsquoafficherunecarteGoogledansvosapplicationsetvossites

Vouspouvezajouterdesmarqueursdesitineacuterairesmodifierlapositionetc VouspouvezmecircmeallerplusloinenmanipulantdirectementlrsquoobjetGoogle

4 - TDF Tech 2015 - wwwpcsoftfr

26 Le WLangage nouveauteacutes utiles Le WLangage crsquoest votre outil de travail au quotidien

Crsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacutee Voici quelques nouveauteacutes remarquables de la version 20

30 Astuces de deacutebogage Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le

deacutebogueur Cet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

32 Nouveauteacutes sur les eacutetats Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etc

La version 20 apporte son lot de nouveauteacutes sur les eacuteditions Petit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

34 PCSCloud votre solution Cloud PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases

de donneacutees HFSQL PCSCloudproposeeacutegalementdesplateformesdedeacuteveloppementpourstockeretpartagervosprojets(GestionnairedeSources)lesdonneacuteesdevosCentresdeControcircleetlaconfigurationdevotreenvironnementdedeacuteveloppement

36 HFSQL les vues En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquo

Qursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

38 Tableau croiseacute dynamique 4 raisons de lrsquoutiliser Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications

Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateurs

40 Le champ Graphe Secteur multiniveau Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les

diffeacuterents niveaux Voici 3 utilisations diffeacuterentes de ce nouveau graphe

TDF Tech 2015 - wwwpcsoftfr - 5

TDF TECH 2015SOMMAIRE (SUITE)

42 Onglets dynamiques moderniser une application Les onglets dynamiques permettent de proposer une interface moderne et intuitive

Cet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

44 Le champ Tableur Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications

PlusbesoindegeacutererdeslicencesdrsquoinstallerOfficeoudemanipulerunActiveX Vous utilisez un champ et des ordres WLangage adapteacutes

46 Le champ Confeacuterence Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines

distantes Avec1champet2fonctionsWLangagevousreacutealisezsimplementetrapidementunoutildecommunication

48 Editeur de fenecirctres En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomie

Danscesujetnousvouspreacutesentons11fonctionnaliteacutestregravesutilesdelrsquoeacutediteurdefenecirctres Lisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

50 Architecture logicielle MVP (Modegravele-Vue-Preacutesentation) Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppement

Lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20 Cet article deacutetaille une utilisation de cette architecture

52 Applications transportables (ldquoPortablesAppsrdquo) Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave

AvecWINDEVvouspouvezcreacuteercegenredrsquoapplicationfacilement Attentiontoutefoisilyaquelquesregraveglesagraverespecter

54 Un tableau de bord dans vos sites Equivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les

mecircmes concepts mais adapteacutes au Web IdeacutealpouravoirunevisionglobaleousyntheacutetiqueilvarapidementdevenirINDISPENSABLE

56 7 astuces pour maicirctriser le champ Tableau de bord LechampTableaudeborddeWEBDEVpeutecirctredeacutefinientiegraverementeneacuteditiondanslaplupartdescas

Il est cependant possible de le personnaliser preacuteciseacutement par programmation Voici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord

58 Des graphes interactifs en 1 clic ReacutevolutioncomplegraveteducocircteacuteduchampGraphedeWEBDEV20

6 - TDF Tech 2015 - wwwpcsoftfr

60 Actualiser simplement des champs apregraves un appel Ajax Simplifiezledialogueaveclrsquoutilisateuretreacuteduisezlestempsdereacuteponsesgracircceagravelrsquoactualisationautomatiquedeschamps

apregravesunappelAjax

61 Des sites plus rapides gracircce aux sessions preacutelanceacutees Lrsquoutilisationdessessionspreacutelanceacuteespermetdrsquoacceacuteleacutererlrsquoaffichagedespageseneffectuantparanticipationdes

traitementslongs(connexionsauxbasesdedonneacuteeschargementdeconfigurationsetdepagesetc)

62 WEBDEV 20 5 astuces rapides agrave mettre en œuvre Formulaires originaux changement dynamique de feuilles de styles CSS effets automatiques sur les images ruptures

dans les tables colonnes conteneur

64 Le champ Table en mobile Le champ Table est un champ incontournable dans les applications Windows

Enversion20lesapplicationsAndroidetiOSdisposentdrsquounchampTableproposantlesmecircmesfonctionnaliteacutesetlamecircme richesse que dans une application WINDEV

66 Les agencements LesagencementspermettentenquelquesclicsdedeacutefinirplusieursldquomisesenpagerdquopourvosIHMmobiles

Agrave lrsquoexeacutecution WINDEV Mobile utilise automatiquement lrsquoagencement le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

68 Nouveauteacutes mobiles Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON

Voici quelques-unes des nouveauteacutes mobiles de la version 20

70 RAD Mobile creacuteation drsquoune table et drsquoune fiche LesfenecirctresRADpermettentdecreacuteerenquelquesclicsdesfenecirctresfonctionnellespourvosapplicationsAndroidet

iOS disposant drsquoune analyse PlusieurstypesdefenecirctresRADsontdisponiblesfiche(avecousansimage)tablezonereacutepeacuteteacuteeetc Ilsuffitdesuivrelrsquoassistant

Annexes76 Annexe 1 Le GDS

80 Annexe 2 Inteacutegration continue (fabrique logicielle)

86 Annexe 3 Les donneacutees drsquoun champ TCD (cube ROLAP) dans un graphe

TDF Tech 2015 - wwwpcsoftfr - 7

PC SOFT agrave votre serviceNrsquoheacutesitez pas agrave nous contacter une journeacutee de consulting est toujours rentable pour vos deacuteveloppements

Assistance DirecteUn compleacutement efficace du Support Technique GratuitTout projet important ou strateacutegique doit beacuteneacuteficier drsquoune ldquoAssistance Directerdquo

LrsquoAssistance Directe permet drsquoune part de beacuteneacuteficier drsquoun contact teacuteleacutephonique immeacutediat avec un ingeacutenieur speacutecialiseacute et drsquoautre part de choisir les sujets agrave traiter et ce pour une dureacutee que vous deacutefinissez vous-mecircme Cela vous permet de reacutesoudre immeacutediatement les sujets qui vous posent problegraveme

Le contact teacuteleacutephonique est garanti sous 8 heures ouvrables ce qui vous permet une meilleure efficaciteacute Ce service est disponible sur abonnement

Contactez le service commercial pour plus drsquoinformations (Fabrice CHAMBON au 0467032032)

Support Technique Gratuit

Le site du support technique gratuit (wwwpcsoftfrst) met gratuitement agrave votre disposition un ensemble drsquoinformations destineacutees agrave vous aider agrave mieux deacutevelopper bull les FAQ bull les teacuteleacutechargementsbull les forums deacuteveloppeurs professionnels (News Group)Vous avez une question  Contactez  le Support Technique Gratuit PC SOFT bull Avec  lrsquoutilitaire RequecircteAuST (meacutedia conseilleacute) Votre requecircte sera geacuteneacuteralement traiteacutee sous 48 heuresbull Par teacuteleacutephone au 0467031717 (preacuteparez votre numeacutero de seacuterie et votre question svp) ou par courrierEnvoi par email merci de ne pas attacher de fichiers de taille supeacuterieure agrave 10 Mo sans lrsquoaccord preacutealable de votre destinataire Sinon votre fichier sera refuseacute par le systegraveme

ConsultingProfitez de lrsquoexpeacuterience drsquoun ingeacutenieur de PC SOFT sur votre siteUn consulting PC SOFT peut ecirctre deacuteleacutegueacute chez vous pour une dureacutee de 1 agrave 5 jours un ingeacutenieur PC SOFT connaissant agrave la fois votre domaine et les outils que vous utilisezLrsquoingeacutenieur PC SOFT reacutepond directement agrave vos questions travaille sur votre projet reacuteel et votre configuration reacuteelle Vous obtenez les reacuteponses preacutecises qui vous font gagner un temps preacutecieux et vous assurent des bonnes orientations technologiques et meacutethodologiques

Notre conseil Commandez 1 jour de consulting pour 100 jours de deacuteveloppement

Et chaque anneacutee prenez lrsquohabitude de faire venir ( juste 2 jours) chez vous un ingeacutenieur PC SOFT pour profiter drsquoune expertise de toutes les nouveauteacutesSur votre projet dans vos locaux en votre preacutesence lrsquoingeacutenieur PC SOFT valide lrsquoanalyse vous montre des nouveauteacutes utiles dans votre cas de figure vous propose des optimisations de votre code valide vos modes drsquoutilisation Vous serez ravi de lrsquoefficaciteacute de son intervention Budgeacutetez drsquoores et deacutejagrave la prochaine intervention

Un assistanat vous fait gagner des journeacutees de deacuteveloppementQuelques exemples de sujets traiteacutes bull Simplification du code et mise en place de nouvelles techniques  HFSQL ClientServeur Sockets Webservices Composants Patchs Configurations hellipbull Transformation de modules deacuteveloppeacutes avec WINDEV en Webservicesbull Optimisation de traitements avant la recette de lrsquoapplication validation drsquoanalyse avant de deacutebuter une application

FormationSeacuteminaires de formation pour WINDEV WEBDEV et WINDEV MOBILEPC SOFT organise agrave Paris chaque semaine des seacuteminaires de formation agrave WINDEV WEBDEV et WINDEV Mobile de diffeacuterents niveaux  Prise en main Perfectionnement Expert ClientServeur

Ces seacuteminaires animeacutes par des ingeacutenieurs PC SOFT expeacuterimenteacutes (compeacutetence assureacutee ) permettent de deacutecouvrir et de maicirctriser WINDEV WEBDEV et WINDEV Mobile selon un plan efficaceConsultez le calendrier des seacuteminaires joint (le deacutetail des stages et les contenus peacutedagogiques sont disponibles sur notre site Web  wwwpcsoftfr) vous trouverez LA formation adapteacutee agrave votre expeacuterience et agrave votre besoin

Suivre une formation organiseacutee par PC SOFT est toujours rentable crsquoest se donner les moyens de maicirctriser WINDEV et WEBDEV dans les meilleurs deacutelais ou drsquoen deacutecouvrir la face cacheacutee encore plus puissante Inscrivez-vous vite Ces seacuteminaires peuvent eacutegalement ecirctre organiseacutes dans vos locaux en France et agrave lrsquoeacutetrangerLe montant de ces formations est deacuteductible du ldquo15 Formationrdquo

8 - TDF Tech 2015 - wwwpcsoftfr

Preacutesentation

TDF Tech 2015 - wwwpcsoftfr - 9

TDF Tech 2015 - wwwpcsoftfr - 9

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 2: TDF Tech 2015 Support de cours - PC SOFT WINDEV

Le document que vous avez entre les mains nrsquoa pas la finaliteacute de remplacer les documentations techniques ou commerciales livreacutees avec WINDEV WEBDEV ou WINDEV Mobile

Ce document nrsquoest pas un cours drsquoauto-formation mais uni-quement un support ldquopapierrdquo de la preacutesentation technique que vous avez suivie

Ce document a eacuteteacute reacutealiseacute par lrsquoeacutequipe de la LST

TDF Tech 2015 - wwwpcsoftfr - 3

TDF Tech 2015 - wwwpcsoftfr - 3

TDF TECH 2015 SOMMAIRE

Retrouvez dans ce support de cours les sujets abordeacutes lors du TDF Tech 2015Le code source des diffeacuterentes applications et projets indiqueacutes dans ce support de cours est preacutesent sur le DVD du TDF Tech 2015

4 Sommaire

8 PC SOFT agrave votre service

10 WINDEV Preacutesentation rapide de WINDEV et de ses fonctionnaliteacutes

12 WEBDEV Preacutesentation rapide de WEBDEV et de ses fonctionnaliteacutes

14 WINDEV Mobile Preacutesentation rapide de WINDEV Mobile et de ses fonctionnaliteacutes

18 Centre de Suivi de Projets exigences tableau de bord Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de

bordrdquo Des onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

20 Composant CCFeedback Le composant CCFeedback permet agrave vos utilisateurs drsquoenvoyer des suggestions des tickets drsquoincidents ou des regravegles

meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

22 Le Centre de Controcircle HFSQL Le Centre de Controcircle HFSQL fait partie des outils incontournables

En version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

24 Le champ Carte LechampCartepermetdrsquoafficherunecarteGoogledansvosapplicationsetvossites

Vouspouvezajouterdesmarqueursdesitineacuterairesmodifierlapositionetc VouspouvezmecircmeallerplusloinenmanipulantdirectementlrsquoobjetGoogle

4 - TDF Tech 2015 - wwwpcsoftfr

26 Le WLangage nouveauteacutes utiles Le WLangage crsquoest votre outil de travail au quotidien

Crsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacutee Voici quelques nouveauteacutes remarquables de la version 20

30 Astuces de deacutebogage Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le

deacutebogueur Cet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

32 Nouveauteacutes sur les eacutetats Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etc

La version 20 apporte son lot de nouveauteacutes sur les eacuteditions Petit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

34 PCSCloud votre solution Cloud PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases

de donneacutees HFSQL PCSCloudproposeeacutegalementdesplateformesdedeacuteveloppementpourstockeretpartagervosprojets(GestionnairedeSources)lesdonneacuteesdevosCentresdeControcircleetlaconfigurationdevotreenvironnementdedeacuteveloppement

36 HFSQL les vues En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquo

Qursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

38 Tableau croiseacute dynamique 4 raisons de lrsquoutiliser Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications

Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateurs

40 Le champ Graphe Secteur multiniveau Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les

diffeacuterents niveaux Voici 3 utilisations diffeacuterentes de ce nouveau graphe

TDF Tech 2015 - wwwpcsoftfr - 5

TDF TECH 2015SOMMAIRE (SUITE)

42 Onglets dynamiques moderniser une application Les onglets dynamiques permettent de proposer une interface moderne et intuitive

Cet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

44 Le champ Tableur Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications

PlusbesoindegeacutererdeslicencesdrsquoinstallerOfficeoudemanipulerunActiveX Vous utilisez un champ et des ordres WLangage adapteacutes

46 Le champ Confeacuterence Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines

distantes Avec1champet2fonctionsWLangagevousreacutealisezsimplementetrapidementunoutildecommunication

48 Editeur de fenecirctres En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomie

Danscesujetnousvouspreacutesentons11fonctionnaliteacutestregravesutilesdelrsquoeacutediteurdefenecirctres Lisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

50 Architecture logicielle MVP (Modegravele-Vue-Preacutesentation) Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppement

Lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20 Cet article deacutetaille une utilisation de cette architecture

52 Applications transportables (ldquoPortablesAppsrdquo) Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave

AvecWINDEVvouspouvezcreacuteercegenredrsquoapplicationfacilement Attentiontoutefoisilyaquelquesregraveglesagraverespecter

54 Un tableau de bord dans vos sites Equivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les

mecircmes concepts mais adapteacutes au Web IdeacutealpouravoirunevisionglobaleousyntheacutetiqueilvarapidementdevenirINDISPENSABLE

56 7 astuces pour maicirctriser le champ Tableau de bord LechampTableaudeborddeWEBDEVpeutecirctredeacutefinientiegraverementeneacuteditiondanslaplupartdescas

Il est cependant possible de le personnaliser preacuteciseacutement par programmation Voici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord

58 Des graphes interactifs en 1 clic ReacutevolutioncomplegraveteducocircteacuteduchampGraphedeWEBDEV20

6 - TDF Tech 2015 - wwwpcsoftfr

60 Actualiser simplement des champs apregraves un appel Ajax Simplifiezledialogueaveclrsquoutilisateuretreacuteduisezlestempsdereacuteponsesgracircceagravelrsquoactualisationautomatiquedeschamps

apregravesunappelAjax

61 Des sites plus rapides gracircce aux sessions preacutelanceacutees Lrsquoutilisationdessessionspreacutelanceacuteespermetdrsquoacceacuteleacutererlrsquoaffichagedespageseneffectuantparanticipationdes

traitementslongs(connexionsauxbasesdedonneacuteeschargementdeconfigurationsetdepagesetc)

62 WEBDEV 20 5 astuces rapides agrave mettre en œuvre Formulaires originaux changement dynamique de feuilles de styles CSS effets automatiques sur les images ruptures

dans les tables colonnes conteneur

64 Le champ Table en mobile Le champ Table est un champ incontournable dans les applications Windows

Enversion20lesapplicationsAndroidetiOSdisposentdrsquounchampTableproposantlesmecircmesfonctionnaliteacutesetlamecircme richesse que dans une application WINDEV

66 Les agencements LesagencementspermettentenquelquesclicsdedeacutefinirplusieursldquomisesenpagerdquopourvosIHMmobiles

Agrave lrsquoexeacutecution WINDEV Mobile utilise automatiquement lrsquoagencement le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

68 Nouveauteacutes mobiles Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON

Voici quelques-unes des nouveauteacutes mobiles de la version 20

70 RAD Mobile creacuteation drsquoune table et drsquoune fiche LesfenecirctresRADpermettentdecreacuteerenquelquesclicsdesfenecirctresfonctionnellespourvosapplicationsAndroidet

iOS disposant drsquoune analyse PlusieurstypesdefenecirctresRADsontdisponiblesfiche(avecousansimage)tablezonereacutepeacuteteacuteeetc Ilsuffitdesuivrelrsquoassistant

Annexes76 Annexe 1 Le GDS

80 Annexe 2 Inteacutegration continue (fabrique logicielle)

86 Annexe 3 Les donneacutees drsquoun champ TCD (cube ROLAP) dans un graphe

TDF Tech 2015 - wwwpcsoftfr - 7

PC SOFT agrave votre serviceNrsquoheacutesitez pas agrave nous contacter une journeacutee de consulting est toujours rentable pour vos deacuteveloppements

Assistance DirecteUn compleacutement efficace du Support Technique GratuitTout projet important ou strateacutegique doit beacuteneacuteficier drsquoune ldquoAssistance Directerdquo

LrsquoAssistance Directe permet drsquoune part de beacuteneacuteficier drsquoun contact teacuteleacutephonique immeacutediat avec un ingeacutenieur speacutecialiseacute et drsquoautre part de choisir les sujets agrave traiter et ce pour une dureacutee que vous deacutefinissez vous-mecircme Cela vous permet de reacutesoudre immeacutediatement les sujets qui vous posent problegraveme

Le contact teacuteleacutephonique est garanti sous 8 heures ouvrables ce qui vous permet une meilleure efficaciteacute Ce service est disponible sur abonnement

Contactez le service commercial pour plus drsquoinformations (Fabrice CHAMBON au 0467032032)

Support Technique Gratuit

Le site du support technique gratuit (wwwpcsoftfrst) met gratuitement agrave votre disposition un ensemble drsquoinformations destineacutees agrave vous aider agrave mieux deacutevelopper bull les FAQ bull les teacuteleacutechargementsbull les forums deacuteveloppeurs professionnels (News Group)Vous avez une question  Contactez  le Support Technique Gratuit PC SOFT bull Avec  lrsquoutilitaire RequecircteAuST (meacutedia conseilleacute) Votre requecircte sera geacuteneacuteralement traiteacutee sous 48 heuresbull Par teacuteleacutephone au 0467031717 (preacuteparez votre numeacutero de seacuterie et votre question svp) ou par courrierEnvoi par email merci de ne pas attacher de fichiers de taille supeacuterieure agrave 10 Mo sans lrsquoaccord preacutealable de votre destinataire Sinon votre fichier sera refuseacute par le systegraveme

ConsultingProfitez de lrsquoexpeacuterience drsquoun ingeacutenieur de PC SOFT sur votre siteUn consulting PC SOFT peut ecirctre deacuteleacutegueacute chez vous pour une dureacutee de 1 agrave 5 jours un ingeacutenieur PC SOFT connaissant agrave la fois votre domaine et les outils que vous utilisezLrsquoingeacutenieur PC SOFT reacutepond directement agrave vos questions travaille sur votre projet reacuteel et votre configuration reacuteelle Vous obtenez les reacuteponses preacutecises qui vous font gagner un temps preacutecieux et vous assurent des bonnes orientations technologiques et meacutethodologiques

Notre conseil Commandez 1 jour de consulting pour 100 jours de deacuteveloppement

Et chaque anneacutee prenez lrsquohabitude de faire venir ( juste 2 jours) chez vous un ingeacutenieur PC SOFT pour profiter drsquoune expertise de toutes les nouveauteacutesSur votre projet dans vos locaux en votre preacutesence lrsquoingeacutenieur PC SOFT valide lrsquoanalyse vous montre des nouveauteacutes utiles dans votre cas de figure vous propose des optimisations de votre code valide vos modes drsquoutilisation Vous serez ravi de lrsquoefficaciteacute de son intervention Budgeacutetez drsquoores et deacutejagrave la prochaine intervention

Un assistanat vous fait gagner des journeacutees de deacuteveloppementQuelques exemples de sujets traiteacutes bull Simplification du code et mise en place de nouvelles techniques  HFSQL ClientServeur Sockets Webservices Composants Patchs Configurations hellipbull Transformation de modules deacuteveloppeacutes avec WINDEV en Webservicesbull Optimisation de traitements avant la recette de lrsquoapplication validation drsquoanalyse avant de deacutebuter une application

FormationSeacuteminaires de formation pour WINDEV WEBDEV et WINDEV MOBILEPC SOFT organise agrave Paris chaque semaine des seacuteminaires de formation agrave WINDEV WEBDEV et WINDEV Mobile de diffeacuterents niveaux  Prise en main Perfectionnement Expert ClientServeur

Ces seacuteminaires animeacutes par des ingeacutenieurs PC SOFT expeacuterimenteacutes (compeacutetence assureacutee ) permettent de deacutecouvrir et de maicirctriser WINDEV WEBDEV et WINDEV Mobile selon un plan efficaceConsultez le calendrier des seacuteminaires joint (le deacutetail des stages et les contenus peacutedagogiques sont disponibles sur notre site Web  wwwpcsoftfr) vous trouverez LA formation adapteacutee agrave votre expeacuterience et agrave votre besoin

Suivre une formation organiseacutee par PC SOFT est toujours rentable crsquoest se donner les moyens de maicirctriser WINDEV et WEBDEV dans les meilleurs deacutelais ou drsquoen deacutecouvrir la face cacheacutee encore plus puissante Inscrivez-vous vite Ces seacuteminaires peuvent eacutegalement ecirctre organiseacutes dans vos locaux en France et agrave lrsquoeacutetrangerLe montant de ces formations est deacuteductible du ldquo15 Formationrdquo

8 - TDF Tech 2015 - wwwpcsoftfr

Preacutesentation

TDF Tech 2015 - wwwpcsoftfr - 9

TDF Tech 2015 - wwwpcsoftfr - 9

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 3: TDF Tech 2015 Support de cours - PC SOFT WINDEV

TDF TECH 2015 SOMMAIRE

Retrouvez dans ce support de cours les sujets abordeacutes lors du TDF Tech 2015Le code source des diffeacuterentes applications et projets indiqueacutes dans ce support de cours est preacutesent sur le DVD du TDF Tech 2015

4 Sommaire

8 PC SOFT agrave votre service

10 WINDEV Preacutesentation rapide de WINDEV et de ses fonctionnaliteacutes

12 WEBDEV Preacutesentation rapide de WEBDEV et de ses fonctionnaliteacutes

14 WINDEV Mobile Preacutesentation rapide de WINDEV Mobile et de ses fonctionnaliteacutes

18 Centre de Suivi de Projets exigences tableau de bord Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de

bordrdquo Des onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

20 Composant CCFeedback Le composant CCFeedback permet agrave vos utilisateurs drsquoenvoyer des suggestions des tickets drsquoincidents ou des regravegles

meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

22 Le Centre de Controcircle HFSQL Le Centre de Controcircle HFSQL fait partie des outils incontournables

En version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

24 Le champ Carte LechampCartepermetdrsquoafficherunecarteGoogledansvosapplicationsetvossites

Vouspouvezajouterdesmarqueursdesitineacuterairesmodifierlapositionetc VouspouvezmecircmeallerplusloinenmanipulantdirectementlrsquoobjetGoogle

4 - TDF Tech 2015 - wwwpcsoftfr

26 Le WLangage nouveauteacutes utiles Le WLangage crsquoest votre outil de travail au quotidien

Crsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacutee Voici quelques nouveauteacutes remarquables de la version 20

30 Astuces de deacutebogage Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le

deacutebogueur Cet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

32 Nouveauteacutes sur les eacutetats Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etc

La version 20 apporte son lot de nouveauteacutes sur les eacuteditions Petit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

34 PCSCloud votre solution Cloud PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases

de donneacutees HFSQL PCSCloudproposeeacutegalementdesplateformesdedeacuteveloppementpourstockeretpartagervosprojets(GestionnairedeSources)lesdonneacuteesdevosCentresdeControcircleetlaconfigurationdevotreenvironnementdedeacuteveloppement

36 HFSQL les vues En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquo

Qursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

38 Tableau croiseacute dynamique 4 raisons de lrsquoutiliser Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications

Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateurs

40 Le champ Graphe Secteur multiniveau Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les

diffeacuterents niveaux Voici 3 utilisations diffeacuterentes de ce nouveau graphe

TDF Tech 2015 - wwwpcsoftfr - 5

TDF TECH 2015SOMMAIRE (SUITE)

42 Onglets dynamiques moderniser une application Les onglets dynamiques permettent de proposer une interface moderne et intuitive

Cet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

44 Le champ Tableur Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications

PlusbesoindegeacutererdeslicencesdrsquoinstallerOfficeoudemanipulerunActiveX Vous utilisez un champ et des ordres WLangage adapteacutes

46 Le champ Confeacuterence Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines

distantes Avec1champet2fonctionsWLangagevousreacutealisezsimplementetrapidementunoutildecommunication

48 Editeur de fenecirctres En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomie

Danscesujetnousvouspreacutesentons11fonctionnaliteacutestregravesutilesdelrsquoeacutediteurdefenecirctres Lisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

50 Architecture logicielle MVP (Modegravele-Vue-Preacutesentation) Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppement

Lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20 Cet article deacutetaille une utilisation de cette architecture

52 Applications transportables (ldquoPortablesAppsrdquo) Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave

AvecWINDEVvouspouvezcreacuteercegenredrsquoapplicationfacilement Attentiontoutefoisilyaquelquesregraveglesagraverespecter

54 Un tableau de bord dans vos sites Equivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les

mecircmes concepts mais adapteacutes au Web IdeacutealpouravoirunevisionglobaleousyntheacutetiqueilvarapidementdevenirINDISPENSABLE

56 7 astuces pour maicirctriser le champ Tableau de bord LechampTableaudeborddeWEBDEVpeutecirctredeacutefinientiegraverementeneacuteditiondanslaplupartdescas

Il est cependant possible de le personnaliser preacuteciseacutement par programmation Voici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord

58 Des graphes interactifs en 1 clic ReacutevolutioncomplegraveteducocircteacuteduchampGraphedeWEBDEV20

6 - TDF Tech 2015 - wwwpcsoftfr

60 Actualiser simplement des champs apregraves un appel Ajax Simplifiezledialogueaveclrsquoutilisateuretreacuteduisezlestempsdereacuteponsesgracircceagravelrsquoactualisationautomatiquedeschamps

apregravesunappelAjax

61 Des sites plus rapides gracircce aux sessions preacutelanceacutees Lrsquoutilisationdessessionspreacutelanceacuteespermetdrsquoacceacuteleacutererlrsquoaffichagedespageseneffectuantparanticipationdes

traitementslongs(connexionsauxbasesdedonneacuteeschargementdeconfigurationsetdepagesetc)

62 WEBDEV 20 5 astuces rapides agrave mettre en œuvre Formulaires originaux changement dynamique de feuilles de styles CSS effets automatiques sur les images ruptures

dans les tables colonnes conteneur

64 Le champ Table en mobile Le champ Table est un champ incontournable dans les applications Windows

Enversion20lesapplicationsAndroidetiOSdisposentdrsquounchampTableproposantlesmecircmesfonctionnaliteacutesetlamecircme richesse que dans une application WINDEV

66 Les agencements LesagencementspermettentenquelquesclicsdedeacutefinirplusieursldquomisesenpagerdquopourvosIHMmobiles

Agrave lrsquoexeacutecution WINDEV Mobile utilise automatiquement lrsquoagencement le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

68 Nouveauteacutes mobiles Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON

Voici quelques-unes des nouveauteacutes mobiles de la version 20

70 RAD Mobile creacuteation drsquoune table et drsquoune fiche LesfenecirctresRADpermettentdecreacuteerenquelquesclicsdesfenecirctresfonctionnellespourvosapplicationsAndroidet

iOS disposant drsquoune analyse PlusieurstypesdefenecirctresRADsontdisponiblesfiche(avecousansimage)tablezonereacutepeacuteteacuteeetc Ilsuffitdesuivrelrsquoassistant

Annexes76 Annexe 1 Le GDS

80 Annexe 2 Inteacutegration continue (fabrique logicielle)

86 Annexe 3 Les donneacutees drsquoun champ TCD (cube ROLAP) dans un graphe

TDF Tech 2015 - wwwpcsoftfr - 7

PC SOFT agrave votre serviceNrsquoheacutesitez pas agrave nous contacter une journeacutee de consulting est toujours rentable pour vos deacuteveloppements

Assistance DirecteUn compleacutement efficace du Support Technique GratuitTout projet important ou strateacutegique doit beacuteneacuteficier drsquoune ldquoAssistance Directerdquo

LrsquoAssistance Directe permet drsquoune part de beacuteneacuteficier drsquoun contact teacuteleacutephonique immeacutediat avec un ingeacutenieur speacutecialiseacute et drsquoautre part de choisir les sujets agrave traiter et ce pour une dureacutee que vous deacutefinissez vous-mecircme Cela vous permet de reacutesoudre immeacutediatement les sujets qui vous posent problegraveme

Le contact teacuteleacutephonique est garanti sous 8 heures ouvrables ce qui vous permet une meilleure efficaciteacute Ce service est disponible sur abonnement

Contactez le service commercial pour plus drsquoinformations (Fabrice CHAMBON au 0467032032)

Support Technique Gratuit

Le site du support technique gratuit (wwwpcsoftfrst) met gratuitement agrave votre disposition un ensemble drsquoinformations destineacutees agrave vous aider agrave mieux deacutevelopper bull les FAQ bull les teacuteleacutechargementsbull les forums deacuteveloppeurs professionnels (News Group)Vous avez une question  Contactez  le Support Technique Gratuit PC SOFT bull Avec  lrsquoutilitaire RequecircteAuST (meacutedia conseilleacute) Votre requecircte sera geacuteneacuteralement traiteacutee sous 48 heuresbull Par teacuteleacutephone au 0467031717 (preacuteparez votre numeacutero de seacuterie et votre question svp) ou par courrierEnvoi par email merci de ne pas attacher de fichiers de taille supeacuterieure agrave 10 Mo sans lrsquoaccord preacutealable de votre destinataire Sinon votre fichier sera refuseacute par le systegraveme

ConsultingProfitez de lrsquoexpeacuterience drsquoun ingeacutenieur de PC SOFT sur votre siteUn consulting PC SOFT peut ecirctre deacuteleacutegueacute chez vous pour une dureacutee de 1 agrave 5 jours un ingeacutenieur PC SOFT connaissant agrave la fois votre domaine et les outils que vous utilisezLrsquoingeacutenieur PC SOFT reacutepond directement agrave vos questions travaille sur votre projet reacuteel et votre configuration reacuteelle Vous obtenez les reacuteponses preacutecises qui vous font gagner un temps preacutecieux et vous assurent des bonnes orientations technologiques et meacutethodologiques

Notre conseil Commandez 1 jour de consulting pour 100 jours de deacuteveloppement

Et chaque anneacutee prenez lrsquohabitude de faire venir ( juste 2 jours) chez vous un ingeacutenieur PC SOFT pour profiter drsquoune expertise de toutes les nouveauteacutesSur votre projet dans vos locaux en votre preacutesence lrsquoingeacutenieur PC SOFT valide lrsquoanalyse vous montre des nouveauteacutes utiles dans votre cas de figure vous propose des optimisations de votre code valide vos modes drsquoutilisation Vous serez ravi de lrsquoefficaciteacute de son intervention Budgeacutetez drsquoores et deacutejagrave la prochaine intervention

Un assistanat vous fait gagner des journeacutees de deacuteveloppementQuelques exemples de sujets traiteacutes bull Simplification du code et mise en place de nouvelles techniques  HFSQL ClientServeur Sockets Webservices Composants Patchs Configurations hellipbull Transformation de modules deacuteveloppeacutes avec WINDEV en Webservicesbull Optimisation de traitements avant la recette de lrsquoapplication validation drsquoanalyse avant de deacutebuter une application

FormationSeacuteminaires de formation pour WINDEV WEBDEV et WINDEV MOBILEPC SOFT organise agrave Paris chaque semaine des seacuteminaires de formation agrave WINDEV WEBDEV et WINDEV Mobile de diffeacuterents niveaux  Prise en main Perfectionnement Expert ClientServeur

Ces seacuteminaires animeacutes par des ingeacutenieurs PC SOFT expeacuterimenteacutes (compeacutetence assureacutee ) permettent de deacutecouvrir et de maicirctriser WINDEV WEBDEV et WINDEV Mobile selon un plan efficaceConsultez le calendrier des seacuteminaires joint (le deacutetail des stages et les contenus peacutedagogiques sont disponibles sur notre site Web  wwwpcsoftfr) vous trouverez LA formation adapteacutee agrave votre expeacuterience et agrave votre besoin

Suivre une formation organiseacutee par PC SOFT est toujours rentable crsquoest se donner les moyens de maicirctriser WINDEV et WEBDEV dans les meilleurs deacutelais ou drsquoen deacutecouvrir la face cacheacutee encore plus puissante Inscrivez-vous vite Ces seacuteminaires peuvent eacutegalement ecirctre organiseacutes dans vos locaux en France et agrave lrsquoeacutetrangerLe montant de ces formations est deacuteductible du ldquo15 Formationrdquo

8 - TDF Tech 2015 - wwwpcsoftfr

Preacutesentation

TDF Tech 2015 - wwwpcsoftfr - 9

TDF Tech 2015 - wwwpcsoftfr - 9

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 4: TDF Tech 2015 Support de cours - PC SOFT WINDEV

26 Le WLangage nouveauteacutes utiles Le WLangage crsquoest votre outil de travail au quotidien

Crsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacutee Voici quelques nouveauteacutes remarquables de la version 20

30 Astuces de deacutebogage Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le

deacutebogueur Cet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

32 Nouveauteacutes sur les eacutetats Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etc

La version 20 apporte son lot de nouveauteacutes sur les eacuteditions Petit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

34 PCSCloud votre solution Cloud PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases

de donneacutees HFSQL PCSCloudproposeeacutegalementdesplateformesdedeacuteveloppementpourstockeretpartagervosprojets(GestionnairedeSources)lesdonneacuteesdevosCentresdeControcircleetlaconfigurationdevotreenvironnementdedeacuteveloppement

36 HFSQL les vues En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquo

Qursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

38 Tableau croiseacute dynamique 4 raisons de lrsquoutiliser Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications

Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateurs

40 Le champ Graphe Secteur multiniveau Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les

diffeacuterents niveaux Voici 3 utilisations diffeacuterentes de ce nouveau graphe

TDF Tech 2015 - wwwpcsoftfr - 5

TDF TECH 2015SOMMAIRE (SUITE)

42 Onglets dynamiques moderniser une application Les onglets dynamiques permettent de proposer une interface moderne et intuitive

Cet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

44 Le champ Tableur Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications

PlusbesoindegeacutererdeslicencesdrsquoinstallerOfficeoudemanipulerunActiveX Vous utilisez un champ et des ordres WLangage adapteacutes

46 Le champ Confeacuterence Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines

distantes Avec1champet2fonctionsWLangagevousreacutealisezsimplementetrapidementunoutildecommunication

48 Editeur de fenecirctres En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomie

Danscesujetnousvouspreacutesentons11fonctionnaliteacutestregravesutilesdelrsquoeacutediteurdefenecirctres Lisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

50 Architecture logicielle MVP (Modegravele-Vue-Preacutesentation) Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppement

Lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20 Cet article deacutetaille une utilisation de cette architecture

52 Applications transportables (ldquoPortablesAppsrdquo) Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave

AvecWINDEVvouspouvezcreacuteercegenredrsquoapplicationfacilement Attentiontoutefoisilyaquelquesregraveglesagraverespecter

54 Un tableau de bord dans vos sites Equivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les

mecircmes concepts mais adapteacutes au Web IdeacutealpouravoirunevisionglobaleousyntheacutetiqueilvarapidementdevenirINDISPENSABLE

56 7 astuces pour maicirctriser le champ Tableau de bord LechampTableaudeborddeWEBDEVpeutecirctredeacutefinientiegraverementeneacuteditiondanslaplupartdescas

Il est cependant possible de le personnaliser preacuteciseacutement par programmation Voici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord

58 Des graphes interactifs en 1 clic ReacutevolutioncomplegraveteducocircteacuteduchampGraphedeWEBDEV20

6 - TDF Tech 2015 - wwwpcsoftfr

60 Actualiser simplement des champs apregraves un appel Ajax Simplifiezledialogueaveclrsquoutilisateuretreacuteduisezlestempsdereacuteponsesgracircceagravelrsquoactualisationautomatiquedeschamps

apregravesunappelAjax

61 Des sites plus rapides gracircce aux sessions preacutelanceacutees Lrsquoutilisationdessessionspreacutelanceacuteespermetdrsquoacceacuteleacutererlrsquoaffichagedespageseneffectuantparanticipationdes

traitementslongs(connexionsauxbasesdedonneacuteeschargementdeconfigurationsetdepagesetc)

62 WEBDEV 20 5 astuces rapides agrave mettre en œuvre Formulaires originaux changement dynamique de feuilles de styles CSS effets automatiques sur les images ruptures

dans les tables colonnes conteneur

64 Le champ Table en mobile Le champ Table est un champ incontournable dans les applications Windows

Enversion20lesapplicationsAndroidetiOSdisposentdrsquounchampTableproposantlesmecircmesfonctionnaliteacutesetlamecircme richesse que dans une application WINDEV

66 Les agencements LesagencementspermettentenquelquesclicsdedeacutefinirplusieursldquomisesenpagerdquopourvosIHMmobiles

Agrave lrsquoexeacutecution WINDEV Mobile utilise automatiquement lrsquoagencement le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

68 Nouveauteacutes mobiles Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON

Voici quelques-unes des nouveauteacutes mobiles de la version 20

70 RAD Mobile creacuteation drsquoune table et drsquoune fiche LesfenecirctresRADpermettentdecreacuteerenquelquesclicsdesfenecirctresfonctionnellespourvosapplicationsAndroidet

iOS disposant drsquoune analyse PlusieurstypesdefenecirctresRADsontdisponiblesfiche(avecousansimage)tablezonereacutepeacuteteacuteeetc Ilsuffitdesuivrelrsquoassistant

Annexes76 Annexe 1 Le GDS

80 Annexe 2 Inteacutegration continue (fabrique logicielle)

86 Annexe 3 Les donneacutees drsquoun champ TCD (cube ROLAP) dans un graphe

TDF Tech 2015 - wwwpcsoftfr - 7

PC SOFT agrave votre serviceNrsquoheacutesitez pas agrave nous contacter une journeacutee de consulting est toujours rentable pour vos deacuteveloppements

Assistance DirecteUn compleacutement efficace du Support Technique GratuitTout projet important ou strateacutegique doit beacuteneacuteficier drsquoune ldquoAssistance Directerdquo

LrsquoAssistance Directe permet drsquoune part de beacuteneacuteficier drsquoun contact teacuteleacutephonique immeacutediat avec un ingeacutenieur speacutecialiseacute et drsquoautre part de choisir les sujets agrave traiter et ce pour une dureacutee que vous deacutefinissez vous-mecircme Cela vous permet de reacutesoudre immeacutediatement les sujets qui vous posent problegraveme

Le contact teacuteleacutephonique est garanti sous 8 heures ouvrables ce qui vous permet une meilleure efficaciteacute Ce service est disponible sur abonnement

Contactez le service commercial pour plus drsquoinformations (Fabrice CHAMBON au 0467032032)

Support Technique Gratuit

Le site du support technique gratuit (wwwpcsoftfrst) met gratuitement agrave votre disposition un ensemble drsquoinformations destineacutees agrave vous aider agrave mieux deacutevelopper bull les FAQ bull les teacuteleacutechargementsbull les forums deacuteveloppeurs professionnels (News Group)Vous avez une question  Contactez  le Support Technique Gratuit PC SOFT bull Avec  lrsquoutilitaire RequecircteAuST (meacutedia conseilleacute) Votre requecircte sera geacuteneacuteralement traiteacutee sous 48 heuresbull Par teacuteleacutephone au 0467031717 (preacuteparez votre numeacutero de seacuterie et votre question svp) ou par courrierEnvoi par email merci de ne pas attacher de fichiers de taille supeacuterieure agrave 10 Mo sans lrsquoaccord preacutealable de votre destinataire Sinon votre fichier sera refuseacute par le systegraveme

ConsultingProfitez de lrsquoexpeacuterience drsquoun ingeacutenieur de PC SOFT sur votre siteUn consulting PC SOFT peut ecirctre deacuteleacutegueacute chez vous pour une dureacutee de 1 agrave 5 jours un ingeacutenieur PC SOFT connaissant agrave la fois votre domaine et les outils que vous utilisezLrsquoingeacutenieur PC SOFT reacutepond directement agrave vos questions travaille sur votre projet reacuteel et votre configuration reacuteelle Vous obtenez les reacuteponses preacutecises qui vous font gagner un temps preacutecieux et vous assurent des bonnes orientations technologiques et meacutethodologiques

Notre conseil Commandez 1 jour de consulting pour 100 jours de deacuteveloppement

Et chaque anneacutee prenez lrsquohabitude de faire venir ( juste 2 jours) chez vous un ingeacutenieur PC SOFT pour profiter drsquoune expertise de toutes les nouveauteacutesSur votre projet dans vos locaux en votre preacutesence lrsquoingeacutenieur PC SOFT valide lrsquoanalyse vous montre des nouveauteacutes utiles dans votre cas de figure vous propose des optimisations de votre code valide vos modes drsquoutilisation Vous serez ravi de lrsquoefficaciteacute de son intervention Budgeacutetez drsquoores et deacutejagrave la prochaine intervention

Un assistanat vous fait gagner des journeacutees de deacuteveloppementQuelques exemples de sujets traiteacutes bull Simplification du code et mise en place de nouvelles techniques  HFSQL ClientServeur Sockets Webservices Composants Patchs Configurations hellipbull Transformation de modules deacuteveloppeacutes avec WINDEV en Webservicesbull Optimisation de traitements avant la recette de lrsquoapplication validation drsquoanalyse avant de deacutebuter une application

FormationSeacuteminaires de formation pour WINDEV WEBDEV et WINDEV MOBILEPC SOFT organise agrave Paris chaque semaine des seacuteminaires de formation agrave WINDEV WEBDEV et WINDEV Mobile de diffeacuterents niveaux  Prise en main Perfectionnement Expert ClientServeur

Ces seacuteminaires animeacutes par des ingeacutenieurs PC SOFT expeacuterimenteacutes (compeacutetence assureacutee ) permettent de deacutecouvrir et de maicirctriser WINDEV WEBDEV et WINDEV Mobile selon un plan efficaceConsultez le calendrier des seacuteminaires joint (le deacutetail des stages et les contenus peacutedagogiques sont disponibles sur notre site Web  wwwpcsoftfr) vous trouverez LA formation adapteacutee agrave votre expeacuterience et agrave votre besoin

Suivre une formation organiseacutee par PC SOFT est toujours rentable crsquoest se donner les moyens de maicirctriser WINDEV et WEBDEV dans les meilleurs deacutelais ou drsquoen deacutecouvrir la face cacheacutee encore plus puissante Inscrivez-vous vite Ces seacuteminaires peuvent eacutegalement ecirctre organiseacutes dans vos locaux en France et agrave lrsquoeacutetrangerLe montant de ces formations est deacuteductible du ldquo15 Formationrdquo

8 - TDF Tech 2015 - wwwpcsoftfr

Preacutesentation

TDF Tech 2015 - wwwpcsoftfr - 9

TDF Tech 2015 - wwwpcsoftfr - 9

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 5: TDF Tech 2015 Support de cours - PC SOFT WINDEV

TDF TECH 2015SOMMAIRE (SUITE)

42 Onglets dynamiques moderniser une application Les onglets dynamiques permettent de proposer une interface moderne et intuitive

Cet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

44 Le champ Tableur Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications

PlusbesoindegeacutererdeslicencesdrsquoinstallerOfficeoudemanipulerunActiveX Vous utilisez un champ et des ordres WLangage adapteacutes

46 Le champ Confeacuterence Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines

distantes Avec1champet2fonctionsWLangagevousreacutealisezsimplementetrapidementunoutildecommunication

48 Editeur de fenecirctres En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomie

Danscesujetnousvouspreacutesentons11fonctionnaliteacutestregravesutilesdelrsquoeacutediteurdefenecirctres Lisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

50 Architecture logicielle MVP (Modegravele-Vue-Preacutesentation) Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppement

Lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20 Cet article deacutetaille une utilisation de cette architecture

52 Applications transportables (ldquoPortablesAppsrdquo) Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave

AvecWINDEVvouspouvezcreacuteercegenredrsquoapplicationfacilement Attentiontoutefoisilyaquelquesregraveglesagraverespecter

54 Un tableau de bord dans vos sites Equivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les

mecircmes concepts mais adapteacutes au Web IdeacutealpouravoirunevisionglobaleousyntheacutetiqueilvarapidementdevenirINDISPENSABLE

56 7 astuces pour maicirctriser le champ Tableau de bord LechampTableaudeborddeWEBDEVpeutecirctredeacutefinientiegraverementeneacuteditiondanslaplupartdescas

Il est cependant possible de le personnaliser preacuteciseacutement par programmation Voici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord

58 Des graphes interactifs en 1 clic ReacutevolutioncomplegraveteducocircteacuteduchampGraphedeWEBDEV20

6 - TDF Tech 2015 - wwwpcsoftfr

60 Actualiser simplement des champs apregraves un appel Ajax Simplifiezledialogueaveclrsquoutilisateuretreacuteduisezlestempsdereacuteponsesgracircceagravelrsquoactualisationautomatiquedeschamps

apregravesunappelAjax

61 Des sites plus rapides gracircce aux sessions preacutelanceacutees Lrsquoutilisationdessessionspreacutelanceacuteespermetdrsquoacceacuteleacutererlrsquoaffichagedespageseneffectuantparanticipationdes

traitementslongs(connexionsauxbasesdedonneacuteeschargementdeconfigurationsetdepagesetc)

62 WEBDEV 20 5 astuces rapides agrave mettre en œuvre Formulaires originaux changement dynamique de feuilles de styles CSS effets automatiques sur les images ruptures

dans les tables colonnes conteneur

64 Le champ Table en mobile Le champ Table est un champ incontournable dans les applications Windows

Enversion20lesapplicationsAndroidetiOSdisposentdrsquounchampTableproposantlesmecircmesfonctionnaliteacutesetlamecircme richesse que dans une application WINDEV

66 Les agencements LesagencementspermettentenquelquesclicsdedeacutefinirplusieursldquomisesenpagerdquopourvosIHMmobiles

Agrave lrsquoexeacutecution WINDEV Mobile utilise automatiquement lrsquoagencement le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

68 Nouveauteacutes mobiles Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON

Voici quelques-unes des nouveauteacutes mobiles de la version 20

70 RAD Mobile creacuteation drsquoune table et drsquoune fiche LesfenecirctresRADpermettentdecreacuteerenquelquesclicsdesfenecirctresfonctionnellespourvosapplicationsAndroidet

iOS disposant drsquoune analyse PlusieurstypesdefenecirctresRADsontdisponiblesfiche(avecousansimage)tablezonereacutepeacuteteacuteeetc Ilsuffitdesuivrelrsquoassistant

Annexes76 Annexe 1 Le GDS

80 Annexe 2 Inteacutegration continue (fabrique logicielle)

86 Annexe 3 Les donneacutees drsquoun champ TCD (cube ROLAP) dans un graphe

TDF Tech 2015 - wwwpcsoftfr - 7

PC SOFT agrave votre serviceNrsquoheacutesitez pas agrave nous contacter une journeacutee de consulting est toujours rentable pour vos deacuteveloppements

Assistance DirecteUn compleacutement efficace du Support Technique GratuitTout projet important ou strateacutegique doit beacuteneacuteficier drsquoune ldquoAssistance Directerdquo

LrsquoAssistance Directe permet drsquoune part de beacuteneacuteficier drsquoun contact teacuteleacutephonique immeacutediat avec un ingeacutenieur speacutecialiseacute et drsquoautre part de choisir les sujets agrave traiter et ce pour une dureacutee que vous deacutefinissez vous-mecircme Cela vous permet de reacutesoudre immeacutediatement les sujets qui vous posent problegraveme

Le contact teacuteleacutephonique est garanti sous 8 heures ouvrables ce qui vous permet une meilleure efficaciteacute Ce service est disponible sur abonnement

Contactez le service commercial pour plus drsquoinformations (Fabrice CHAMBON au 0467032032)

Support Technique Gratuit

Le site du support technique gratuit (wwwpcsoftfrst) met gratuitement agrave votre disposition un ensemble drsquoinformations destineacutees agrave vous aider agrave mieux deacutevelopper bull les FAQ bull les teacuteleacutechargementsbull les forums deacuteveloppeurs professionnels (News Group)Vous avez une question  Contactez  le Support Technique Gratuit PC SOFT bull Avec  lrsquoutilitaire RequecircteAuST (meacutedia conseilleacute) Votre requecircte sera geacuteneacuteralement traiteacutee sous 48 heuresbull Par teacuteleacutephone au 0467031717 (preacuteparez votre numeacutero de seacuterie et votre question svp) ou par courrierEnvoi par email merci de ne pas attacher de fichiers de taille supeacuterieure agrave 10 Mo sans lrsquoaccord preacutealable de votre destinataire Sinon votre fichier sera refuseacute par le systegraveme

ConsultingProfitez de lrsquoexpeacuterience drsquoun ingeacutenieur de PC SOFT sur votre siteUn consulting PC SOFT peut ecirctre deacuteleacutegueacute chez vous pour une dureacutee de 1 agrave 5 jours un ingeacutenieur PC SOFT connaissant agrave la fois votre domaine et les outils que vous utilisezLrsquoingeacutenieur PC SOFT reacutepond directement agrave vos questions travaille sur votre projet reacuteel et votre configuration reacuteelle Vous obtenez les reacuteponses preacutecises qui vous font gagner un temps preacutecieux et vous assurent des bonnes orientations technologiques et meacutethodologiques

Notre conseil Commandez 1 jour de consulting pour 100 jours de deacuteveloppement

Et chaque anneacutee prenez lrsquohabitude de faire venir ( juste 2 jours) chez vous un ingeacutenieur PC SOFT pour profiter drsquoune expertise de toutes les nouveauteacutesSur votre projet dans vos locaux en votre preacutesence lrsquoingeacutenieur PC SOFT valide lrsquoanalyse vous montre des nouveauteacutes utiles dans votre cas de figure vous propose des optimisations de votre code valide vos modes drsquoutilisation Vous serez ravi de lrsquoefficaciteacute de son intervention Budgeacutetez drsquoores et deacutejagrave la prochaine intervention

Un assistanat vous fait gagner des journeacutees de deacuteveloppementQuelques exemples de sujets traiteacutes bull Simplification du code et mise en place de nouvelles techniques  HFSQL ClientServeur Sockets Webservices Composants Patchs Configurations hellipbull Transformation de modules deacuteveloppeacutes avec WINDEV en Webservicesbull Optimisation de traitements avant la recette de lrsquoapplication validation drsquoanalyse avant de deacutebuter une application

FormationSeacuteminaires de formation pour WINDEV WEBDEV et WINDEV MOBILEPC SOFT organise agrave Paris chaque semaine des seacuteminaires de formation agrave WINDEV WEBDEV et WINDEV Mobile de diffeacuterents niveaux  Prise en main Perfectionnement Expert ClientServeur

Ces seacuteminaires animeacutes par des ingeacutenieurs PC SOFT expeacuterimenteacutes (compeacutetence assureacutee ) permettent de deacutecouvrir et de maicirctriser WINDEV WEBDEV et WINDEV Mobile selon un plan efficaceConsultez le calendrier des seacuteminaires joint (le deacutetail des stages et les contenus peacutedagogiques sont disponibles sur notre site Web  wwwpcsoftfr) vous trouverez LA formation adapteacutee agrave votre expeacuterience et agrave votre besoin

Suivre une formation organiseacutee par PC SOFT est toujours rentable crsquoest se donner les moyens de maicirctriser WINDEV et WEBDEV dans les meilleurs deacutelais ou drsquoen deacutecouvrir la face cacheacutee encore plus puissante Inscrivez-vous vite Ces seacuteminaires peuvent eacutegalement ecirctre organiseacutes dans vos locaux en France et agrave lrsquoeacutetrangerLe montant de ces formations est deacuteductible du ldquo15 Formationrdquo

8 - TDF Tech 2015 - wwwpcsoftfr

Preacutesentation

TDF Tech 2015 - wwwpcsoftfr - 9

TDF Tech 2015 - wwwpcsoftfr - 9

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 6: TDF Tech 2015 Support de cours - PC SOFT WINDEV

60 Actualiser simplement des champs apregraves un appel Ajax Simplifiezledialogueaveclrsquoutilisateuretreacuteduisezlestempsdereacuteponsesgracircceagravelrsquoactualisationautomatiquedeschamps

apregravesunappelAjax

61 Des sites plus rapides gracircce aux sessions preacutelanceacutees Lrsquoutilisationdessessionspreacutelanceacuteespermetdrsquoacceacuteleacutererlrsquoaffichagedespageseneffectuantparanticipationdes

traitementslongs(connexionsauxbasesdedonneacuteeschargementdeconfigurationsetdepagesetc)

62 WEBDEV 20 5 astuces rapides agrave mettre en œuvre Formulaires originaux changement dynamique de feuilles de styles CSS effets automatiques sur les images ruptures

dans les tables colonnes conteneur

64 Le champ Table en mobile Le champ Table est un champ incontournable dans les applications Windows

Enversion20lesapplicationsAndroidetiOSdisposentdrsquounchampTableproposantlesmecircmesfonctionnaliteacutesetlamecircme richesse que dans une application WINDEV

66 Les agencements LesagencementspermettentenquelquesclicsdedeacutefinirplusieursldquomisesenpagerdquopourvosIHMmobiles

Agrave lrsquoexeacutecution WINDEV Mobile utilise automatiquement lrsquoagencement le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

68 Nouveauteacutes mobiles Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON

Voici quelques-unes des nouveauteacutes mobiles de la version 20

70 RAD Mobile creacuteation drsquoune table et drsquoune fiche LesfenecirctresRADpermettentdecreacuteerenquelquesclicsdesfenecirctresfonctionnellespourvosapplicationsAndroidet

iOS disposant drsquoune analyse PlusieurstypesdefenecirctresRADsontdisponiblesfiche(avecousansimage)tablezonereacutepeacuteteacuteeetc Ilsuffitdesuivrelrsquoassistant

Annexes76 Annexe 1 Le GDS

80 Annexe 2 Inteacutegration continue (fabrique logicielle)

86 Annexe 3 Les donneacutees drsquoun champ TCD (cube ROLAP) dans un graphe

TDF Tech 2015 - wwwpcsoftfr - 7

PC SOFT agrave votre serviceNrsquoheacutesitez pas agrave nous contacter une journeacutee de consulting est toujours rentable pour vos deacuteveloppements

Assistance DirecteUn compleacutement efficace du Support Technique GratuitTout projet important ou strateacutegique doit beacuteneacuteficier drsquoune ldquoAssistance Directerdquo

LrsquoAssistance Directe permet drsquoune part de beacuteneacuteficier drsquoun contact teacuteleacutephonique immeacutediat avec un ingeacutenieur speacutecialiseacute et drsquoautre part de choisir les sujets agrave traiter et ce pour une dureacutee que vous deacutefinissez vous-mecircme Cela vous permet de reacutesoudre immeacutediatement les sujets qui vous posent problegraveme

Le contact teacuteleacutephonique est garanti sous 8 heures ouvrables ce qui vous permet une meilleure efficaciteacute Ce service est disponible sur abonnement

Contactez le service commercial pour plus drsquoinformations (Fabrice CHAMBON au 0467032032)

Support Technique Gratuit

Le site du support technique gratuit (wwwpcsoftfrst) met gratuitement agrave votre disposition un ensemble drsquoinformations destineacutees agrave vous aider agrave mieux deacutevelopper bull les FAQ bull les teacuteleacutechargementsbull les forums deacuteveloppeurs professionnels (News Group)Vous avez une question  Contactez  le Support Technique Gratuit PC SOFT bull Avec  lrsquoutilitaire RequecircteAuST (meacutedia conseilleacute) Votre requecircte sera geacuteneacuteralement traiteacutee sous 48 heuresbull Par teacuteleacutephone au 0467031717 (preacuteparez votre numeacutero de seacuterie et votre question svp) ou par courrierEnvoi par email merci de ne pas attacher de fichiers de taille supeacuterieure agrave 10 Mo sans lrsquoaccord preacutealable de votre destinataire Sinon votre fichier sera refuseacute par le systegraveme

ConsultingProfitez de lrsquoexpeacuterience drsquoun ingeacutenieur de PC SOFT sur votre siteUn consulting PC SOFT peut ecirctre deacuteleacutegueacute chez vous pour une dureacutee de 1 agrave 5 jours un ingeacutenieur PC SOFT connaissant agrave la fois votre domaine et les outils que vous utilisezLrsquoingeacutenieur PC SOFT reacutepond directement agrave vos questions travaille sur votre projet reacuteel et votre configuration reacuteelle Vous obtenez les reacuteponses preacutecises qui vous font gagner un temps preacutecieux et vous assurent des bonnes orientations technologiques et meacutethodologiques

Notre conseil Commandez 1 jour de consulting pour 100 jours de deacuteveloppement

Et chaque anneacutee prenez lrsquohabitude de faire venir ( juste 2 jours) chez vous un ingeacutenieur PC SOFT pour profiter drsquoune expertise de toutes les nouveauteacutesSur votre projet dans vos locaux en votre preacutesence lrsquoingeacutenieur PC SOFT valide lrsquoanalyse vous montre des nouveauteacutes utiles dans votre cas de figure vous propose des optimisations de votre code valide vos modes drsquoutilisation Vous serez ravi de lrsquoefficaciteacute de son intervention Budgeacutetez drsquoores et deacutejagrave la prochaine intervention

Un assistanat vous fait gagner des journeacutees de deacuteveloppementQuelques exemples de sujets traiteacutes bull Simplification du code et mise en place de nouvelles techniques  HFSQL ClientServeur Sockets Webservices Composants Patchs Configurations hellipbull Transformation de modules deacuteveloppeacutes avec WINDEV en Webservicesbull Optimisation de traitements avant la recette de lrsquoapplication validation drsquoanalyse avant de deacutebuter une application

FormationSeacuteminaires de formation pour WINDEV WEBDEV et WINDEV MOBILEPC SOFT organise agrave Paris chaque semaine des seacuteminaires de formation agrave WINDEV WEBDEV et WINDEV Mobile de diffeacuterents niveaux  Prise en main Perfectionnement Expert ClientServeur

Ces seacuteminaires animeacutes par des ingeacutenieurs PC SOFT expeacuterimenteacutes (compeacutetence assureacutee ) permettent de deacutecouvrir et de maicirctriser WINDEV WEBDEV et WINDEV Mobile selon un plan efficaceConsultez le calendrier des seacuteminaires joint (le deacutetail des stages et les contenus peacutedagogiques sont disponibles sur notre site Web  wwwpcsoftfr) vous trouverez LA formation adapteacutee agrave votre expeacuterience et agrave votre besoin

Suivre une formation organiseacutee par PC SOFT est toujours rentable crsquoest se donner les moyens de maicirctriser WINDEV et WEBDEV dans les meilleurs deacutelais ou drsquoen deacutecouvrir la face cacheacutee encore plus puissante Inscrivez-vous vite Ces seacuteminaires peuvent eacutegalement ecirctre organiseacutes dans vos locaux en France et agrave lrsquoeacutetrangerLe montant de ces formations est deacuteductible du ldquo15 Formationrdquo

8 - TDF Tech 2015 - wwwpcsoftfr

Preacutesentation

TDF Tech 2015 - wwwpcsoftfr - 9

TDF Tech 2015 - wwwpcsoftfr - 9

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 7: TDF Tech 2015 Support de cours - PC SOFT WINDEV

PC SOFT agrave votre serviceNrsquoheacutesitez pas agrave nous contacter une journeacutee de consulting est toujours rentable pour vos deacuteveloppements

Assistance DirecteUn compleacutement efficace du Support Technique GratuitTout projet important ou strateacutegique doit beacuteneacuteficier drsquoune ldquoAssistance Directerdquo

LrsquoAssistance Directe permet drsquoune part de beacuteneacuteficier drsquoun contact teacuteleacutephonique immeacutediat avec un ingeacutenieur speacutecialiseacute et drsquoautre part de choisir les sujets agrave traiter et ce pour une dureacutee que vous deacutefinissez vous-mecircme Cela vous permet de reacutesoudre immeacutediatement les sujets qui vous posent problegraveme

Le contact teacuteleacutephonique est garanti sous 8 heures ouvrables ce qui vous permet une meilleure efficaciteacute Ce service est disponible sur abonnement

Contactez le service commercial pour plus drsquoinformations (Fabrice CHAMBON au 0467032032)

Support Technique Gratuit

Le site du support technique gratuit (wwwpcsoftfrst) met gratuitement agrave votre disposition un ensemble drsquoinformations destineacutees agrave vous aider agrave mieux deacutevelopper bull les FAQ bull les teacuteleacutechargementsbull les forums deacuteveloppeurs professionnels (News Group)Vous avez une question  Contactez  le Support Technique Gratuit PC SOFT bull Avec  lrsquoutilitaire RequecircteAuST (meacutedia conseilleacute) Votre requecircte sera geacuteneacuteralement traiteacutee sous 48 heuresbull Par teacuteleacutephone au 0467031717 (preacuteparez votre numeacutero de seacuterie et votre question svp) ou par courrierEnvoi par email merci de ne pas attacher de fichiers de taille supeacuterieure agrave 10 Mo sans lrsquoaccord preacutealable de votre destinataire Sinon votre fichier sera refuseacute par le systegraveme

ConsultingProfitez de lrsquoexpeacuterience drsquoun ingeacutenieur de PC SOFT sur votre siteUn consulting PC SOFT peut ecirctre deacuteleacutegueacute chez vous pour une dureacutee de 1 agrave 5 jours un ingeacutenieur PC SOFT connaissant agrave la fois votre domaine et les outils que vous utilisezLrsquoingeacutenieur PC SOFT reacutepond directement agrave vos questions travaille sur votre projet reacuteel et votre configuration reacuteelle Vous obtenez les reacuteponses preacutecises qui vous font gagner un temps preacutecieux et vous assurent des bonnes orientations technologiques et meacutethodologiques

Notre conseil Commandez 1 jour de consulting pour 100 jours de deacuteveloppement

Et chaque anneacutee prenez lrsquohabitude de faire venir ( juste 2 jours) chez vous un ingeacutenieur PC SOFT pour profiter drsquoune expertise de toutes les nouveauteacutesSur votre projet dans vos locaux en votre preacutesence lrsquoingeacutenieur PC SOFT valide lrsquoanalyse vous montre des nouveauteacutes utiles dans votre cas de figure vous propose des optimisations de votre code valide vos modes drsquoutilisation Vous serez ravi de lrsquoefficaciteacute de son intervention Budgeacutetez drsquoores et deacutejagrave la prochaine intervention

Un assistanat vous fait gagner des journeacutees de deacuteveloppementQuelques exemples de sujets traiteacutes bull Simplification du code et mise en place de nouvelles techniques  HFSQL ClientServeur Sockets Webservices Composants Patchs Configurations hellipbull Transformation de modules deacuteveloppeacutes avec WINDEV en Webservicesbull Optimisation de traitements avant la recette de lrsquoapplication validation drsquoanalyse avant de deacutebuter une application

FormationSeacuteminaires de formation pour WINDEV WEBDEV et WINDEV MOBILEPC SOFT organise agrave Paris chaque semaine des seacuteminaires de formation agrave WINDEV WEBDEV et WINDEV Mobile de diffeacuterents niveaux  Prise en main Perfectionnement Expert ClientServeur

Ces seacuteminaires animeacutes par des ingeacutenieurs PC SOFT expeacuterimenteacutes (compeacutetence assureacutee ) permettent de deacutecouvrir et de maicirctriser WINDEV WEBDEV et WINDEV Mobile selon un plan efficaceConsultez le calendrier des seacuteminaires joint (le deacutetail des stages et les contenus peacutedagogiques sont disponibles sur notre site Web  wwwpcsoftfr) vous trouverez LA formation adapteacutee agrave votre expeacuterience et agrave votre besoin

Suivre une formation organiseacutee par PC SOFT est toujours rentable crsquoest se donner les moyens de maicirctriser WINDEV et WEBDEV dans les meilleurs deacutelais ou drsquoen deacutecouvrir la face cacheacutee encore plus puissante Inscrivez-vous vite Ces seacuteminaires peuvent eacutegalement ecirctre organiseacutes dans vos locaux en France et agrave lrsquoeacutetrangerLe montant de ces formations est deacuteductible du ldquo15 Formationrdquo

8 - TDF Tech 2015 - wwwpcsoftfr

Preacutesentation

TDF Tech 2015 - wwwpcsoftfr - 9

TDF Tech 2015 - wwwpcsoftfr - 9

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 8: TDF Tech 2015 Support de cours - PC SOFT WINDEV

Preacutesentation

TDF Tech 2015 - wwwpcsoftfr - 9

TDF Tech 2015 - wwwpcsoftfr - 9

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 9: TDF Tech 2015 Support de cours - PC SOFT WINDEV

WINDEVPreacutesentation rapide de WINDEV 

et de ses fonctionnaliteacutes

WINDEV permet de deacutevelop-per simplement tout type drsquoapplications Windows et Linux dans les domaines de

la gestion de lrsquoindustrie du meacutedical etc

PreacutesentationLes applications deacuteveloppeacutees peuvent inclure lrsquoaccegraves agrave des bases de donneacuteesWINDEV propose un puissant moteur de base de donneacutees  HFSQL

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

Lrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur  xBase MySQL AS400 Oracle SQL Server Access ODBC OLE 

DB )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoaidebull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique accegraves natif optionnel  accegraves natif inclus

Les outilsDes outils facilitant le deacuteveloppement sont eacutegalement fournis (WDMAP WDSQL ) ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreursUne version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Les diffeacuterents eacutediteurs seront utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation des fenecirctres des eacutetats des traitements) sans oublier les sauvegardes

Les bases de donneacuteesLe moteur HFSQL sera utiliseacute pour les fichiers de donneacutees des applications La base de don-neacutees HFSQL est disponible en mode Classic ou ClientServeur et est librement diffusable avec les applications WINDEV

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

10 - TDF Tech 2015 - wwwpcsoftfr

Exemples drsquoutilisation du champ Graphe

Exemple drsquoutilisation du champ Planning

Lrsquoeacutediteur de code et son deacutebogueur

Aperccedilu avant impression

TDF Tech 2015 - wwwpcsoftfr - 11

WEBDEVPreacutesentation rapide de WEBDEV

et de ses fonctionnaliteacutes

WEBDEV est un AGL (Atelier de Geacutenie Logiciel) orienteacute deacuteve-loppement de sites Intranet et Internet

WEBDEV permet de deacutevelopper tout type de sites dynamiques incluant lrsquoaccegraves agrave des bases de donneacutees Il permet aussi de deacutevelopper des sites semi-dynamiques et statiques ou PHP

Preacutesentation de WEBDEVWEBDEV est composeacute de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur de pagesbull Un eacutediteur drsquoanalyses permettant lrsquoaccegraves agrave tout type de bases de donneacutees (HFSQL HFSQL ClientServeur MySQL  xBase AS400 Oracle SQL Server Access OLE DB )bull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle hellip) incluant un puissant deacutebogueurbull Un eacutediteur de styles incluant police couleur position etc

bull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projetbull Un eacutediteur drsquoinstallation accegraves natif optionnel  accegraves natif inclus

Lrsquoeacutediteur drsquoinstallation assure la mise en place des sites creacuteeacutes ainsi que leur maintenance Cet outil permet de reacutealiser une installation sur le serveur via FTP ou par meacutedia physique (CD Zip etc)Des outils facilitant le deacuteveloppement sont eacutegalement  fournis  (WDMAP WDOUTIL WDSQL etc) ainsi que de nombreux exemples et assistants reacuteutilisables

Les principaux eacutediteurs sont utiliseacutes depuis la deacutefinition drsquoune analyse jusqursquoagrave lrsquoinstallation en passant par toutes les phases du deacutevelop-pement (creacuteation de pages traitements eacutetats etc) sans oublier les sauvegardes

Les Concepts Internet

Les diffeacuterents services de lrsquoInternet

Le terme Internet regroupe plusieurs services drsquoutilisation diffeacuterente bull FTP (File Transfer Protocol) est un service permettant de transfeacuterer des fichiers drsquoun ordinateur vers un autre agrave travers Internetbull SMTP (Simple Mail Transfer Protocol) permet drsquoenvoyer des messages ou mails agrave un utilisa-teur deacutefini Chaque utilisateur doit disposer drsquoune adresse email qui lui sert de boicircte aux lettresbull HTTP (HyperText Transfer Protocol) est un protocole de niveau application qui est utiliseacute pour le transfert de pages sur Internet

Chacun de ces services neacutecessite un ges-tionnaire de services installeacute sur un serveur bull Le gestionnaire de services FTP gegravere lrsquoheacuteber-gement des fichiers les droits drsquoutilisation des fichiers et la reacuteponse aux demandes en provenance des autres postesbull Le gestionnaire de services SMTP prend en charge les demandes drsquoenvoi de messages et

12 - TDF Tech 2015 - wwwpcsoftfr

le routage vers les serveurs POP (reacuteception des messages) concerneacutesbull Le gestionnaire Web  HTTP permet lrsquoheacuteber-gement des pages et reacutepond aux demandes de consultation de la part des postes client

Le Web en deacutetailLes pages Web sont visualiseacutees sur un poste par  lrsquointermeacutediaire  drsquoun navigateur Web (Internet Explorer FireFox Chrome Safari Opera etc)

Le navigateur interpregravete le contenu des fichiers au format HTML deacutecrivant les pages On parle de pages HTMLWEBDEV geacutenegravere automati-quement le code HTML et JavascriptIl  est  possible  drsquoafficher directement une page dans un navigateur en tapant son URL dans la zone adresse du navigateur

LrsquoURL (Uniform Resource Locator) correspond au che-min drsquoaccegraves de la page sur le serveur qui lrsquoheacuteberge par exemple httpwwwmonserveurcompage3htm

Si lrsquoURL ne correspond pas agrave une adresse valide une erreur de connexion est retourneacutee dans lrsquoeacutecran du navigateur

Si lrsquoURL est valide la page demandeacutee srsquoaffiche dans le navigateur Lrsquoutilisateur peut alors deacuteclencher une action en cliquant sur un lien ou un bouton La requecircte correspondante est alors envoyeacutee au serveur qui lrsquoanalyse

Le lien permet de lancer le chargement drsquoune autre page ou bien de lancer une application Web

Site statique semi-dynamique ou dynamique bull Le  site  statique est  composeacute de pages conccedilues agrave lrsquoavance de maniegravere deacutefinitive Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateurbull Un site semi-dynamique est un site statique composeacute de pages conccedilues agrave lrsquoavance mais enrichies par une base de donneacutees Dans ce cas le contenu des pages nrsquoeacutevoluera pas dynamiquement en fonction drsquoun choix de lrsquoutilisateur Lrsquoun des meilleurs exemples est un catalogue de piegraveces deacutetacheacutees

bull Un site dynamique est constitueacute de pages enrichies de donneacutees provenant drsquoune base de donneacutees Il est neacutecessaire drsquoexeacutecuter des traitements drsquoaccegraves aux donneacutees sur le serveur permettant de constituer la page

WEBDEV permet de deacutevelopper des sites dynamiques composeacutes de pages de traite-ments serveur (accegraves aux bases de donneacutees calculs etc) et de traitements exeacutecuteacutes par le navigateur (controcircles traitements reacutepeacute-titifs etc)WEBDEV permet aussi de deacutevelopper des sites statiques et semi-dynamiques

Fonctionnement drsquoun site WEBDEVUn site WEBDEV dynamique heacutebergeacute sur un serveur peut ecirctre exeacutecuteacute en appelant une URL particuliegravere depuis un navigateur par exemple bull pour un site WEBDEV dynamique laquoIntranetraquo  ldquohttpwwwmonserveurcommonapplirdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo AWP  ldquohttpwwwmonserveurcommapageawprdquobull pour  un  site  WEBDEV  dynamique laquoInternetraquo PHP  ldquohttpwwwmonserveurcommapagephprdquo

Pour geacuterer la partie dynamique des sites WEBDEV utilise un serveur drsquoapplication Le serveur drsquoapplication WEBDEV est un service (ou daemon sous Linux) qui construit dyna-miquement les pages du site et les envoie au navigateur par lrsquointermeacutediaire du serveur Web

Principe de programmation WEBDEVLe deacutebit entre le serveur Internet et le poste client est plus lent qursquoavec un reacuteseau local classique Les eacutechanges de donneacutees entre le poste client et le serveur doivent donc ecirctre reacuteduits pour que le site puisse srsquoexeacutecuter sans ralentissement WEBDEV permet de diffeacuteren-cier les traitements exeacutecuteacutes sur le serveur et les traitements exeacutecuteacutes sur le poste client

1 Les traitements sur le serveurLes traitements exeacutecuteacutes sur le serveur sont les traitements principaux de lrsquoapplication Ils 

concernent la gestion de la base de donneacutees (HFSQL et HFSQL ClientServeur xBase AS400 Oracle SQL Server Access OLE DB ) et les trai-tements de calculCes traitements sont eacutecrits en WLangage

2 Les traitements sur le poste clientLes traitements exeacutecuteacutes sur le poste client sont les traite-ments de controcircle de saisie de veacuterification qui ne neacuteces-sitent pas drsquoacceacuteder au ser-veur Ces traitements utilisent uniquement les informations contenues dans la page Ces traitements peuvent ecirctre eacutecrits en Javascript ou WLangage Dans ce dernier cas WEBDEV 

se charge de convertir automatiquement le code WLangage en Javascript pour qursquoil puisse ecirctre exeacutecuteacute par le navigateur

3 Administrateur WEBDEVLrsquoadministrateur WEBDEV est un exeacutecutable installeacute sur le serveurLrsquoadministrateur permet de configurer le nombre de connexions autoriseacutees en mecircme temps pour le serveur par site par utilisateur Il permet aussi de fixer le temps maximum drsquoexeacutecution drsquoune requecircte et le temps limite pour la deacuteconnexion des utilisateurs inactifsLrsquoadministrateur peut agrave tout moment afficher la liste des utilisateurs connecteacutes au site

TDF Tech 2015 - wwwpcsoftfr - 13

WINDEV Mobile  permet  de deacutevelopper simplement tout type drsquoapplications desti-neacutees agrave ecirctre utiliseacutees sur un

Smartphone un teacuteleacutephone ou une tablette Android un teacuteleacutephone Windows Phone un iPhone ou un iPad et la plupart des terminaux mobiles (Pocket PC Symbol Psion )

PreacutesentationLes applications deacuteveloppeacutees peuvent acceacuteder agrave des bases de donneacuteesWINDEV Mobile inclut un puissant moteur de base de donneacutees  HFSQL Mobile

Il est conseilleacute drsquoutiliser HFSQL pour vos appli-cations afin drsquoobtenir les meilleures perfor-mances dans vos traitements de fichiers Une version HFSQL ClientServeur est aussi disponible

WINDEV Mobile permet eacutegalement drsquoacceacute-der aux bases de donneacutees SQLite pour  les applications Android

EnvironnementLrsquoenvironnement de deacuteveloppement inteacutegreacute de WINDEV Mobile se compose de diffeacuterents eacutediteurs bull Un eacutediteur de projet permettant de visualiser le tableau de bord du projetbull Un eacutediteur drsquoanalyses permettant  lrsquoaccegraves agrave tout type de bases de donneacutees  (HFSQL HFSQL ClientServeur )bull Un eacutediteur UML permettant une modeacuteli-sation objet de vos donneacutees et traitementsbull Un eacutediteur drsquoIHM avec correcteur drsquointerface en temps reacuteelbull Un eacutediteur de code eacutevolueacute  (avec assis-tants veacuterification du code saisi coloration syntaxique aide contextuelle) incluant un puissant deacutebogueurbull Un eacutediteur de requecirctes pour les seacutelections drsquoenregistrements dans les fichiersbull Un eacutediteur drsquoeacutetatsbull Un eacutediteur drsquoinstallationbull Un eacutediteur de dossier technique reprenant inteacutegralement toutes les informations tech-niques de votre projet

Des outils facilitant le deacuteveloppement sont eacutegalement fournis ainsi que de nombreux exemples et assistants reacuteutilisables

Des Centres de Controcircle permettent la gestion du cycle de vie de vos applications ainsi que leur administration

Une aide en ligne vous guide tout au long du deacuteveloppement de votre application Cette aide inclut eacutegalement une aide agrave la correction drsquoerreurs Une version Internet et actualiseacutee de lrsquoaide en ligne est disponible agrave lrsquoadresse ldquohttpdocpcsoftfrrdquo

Le moteur HFSQL Mobile sera utiliseacute pour les fichiers de donneacutees de lrsquoapplication

Lrsquoutilisation drsquoautres moteurs de bases de donneacutees est eacutegalement possible sur le mecircme principe

WINDEV MOBILEPreacutesentation rapide de WINDEV Mobile

et de ses fonctionnaliteacutes

14 - TDF Tech 2015 - wwwpcsoftfr

Vous reacutealisez des applications mobiles (teacuteleacutephone et tablette)pour Android iOS Windows Phone Windows CE

TDF Tech 2015 - wwwpcsoftfr - 15

16 - TDF Tech 2015 - wwwpcsoftfr

Support de cours

TDF Tech 2015 - wwwpcsoftfr - 17

TDF Tech 2015 - wwwpcsoftfr - 17

CENTRE DE SUIVI DE PROJETS EXIGENCES TABLEAU DE BORD

Le ldquoCentre de Suivi de Projetsrdquo regroupe toutes les informations sur les projets dans une interface de type ldquotableau de bordrdquoDes onglets permettent une navigation intuitive entre les diffeacuterentes fonctionnaliteacutes liste des tacircches liste des exigences suivi des incidents statistiques graphes

Organisation hieacuterarchiseacuteeUne liste drsquoexigences peut ecirctre deacutecoupeacutee en plusieurs dossiers (par exemple pour deacutecouper les exigences par version livreacutee agrave un client)

Eacutetat et avancementPour chaque exigence drsquoun coup drsquoœil vous visualisez lrsquoeacutetat geacuteneacuteral (deacutebuteacutee termineacutee) et lrsquoeacutetat par type de tacircches (deacuteve-loppement test documentation) Lrsquoavancement des tacircches et de la correction des incidents est eacutegalement visible

Exigences gestion des fonctionnaliteacutes agrave mettre en œuvre

PersonnalisationLrsquoaffichage peut ecirctre personnaliseacute agrave 100 vous parameacutetrez les colonnes agrave afficher selon vos besoins et votre meacutethodologiePour chaque liste drsquoexigences il est possible de deacutefinir des colonnes suppleacutementaires pour meacutemoriser une information speacutecifique (onglet ldquoRubriques suppleacutementairesrdquo dans la description de la liste drsquoexigences)

Liaisons aux tacircches et incidentsDans la description drsquoune tacircche ou drsquoun incident dans lrsquoonglet ldquoLiaisonrdquo pensez agrave bien indiquer toutes les exigences impacteacuteesDe cette faccedilon lrsquoeacutetat des exigences sera plus proche de la reacutealiteacuteCela ameacuteliorera eacutegalement la veacuteraciteacute des informations afficheacutees dans le tableau de bord (voir page suivante) notamment les informations du widget ldquoExigences agrave controcirclerrdquo

18 - TDF Tech 2015 - wwwpcsoftfr

PersonnalisationLrsquoorganisation du tableau de bord est entiegrave-rement parameacutetrable les widgets peuvent ecirctre deacuteplaceacutes masqueacutes ajouteacutesVous modulez votre tableau de bord selon votre faccedilon de travailler

Filtre global ou speacutecifique Par deacutefaut chaque widget du tableau de bord utilise le filtre global crsquoest-agrave-dire le filtre deacutefini dans le ruban liste drsquoexigences lot drsquoincidents etcSi vous le souhaitez il est possible de personnaliser le filtre pour un widget donneacute (par exemple forcer un lot drsquoincidents diffeacuterent du filtre global)De cette faccedilon vous pouvez afficher plusieurs fois le mecircme widget mais avec des contenus diffeacuterents

Tableau de bord vision syntheacutetique de lrsquoeacutetat drsquoun projet

Critegraveres de filtresLe volet ldquoTableau de bordrdquo du ruban permet de deacutefinir les critegraveres de filtres des widgets afficheacutes pour affiner la visionCela permet drsquoafficher une vision globale sur une liste drsquoexigences ou une vision plus preacutecise sur un sous-dossier de la liste

Des volets indeacutependantsLe Centre de Suivi de Projets permet drsquoouvrir autant de volets que vous le souhaitezDiffeacuterentes vues sont disponibles tableau de bord tacircches incidents exigences planning demandes statistiquesChaque volet est indeacutependant et deacutefinit ses propres filtres drsquoaffichage

Vous pouvez tout agrave fait par exemple ouvrir 2 volets ldquoIncidentsrdquo affichant respectivement les incidents du pro-jet A et les suggestions du projet B

Pour ajouter un volet cliquez sur le bouton ldquo+rdquo (agrave droite des volets deacutejagrave preacutesents) ou cliquez sur lrsquooption ldquoNouvelle vuerdquo du menu contextuel des volets

TDF Tech 2015 - wwwpcsoftfr - 19

Le  composant  CCFeedback  permet  agrave  vos  utilisateurs  drsquoenvoyer  des suggestions des tickets drsquoincidents ou des regravegles meacutetier Ces eacuteleacutements sont automatiquement reacutecupeacutereacutes dans le Centre de Suivi de Projets

COMPOSANT CCFEEDBACK

1 Inteacutegration du composantPour brancher la gestion des retours client il est neacutecessaire drsquoimporter le composant CCFeedback dans le projet

Depuis le volet ldquoAssistants Exemples et Composantsrdquo dans la liste des ldquoComposants utilitairesrdquo utilisez lrsquooption ldquoImporterrdquo du menu contextuel sur le logo du CCFeedback

ImportantSi vous avez inteacutegreacute le composant CCFeedback dans vos applications les erreurs WLangage sont automatiquement geacutereacutees par le composantLorsqursquoune erreur WLangage est deacutetecteacutee en exeacutecution lrsquoassistant drsquoenvoi drsquoincidents srsquoouvrira avec les informations preacuteremplies pour le deacutebo-gage le dump de deacutebogage la pile une copie drsquoeacutecran etc

2 Configuration du composantLe composant Feedback dispose de 2 modes de fonctionnement  un mode externe et un mode interne

Mode ldquoexternerdquoLe mode externe permet drsquoenvoyer les demandes par email Ce mode doit ecirctre configureacute directement dans lrsquoapplication via la proceacutedure

Configure fournie par le composant La documentation du composant fournit toutes les informations neacutecessaires sur les paramegravetres configurables Parameacutetrage de lrsquoenvoi de lrsquoemailpFeedbackConfigure(fbEmail ldquosupportmasocietefrrdquo)pFeedbackConfigure(fbServeurSMTP ldquomonserveursmtprdquo) Lance lrsquoassistant de nouvelle demandepFeedbackNouvelleDemande()

Mode ldquointernerdquoDans le mode interne les demandes sont envoyeacutees directement dans le Centre de Suivi de Projets Ce mode est utiliseacute pour les applications qui sont installeacutees sur votre reacuteseau local par exemple La configuration du mode interne est automatique  si un produit (WINDEV WEBDEV ou WINDEV Mobile) est installeacute sur le poste le composant CCFeedback le deacutetectera

3 Traitement des demandes depuis le Centre de Suivi de ProjetsDepuis le Centre de Suivi de Projets vous avez accegraves aux demandes clients depuis la vue (onglet dynamique) ldquoDemandesrdquoUn widget ldquoDemandesrdquo est eacutegalement disponible dans la vue ldquoTableau de bordrdquo

Agrave partir drsquoune demande client vous pouvez creacuteer (via le menu contextuel) bull une tacircche si la demande concerne une demande drsquoeacutevolutionbull un incident si la demande concerne un bug

Il est eacutegalement possible de lier la demande agrave une tacircche ou un incident existant (si 2 demandes concernent le mecircme bug il est bien entendu preacutefeacuterable qursquoelles soient lieacutees agrave un mecircme ticket)

Pour savoir comment inteacutegrer les demandes utilisateur reccedilues par email dans le Centre de Suivi de Projets nrsquoheacutesitez pas agrave consulter la page drsquoaide associeacutee  ldquohttpdocpcsoftfrfr-FR3540719rdquo

20 - TDF Tech 2015 - wwwpcsoftfr

Le menu ldquordquoPour ajouter le menu ldquordquo agrave une fenecirctre sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenu principalrdquo et seacutelectionnez ldquoAjouter le menu lsquorsquordquo (la fenecirctre doit disposer drsquoun menu principal)

Ce menu facilement parameacutetrable dispose de nombreuses options bull affichage des nouveauteacutes de  lrsquoapplication de  lrsquoaide de  lrsquoapplication des FAA ou des ldquoLe saviez-vousrdquobull lancement drsquooutils de deacutebogage ou de reacuteplicationbull creacuteation et modification drsquoeacutetats et de requecirctesbull 

Dans le cas de la gestion des retours client deux options sont inteacuteressantes pour lrsquoutilisateur bull ldquoEnvoyer une suggestion un dysfonctionnement une regravegle meacutetierrdquo qui  lance lrsquoassistant preacutesenteacute ci-dessusbull ldquoConsulter les demandes envoyeacuteesrdquo qui permet de consulter toutes les demandes envoyeacutees

Assistant de saisie drsquoune demandeLrsquoassistant de saisie drsquoune demande est tregraves simple drsquoutilisation1 Lrsquoutilisateur choisit le type de demande (selon le parameacutetrage du composant CCFeedback)2 Lrsquoutilisateur deacutecrit sa demande bull un reacutesumeacute de la demandebull le deacutetail completbull des informations speacutecifiques au type de demande (par exemple un protocole de reproduction dans le cadre drsquoun incident)

La demande peut ecirctre accompagneacutee drsquoune capture drsquoeacutecran pour aider le deacuteveloppeur agrave comprendre la demande

TDF Tech 2015 - wwwpcsoftfr - 21

Le Centre de Controcircle HFSQL fait partie des outils incontournablesEn version 20 cet outil a eacutevolueacute Le nouveau Centre de Controcircle HFSQL est plus intuitif plus agreacuteable agrave utiliser plus rapide et plus ergonomique Il vous propose les options que vous attendez au moment ougrave vous les attendez

LE CENTRE DE CONTROcircLE HFSQL

Un onglet par eacuteleacutement ouvertPour chaque eacuteleacutement ouvert (serveur base fichier) un onglet speacutecifique est ajouteacute

Cela permet de se repositionner rapidement sur un eacuteleacutement ouvert preacuteceacutedemment

Un ruban speacutecifique agrave lrsquoeacuteleacutementLe ruban est dynamique et srsquoadapte agrave lrsquoeacuteleacutement en cours de visualisation

Vous avez donc toujours les options inteacuteressantes pour lrsquoeacuteleacutement concerneacute

Des onglets deacutetachablesChaque onglet peut ecirctre deacutetacheacute du Centre de Controcircle HFSQL

Il est alors facile de visualiser deux eacuteleacutements simultaneacutement (pour analyser deux fichiers par exemple)

22 - TDF Tech 2015 - wwwpcsoftfr

Un compte rendu drsquoexeacutecutionApregraves lrsquoexeacutecution drsquoune requecircte un compte rendu est dis-ponible dans lrsquoonglet ldquoComptes rendusrdquo

Un compte rendu permet de savoir si la requecircte a correcte-ment eacuteteacute exeacutecuteacutee le nombre drsquoenregistrements impacteacutes etc

Les comptes rendus drsquoun volet ldquorequecircterdquo sont conserveacutes tant que le volet nrsquoest pas fermeacute

Il est possible de rejouer un code SQL preacuteceacutedemment exeacutecuteacute via le bouton ldquoRemplacerrdquo

Une explication de lrsquoexeacutecutionLrsquoanalyse EXPLAIN drsquoune requecircte permet de savoir en fonction des donneacutees reacuteelles comment le moteur HFSQL a exeacutecuteacute la requecircte  quels fichiers il a parcouru sur quelles cleacutes avec quels filtres

Lrsquoexemple ldquoWD Analyseur Explain HFSQLrdquo (livreacute en standard avec WINDEV) permet de repreacutesenter visuellement le deacutetail du plan drsquoexeacutecution drsquoune requecircte SQL

Des options utilesLe ruban drsquoune requecircte propose de nombreuses fonctionnaliteacutes tregraves utiles

Il est par exemple possible drsquoexeacutecuter une requecircte dans une transactionAvec une requecircte de modification (UPDATE) ou de suppression (DELETE) cela permet drsquoobserver le reacutesultat de la requecircte (en ouvrant le fichier impacteacute) puis de valider ou drsquoannuler la transaction pour prendre en compte ou non les modifications

Le bouton ldquoHistorique des requecirctesrdquo permet de lister toutes les requecirctes exeacutecuteacutees au moins une fois sur le serveur

Coloration et compleacutetionLa manipulation des requecirctes est faciliteacutee par bull la coloration du code SQL qui ameacuteliore la (re)lecture de la requecirctebull la compleacutetion qui accompagne la saisie en proposant le nom des fichiers et rubriques

Manipulation des requecirctes simple intuitif seacutecuriseacute

TDF Tech 2015 - wwwpcsoftfr - 23

LE CHAMP CARTE

Le champ Carte permet drsquoafficher une carte Google dans vos applications et vos sitesVous pouvez ajouter des marqueurs des itineacuteraires modifier la position etcVous pouvez mecircme aller plus loin en manipulant directement lrsquoobjet Google

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Cartes TDF20rdquo (preacutesent sur le DVD)WINDEV et WEBDEV propose chacun en standard un exemple unitaire sur le champ Carte

ImportantLes cartes Google sont soumises agrave une licence drsquoutilisation Il existe une licence ldquogratuiterdquo pour une certaine utilisation et une licence commerciale (si vous sortez du cadre ldquogratuitrdquo)Si vous posseacutedez une cleacute permettant drsquoutiliser la licence commerciale vous pouvez la speacutecifier avec la fonction WLangage CarteLicenceGgl Initialisation de la cleacute GoogleCarteLicenceGgl(ldquoABCDEF12345789abcdefrdquo)

ItineacuterairesLa fonction CarteAjouteItineacuteraire permet drsquoajouter un itineacuteraire entre plusieurs points dans un champ Carte

Cette fonction permet de parameacutetrer lrsquoaffichage de lrsquoitineacuteraire bull type drsquoitineacuteraire (automobile pieacuteton veacutelo)bull couleur opaciteacute et largeur du trait

Les eacutetapes de lrsquoitineacuteraire sont regroupeacutees dans un tableau de chaicircnes de variables Adresse de variables GeacuteoPosition ou de variables Marqueur Ajoute lrsquoitineacuterairegsIDItineacuteraire = CarteAjouteItineacuteraire(CARTE_Exemple tabEtapes itineacuteraireAutomobile RougeFonceacute 90 3)

MarqueursLa fonction CarteAjouteMarqueur permet drsquoajouter un marqueur dans le champ CarteCette fonction prend en paramegravetre une variable de type MarqueurCe type permet de parameacutetrer complegravetement le marqueur bull sa positionbull son nombull son image si celle-ci doit diffeacuterer des autresbull une proceacutedure qui sera appeleacutee automatiquement lorsque lrsquoutilisateur cliquera sur le marqueur Deacutefinit le marqueurMonMarqueur est un MarqueurMonMarqueurPositionLatitude = 4885668701639MonMarqueurPositionLongitude = 2352150486185MonMarqueurActionClic = ProceacutedureClicMarqueurMonMarqueurNom = ldquoMon marqueur sur Parisrdquo Ajoute le marqueurCarteAjouteMarqueur(CARTE_Exemple MonMarqueur)

Remarque la fonction CarteAjouteMarqueur propose 2 autres syntaxes pour passer une variable geacuteoPosition ou directement le couple ldquolatitudelongituderdquo

24 - TDF Tech 2015 - wwwpcsoftfr

Fonctionnaliteacutes suppleacutementaires (formes regroupement )Le WLangage propose diffeacuterentes fonctions qui permettent drsquoutiliser directement lrsquoobjet Carte de GoogleDe cette faccedilon vous pouvez utiliser les fonctionnaliteacutes offertes par le service de Google

Par exemple pour le regroupement des marqueurs lrsquoexemple ldquoWD Cartes TDF20rdquo utilise la fonctionnaliteacute ldquocluster de marqueursrdquo proposeacutee par lrsquoobjet Google Pour cela lrsquoobjet est reacutecupeacutereacute avec la fonction WLangage CarteReacutecupegravereObjet et le ldquocluster de marqueursrdquo a eacuteteacute creacuteeacute avec la fonction CarteExeacutecuteJS

Le composant interne ldquoCarte Eacutetenduerdquo eacutetend le champ Carte avec des fonctionnaliteacutes inteacuteressantes bull le dessin de lignes de cercles et de rectangles (CarteAjouteLigne CarteAjouteCercle CarteAjouteRectangle)bull le cluster de marqueurs (fonctions CarteClusterXXX)bull la manipulation drsquoitineacuteraires (CarteItineacuteraireXXX)bull lrsquoaffichage du trafic (CarteAfficheInfoTrafic)bull 

Attention  les fonctions de manipulation de lrsquoobjet Carte de Google sont disponibles uniquement agrave partir de la version 200051M

TDF Tech 2015 - wwwpcsoftfr - 25

LE WLANGAGE NOUVEAUTEacuteS UTILESLe WLangage crsquoest votre outil de travail au quotidienCrsquoest un langage moderne performant et qui srsquoenrichit drsquoanneacutee en anneacuteeVoici quelques nouveauteacutes remarquables de la version 20

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD WLangage TDF20rdquo (preacutesent sur le DVD)

1 Les proceacutedures internesUne proceacutedure interne est une pro-ceacutedure qui est deacuteclareacutee agrave lrsquointeacuterieur

mecircme drsquoune autre proceacutedure

Cette fonctionnaliteacute est particuliegraverement adap-teacutee aux fonctions WLangage qui ont besoin drsquoune proceacutedure ldquocallbackrdquo

La  fonction WLangage  fListeFichier par exemple propose une syntaxe qui appelle une proceacutedure pour chaque fichier listeacutetabExtensionsExclues est un tableau de chaicircnes = [ldquotmprdquo ldquodatrdquo]

Liste les fichiers du reacutepertoirefListeFichier(SAI_Reacutepertoire+[ldquordquo]+ ldquordquo callbackFichier 0 frNonReacutecursif)

La proceacutedure callback est une proceacutedure internePROCEDURE INTERNE callbackFichier(sChemin sFichier) Si lrsquoextension est utile SI Cherche(tabExtensionsExclues tcLineacuteaire fExtraitChemin(sfichier fExtension) lt= 0 ALORS RETOUR FIN

Traitement sur le fichier FIN

Les proceacutedures internes preacutesentent plusieurs avantages bull la proceacutedure  interne accegravede directement aux variables de la proceacutedure qui la contient inutile de les passer en paramegravetrebull une proceacutedure interne ne peut ecirctre appeleacutee que depuis la proceacutedure qui la contient Cela eacutevite les utilisations inapproprieacuteesbull un copiercoller de la proceacutedure hocircte copie automatiquement la proceacutedure interne

2 Les tacircches parallegravelesLes tacircches parallegraveles permettent drsquoexeacutecuter des traitements en paral-

legravele plutocirct qursquoen seacutequentiel Avec cette fonc-tionnaliteacute le systegraveme drsquoexploitation va reacutepartir lrsquoexeacutecution des traitements sur les diffeacuterents cœurs du processeur de la machine

Voici 2 cas drsquoutilisations concrets des tacircches parallegraveles

CAS 1Le premier cas drsquoutilisation le plus eacutevident crsquoest drsquoaller plus vite

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo la proceacutedure calculeStatAdresseEmail est utiliseacutee pour calculer des statistiques drsquoenvoi et de reacuteception sur chaque adresse email de la base

Cette proceacutedure prend en paramegravetre lrsquoadresse email et calcule toutes les statistiques sur cette adresse

Si le calcul de statistiques sur une adresse prend une seconde et si la base contient 200000 adresses emails le calcul prend logi-quement 200000 secondes (plus de 2 jours )

Pour aller (beaucoup) plus vite lrsquoideacutee est de lancer une tacircche parallegravele pour chaque adresse email

Le lancement drsquoune tacircche parallegravele srsquoeffectue avec la fonction WLangage TacirccheParallegravele-Exeacutecute

Cette fonction prend en paramegravetre bull la proceacutedure WLangage agrave exeacutecuter (ici cal-culeStatAdresseEmail)bull les paramegravetres de la proceacutedure (ici lrsquoadresse email et le type de calcul agrave effectuer)bull une option drsquoexeacutecution pour indiquer si la tacircche parallegravele utilise HFSQL ou non

ImportantLes paramegravetres de la proceacutedure agrave appeler doivent ecirctre passeacutes dans un seul bloc dans un tuple entre des parenthegraveses Lance le calcul de statistiques sur lrsquoadresse emailUneTacircche = TacirccheParallegraveleExeacutecute(

calculeStatAdresseEmail (ClientEmail 1) tpoCopieLeacutegegravereContexteHFSQL)

AttentionLes paramegravetres des tacircches parallegraveles sont tou-jours passeacutes par valeur jamais par reacutefeacuterence

Notre conseilLe troisiegraveme paramegravetre indique comment le contexte HFSQL doit ecirctre geacutereacute bull soit vous nrsquoutilisez pas la base de donneacutees dans la tacircche parallegravele choisissez tpoCopie-DiffeacutereacuteeContexteHFSQL Crsquoest le plus rapide la copie de contexte nrsquoest effectueacutee que si vous acceacutedez reacuteellement agrave HFSQL (utilisation dlsquoune fonction Hxxx par exemple)bull soit vous utilisez la base de donneacutees Vous avez le choix entre une copie complegravete du contexte et une copie leacutegegravere (plus rapide)La diffeacuterence entre les deux les filtres les transactions les positions en cours etc

Une fois les tacircches lanceacutees WINDEV les reacutepar-tit automatiquement entre tous les cœurs de la machine

Par exemple sur un Core i7 avec huit cœurs il est possible de traiter 8 tacircches en parallegravele Des 200000 tours de boucle initiaux on passe agrave 25000De plus de 2 jours de traitement on passe agrave 7 heures

CAS 2Les tacircches parallegraveles permettent de rendre vos applications plus reacuteactives

Dans la fenecirctre de test plan ldquoTacircches paral-legravelesrdquo le champ Table affiche une liste de contacts avec la photo de chaque contact

La photo est chargeacutee depuis une URL sur Internet donc

Cela signifie que pour chaque image (chaque contact) lrsquoapplication fait une requecircte sur Internet ce qui peut ralentir lrsquoapplication

Les tacircches parallegraveles sont bien adapteacutees agrave ce cas

Dans le traitement drsquoaffichage drsquoune ligne de table une tacircche parallegravele est lanceacutee Cette tacircche reccediloit en paramegravetre lrsquoidentifiant du contact

26 - TDF Tech 2015 - wwwpcsoftfr

La tacircche fait la requecircte HTTP reacutecupegravere lrsquoimage et rappelle une fonction pour afficher lrsquoimage dans la table

Comme la requecircte est exeacutecuteacutee dans la tacircche parallegravele elle ne bloque pas le remplissage de la table  lrsquoIHM de lrsquoapplication reste fluide

ImportantDepuis une tacircche parallegravele ou un thread il est interdit drsquoacceacuteder aux champs de la fenecirctre

Donc pour afficher lrsquoimage la proceacutedure AfficheImage doit ecirctre exeacutecuteacutee via la fonc-tion WLangage ExeacutecuteThreadPrincipal Cette fonction force lrsquoexeacutecution drsquoune pro-ceacutedure dans le thread principal

Plus simple encore il est possible drsquoindiquer agrave la proceacutedure AfficheImage qursquoelle srsquoexeacutecutera toujours dans le thread principal

Il suffit de cliquer sur le bouton  dans le bandeau de lrsquoeacutediteur de code et de cocher ldquoExeacutecuter dans le thread principalrdquo

3 Les paramegravetres nommeacutesEn version 20 le passage de para-megravetres agrave une proceacutedure WLangage 

est encore simplifieacute avec lrsquoapparition de deux nouvelles syntaxes de paramegravetres nommeacutes

Dans le cas de lrsquoappel drsquoune proceacutedure qui attend des paramegravetres optionnels il est pos-sible de ne pas indiquer la valeur de ces paramegravetres et de laisser le WLangage utiliser la valeur par deacutefaut choisie par le deacuteveloppeur de lrsquoapplication

Les paramegravetres nommeacutes sont tregraves utiles dans le cadre des proceacutedures posseacutedant de nombreux paramegravetres optionnels si le deacuteve-loppeur souhaite passer certains paramegravetres uniquement

Syntaxe 1Avant chaque appel de la proceacutedure il est possible de renseigner un ou plusieurs paramegravetres avec la syntaxe ldquoltNom de la proceacuteduregtltNom du paramegravetregt = ltvaleurgtrdquo

Syntaxe 1EnvoiMessagesDestinataire = ldquomarcmasocietefrrdquoEnvoiMessagesTitre = ldquoCoucourdquoEnvoiMessagesMessage = ldquoCeci est un messagerdquoEnvoiMessagebDemandeAccuseacuteReacute-ception = Vrai

EnvoiMessage()

Dans le cas de lrsquoutilisation de cette syntaxe une copie de la valeur est reacutealiseacutee la proceacute-dure recevra donc toujours le paramegravetre par valeur (et non par adresse)

Syntaxe 2Il suffit drsquoindiquer le nom du paramegravetre entre des chevrons puis deux points et sa valeur Cette syntaxe permet le passage par adresse Syntaxe 2EnvoiMessage( ldquomarcmasocietefrrdquo ldquoCoucourdquo ldquoCeci est un messagerdquo ltbDemandeAccuseacuteReacuteceptiongtVrai)

4 Les fonctions SSHxxxSSH est un protocole extrecircmement utiliseacute pour administrer agrave distance

un serveur Unix

Ce protocole permet drsquoobtenir une console sur le serveur agrave distance et agrave travers une connexion crypteacutee

En version 20 la famille de fonctions SSHxxx permet de geacuterer SSH directement dans les applications bull SSHConnecteShell permet drsquoouvrir une session SSHDeacuteconnecteShell permet de fermer la session Paramegravetre la session SSH via une variable sshSessiongSession est une sshSessiongSessionAdresse = ldquoMonServeurrdquogSessionUtilisateur = ldquorootrdquogSessionMotDePasseUtilisateur = ldquomdprdquo Ouvre la sessionSSHConnecteShell(gSession)

bull SSHEcrit permet drsquoeacutecrire des donneacutees dans la session SSH ouverte Liste les fichiers du reacutepertoire en coursSSHEcrit(gSession ldquolsrdquo)

bull SSHCommande permet drsquoenvoyer une commande La session est automatique-ment ouverte et fermeacutee apregraves lrsquoenvoi de la commande Lance un arrecirct drsquourgenceSSHCommande(gSession ldquoshutdown -h nowrdquo)

Dans notre exemple en 20 lignes de code WLangage nous vous proposons une console Unix simplifieacutee bien utile

5 La fonction SysDeacutetecte-SessionVerrouilleacuteeLe WLangage dispose drsquoune famille 

de fonctions SysXXX qui permet de reacutecupeacuterer et de modifier des informations du systegraveme arrecirct du systegraveme gestion des eacutecrans et des reacutesolutions etc

En version 20 la fonction SysDeacutetecte-SessionVerrouilleacutee permet drsquoecirctre preacutevenu quand la session de lrsquoutilisateur est verrouilleacutee ou deacuteverrouilleacutee

Cette fonction peut ecirctre utiliseacutee par exemple pour bull libeacuterer une fiche client dans une CRM (pour ne pas bloquer lrsquoaccegraves agrave la fiche pour les autres utilisateurs)bull passer  lrsquoutilisateur en ldquoindisponiblerdquo dans une application de type ldquochatrdquobull etc

La fonction SysDeacutetecteSessionVerrouilleacutee attend en paramegravetre une proceacutedure callback qui sera appeleacutee lorsque la session se ver-rouillera ou se deacuteverrouillera Branche la deacutetection de verrouil- lage de sessionSysDeacutetecteSessionVerrouilleacutee( sessionChangeEtat)

La proceacutedure sessionChangeEtat sera auto-matiquement exeacutecuteacutee

Cette proceacutedure recevra en paramegravetre le

TDF Tech 2015 - wwwpcsoftfr - 27

LE WLANGAGE NOUVEAUTEacuteS UTILES(SUITE)

nouvel eacutetat de verrouillage de session sys-SessionVerrouilleacutee ou sysSessionDeacutever-rouilleacuteePROCEDURE sessionChangeEtat( nouvelEtat) Si la session est verrouilleacuteeSI nouvelEtat = sysSessionVerrouilleacutee ALORS FIN

6 La fonction PDFExtraitPageLa fonction PDFExtraitPage permet drsquoextraire une page drsquoun fichier PDF

dans une variable de type Image Extrait la 3egraveme page du PDFimgPage est une Image = PDFExtraitPage( fRepExe()+[ldquordquo]+ldquoMonFichierpdfrdquo 3) Enregistre lrsquoimage de la page 3dSauveImageJPEG(imgPage fRepExe()+[ldquordquo]+ldquoPage3jpgrdquo)

7 Les fonctions HTTPEnvoie RESTEnvoieLes fonctions HTTPEnvoie et

RESTEnvoie permettent respectivement drsquoenvoyer une requecircte HTTP ou REST agrave un serveur et drsquoattendre la reacuteponse

Ces deux fonctions manipulent des types de variables speacutecifiques

Par exemple la fonction RESTEnvoie utilise bull restRequecircte qui permet de deacutefinir preacutecise-ment la requecircte agrave envoyer au serveurbull restReacuteponse qui permet de reacutecupeacuterer toutes les caracteacuteristiques avanceacutees de la reacuteponse du serveurMaRequecircte est une restRequecircte Adresse agrave interrogerMaRequecircteURL = ldquohttpserveurserviceawprdquo Meacutethode HTTP utiliseacutee GETMaRequecircteMeacutethode = httpGet Interroge le serveur et reacutecupegravere la reacuteponseMaReponse est un restReacuteponse = RESTEnvoie(MaRequecircte) Si la reacuteponse est correcteSI MaReponseCodeEtat = 200 ALORS

Reacutecupegravere le contenu TraiteRetour(MaReponseContenu)FIN

8 La nouvelle compleacutetionLa compleacutetion de code a eacuteteacute ameacute-lioreacutee en version 20 et propose en

premier lieu les familles de fonctions corres-pondant agrave la saisie

Cela permet de naviguer et de saisir plus rapidement

Par exemple pour saisir ZoneReacutepeacuteteacuteeSup-primeTout il vous suffit de commencer agrave taper ldquozonerdquo le premier choix proposeacute est ldquoZoneReacutepeacuteteacuteerdquo

Vous validez directement par Entreacutee et vous obtenez ZoneReacutepeacuteteacutee En tapant ldquosurdquo vous limitez le choix agrave deux fonctions

Vous pouvez alors seacutelectionner la fonction voulue en utilisant la flegraveche ldquobasrdquo et en validant par Entreacutee (ou en cliquant dessus agrave la souris)

8 La coloration des chaicircnes multilignes (SQL HTML )

Petite nouveauteacute utile de lrsquoeacutediteur de code les chaicircnes multilignes qui contiennent du code SQL sont maintenant coloreacuteessMaRequecircteSQL est une chaicircne = [SELECT Nom PreacutenomFROM ClientWHERE Ville = lsquoParisrsquo]

Crsquoest beaucoup plus agreacuteable agrave lire Cette coloration est eacutegalement disponible pour du code HTML (tregraves pratique surtout dans WEBDEV) sMonCodeHTML est une chaicircne = [lthtmlgt ltbodygt lth1gtMon titrelth1gt ltdivgt Contenu au format HTML ltdivgt ltbodygtlthtmlgt]

et aussi du code WLangage sCodeWLangage est une chaicircne = [ SI fFichierExiste(ldquoCMes documentsMonFichierpdfrdquo) = Faux ALORS Erreur(ldquoLe fichier nrsquoexiste pasrdquo) RETOURFIN]

Pour colorer une chaicircne ouvrez le menu contextuel (clic droit sur le contenu) deacuteroulez le menu ldquoColoration de la chaicircnerdquo et choisissez la coloration souhaiteacutee

9 Les attributs de variableUn attribut de variable est un meacuteca-nisme du WLangage qui permet de 

donner des informations au compilateur au sujet drsquoune variable

Il en existe plusieurs et ils ne sont pas toujours tregraves connus

En voici quelques-uns

Lrsquoattribut ltUtilegtLorsqursquoune variable nrsquoest pas utiliseacutee dans la proceacutedure dans laquelle elle est deacuteclareacutee le compilateur affiche un avertissement ldquoLa variable locale ltxxxgt nrsquoest pas utiliseacuteerdquo

Or il se peut que lrsquoabsence drsquoutilisation soit normale Quelques exemples 1 Une proceacutedure virtuelle attend des para-megravetres mais la proceacutedure nrsquoest reacuteellement impleacutementeacutee que dans les classes qui heacuteritent de la classe source2 Une proceacutedure callback attend un certain nombre de paramegravetres mais ces paramegravetres ne sont pas tous utiliseacutes Crsquoest le cas par

28 - TDF Tech 2015 - wwwpcsoftfr

exemple de la proceacutedure callback de fListe-Fichier qui renvoie bull le chemin du fichier listeacutebull le nom du fichierbull un indicateur de changement de reacutepertoirebull une variable pointeur vers une donneacutee Le 3egraveme paramegravetre nrsquoest pas utiliseacute mais il est ldquoutilerdquoPROCEDURE ParcoursFichier( sChemin sFichier nChangementReacutepertoire ltutilegt nPointeur)

3 Ajout drsquoun paramegravetre dont lrsquoutilisation sera codeacutee plus tard

Dans ces cas-lagrave lrsquoattribut utile permet drsquoindi-quer au compilateur que la variable est bien utile et ne doit pas apparaicirctre comme nrsquoeacutetant pas utiliseacutee

AstuceIl peut ecirctre inteacuteressant de preacuteciser une rai-son agrave lrsquoattribut utile cela permet aux autres deacuteveloppeurs de comprendre pourquoi cette variable est deacuteclareacutee mais non utiliseacuteerRemise est un reacuteel ltutile = ldquoJrsquoattends le commercial pour coderle calcul de la remiserdquogt

Lrsquoattribut ltMappinggtLa fonction FichierVersMeacutemoire permet de remplir automatiquement une structure (ou une classe) agrave partir de lrsquoenregistrement courant drsquoun fichier de donneacutees

Pour faire le lien entre une rubrique et un membre de la structure le WLangage se base sur le nom des eacuteleacutements le membre ldquoNomrdquo sera automatiquement rempli avec la valeur de la rubrique ldquoNomrdquo par exemple

Dans certains cas le nom du membre peut ne pas ecirctre identique au nom de la rubrique bull si vous preacutefixez vos membres de structures (sNom dDateDeNaissance ) mais pas les noms des rubriquesbull si vous utilisez une analyse dont les noms de rubriques sont trop longs ou pas explicites et que vous souhaitez nommer vos membres de faccedilon plus intelligibles

Dans ces cas-lagrave lrsquoattribut mapping permet drsquoindiquer au compilateur la rubrique qui doit ecirctre utiliseacutee pour remplir le membreSTPersonne est une Structure sNom est une chaicircne ltmapping = ldquoNomrdquogt

dDateDeNaissance est une Date ltmapping = ldquoNaissancerdquogtFIN

Lrsquoattribut ltSeacuterialisegtLa fonction Seacuterialise permet de transformer une variable (une structure une classe etc) dans un format donneacute (XML ou JSON par exemple)

Par  deacutefaut WINDEV  utilise  le  nom  des variables pour construire le contenu dans le nouveau format

Par exemple le code suivant Individu est une PersonneIndividusNomDeFamille = ldquoASSINrdquoIndividusPrenom = ldquoMarcrdquo Seacuterialise au format JSONSeacuterialise(Individu bufJSON psdJSON)

donnera la chaicircne JSON suivante ldquosNomDeFamillerdquoldquoASSINrdquoldquosPrenomrdquoldquoMarcrdquo

Lrsquoattribut seacuterialise permet drsquoindiquer si une variable doit ecirctre seacuterialiseacutee et sous quel nom

La seacuterialisation ayant principalement pour but de transmettre ou de sauvegarder la variable il est important de reacuteduire au minimum la taille des donneacutees bull en reacuteduisant le nom des membres au strict minimumbull en ne seacuterialisant pas des membres qui nrsquoont pas drsquointeacuterecirct agrave ecirctre transmis sauveacutes

En modifiant la structure Personne comme suit Personne est une Structure sNomDeFamille est une chaicircne ltSeacuterialise = ldquoNomrdquogt sPrenom est une chaicircne ltSeacuterialise = FauxgtFIN

la chaicircne JSON obtenue est la suivante ldquoNomrdquoldquoASSINrdquo

Lrsquoattribut ltAssocieacutegtLrsquoattribut associeacute permet de rendre les membres et les meacutethodes publics drsquoune classe publics dans une classe qui lrsquoutilise

Cela permet de mettre en œuvre un design pattern particulier la Faccedilade

Cet attribut est utiliseacute dans le cadre de la mise en place de lrsquoarchitecture MVP et est donc deacutetailleacute dans lrsquoarticle pages 50-51

10 La fonction CrypteStandardEn WLangage la fonction Crypte permet de crypter une chaicircne ou

un buffer crsquoest la fonction CrypteEt la fonction inverse bien entendu crsquoest Deacutecrypte

Ces  fonctions sont disponibles dans  les 3 produits sur diffeacuterentes plateformes

La limite qui peut apparaicirctre crsquoest lrsquoalgorithme de cryptage qui est utiliseacute

Mais selon la plateforme drsquoexeacutecution les algorithmes de cryptage utiliseacutes varient

Par exemple en utilisant la constante crypte-Seacutecuriseacute lrsquoalgorithme utiliseacute est bull un RC5 8 boucles sur 128 bits sous Windows ou Pocket PCbull un autre algorithme de type Password Based sous Android et en geacuteneacuteration Javabull lrsquoalgorithme ldquoRinjdaelrdquo en geacuteneacuteration PHP

Ce qui est crypteacute avec une plateforme nrsquoest pas toujours deacutecryptable sur une autre tout deacutepend des combinaisons

Pour palier cette limite et proposer un cryp-tage ldquocross-plateformerdquo en version 20 une nouvelle fonction WLangage est disponible  CrypteStandard

Cette fonction qui utilise lrsquoalgorithme AES (standard international) est bien entendu disponible sur toutes les plateformes Message agrave crypterbufMessage est un Buffer = ldquoMon message agrave crypterrdquo Cleacute de cryptagebufCleacute est un Buffer = HashChaicircne(HA_MD5_128 ldquo21JJ42xXx51SMrdquo) CryptagebufCrypteacute est un Buffer = CrypteStandard(bufMessage bufCleacute)

La fonction WLangage DeacutecrypteStandard permet de deacutecrypter un message crypteacute par CrypteStandard

Le Saviez-Vous Toutes plates-formes confondues (Windows Linux Android OS Java etc) le WLangage comporte plus de bull 3300 fonctionsbull 700 proprieacuteteacutesbull 250 types de variable et mots

Pensez toujours agrave rechercher dans lrsquoaide en ligne la fonction que vous cherchez existe deacutejagrave certainement

Lrsquoaide en ligne crsquoest par lagrave ldquohttpdocpcsoftfrrdquo

TDF Tech 2015 - wwwpcsoftfr - 29

ASTUCES DE DEacuteBOGAGE

Parmi toutes les fonctionnaliteacutes de WINDEV WEBDEV et WINDEV Mobile celle qui est la plus utiliseacutee est sans doute le deacutebogueurCet article vous preacutesente plusieurs nouveauteacutes et fonctionnaliteacutes souvent meacuteconnues sur le deacutebogueur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutebogage TDF20rdquo (preacutesent sur le DVD)

1 Deacutebogage sans timerLe raccourci ldquoCtrl + Pauserdquo permet de deacuteclen-cher le deacutebogueur sur la prochaine instruction WLangage exeacutecuteacutee

Crsquoest tregraves utile pour passer en deacutebogage lors du prochain clic sur un bouton ou une option de menu par exemple

Si une proceacutedure timer est exeacutecuteacutee dans la fenecirctre (ou lrsquoapplication) il y a de grandes chances que cette proceacutedure timer provoque le lancement du deacutebogueur

Pour passer outre ce fonctionnement et ne pas tenir compte des timers lors du deacutebogage sous le volet ldquoDeacutebogueurrdquo dans le groupe ldquoPoints drsquoarrecirctrdquo activez lrsquooption ldquoIgnorer les timersrdquo (le bouton doit ecirctre enfonceacute)

2 Points drsquoarrecirctUn point drsquoarrecirct deacutefinit un point ougrave le deacutebo-gueur devra srsquoarrecircter  Il est mateacuterialiseacute par un point rouge

Dans WINDEV WEBDEV et WINDEV Mobile pour ajouter un point drsquoarrecirct il suffit de cli-quer dans la marge jaune (agrave gauche)

Les points drsquoarrecirct peuvent eacutegalement ecirctre ajouteacutes directement depuis la fenecirctre de recherche

Dans le volet de reacutesultat de recherche il suffit de faire clic droit sur une ligne de reacutesultat et de cliquer sur lrsquooption ldquoAjouter un point drsquoarrecirctrdquo

Lister les points drsquoarrecirctLes points drsquoarrecirct que vous positionnez dans lrsquoeacutediteur de code sont meacutemoriseacutes dans le projet

La liste des points drsquoarrecirct vous permet de positionner lrsquoeacutediteur de code sur un point drsquoarrecirct speacutecifique ou de supprimer les points drsquoarrecirct devenus inutiles

Pour afficher la liste des points drsquoarrecirct sous le volet ldquoCoderdquo dans le groupe ldquoPoints drsquoarrecirctrdquo deacuteroulez ldquoPoint drsquoarrecirctrdquo et seacutelectionnez lrsquooption ldquoLister les points drsquoarrecirctrdquo (cette option est eacutega-lement disponible dans le volet ldquoDeacutebogueurrdquo lorsque celui-ci est visible)

Point drsquoarrecirct conditionnelUne nouveauteacute inteacuteressante sur les points drsquoarrecirct les points drsquoarrecircts ldquoagrave compteurrdquo

Pour activer une condition il suffit de faire un clic droit sur le point drsquoarrecirct et de seacutelectionner lrsquooption ldquoPoint drsquoarrecirct conditionnel rdquo

Il est alors possible de deacutefinir les conditions pour lesquelles le point drsquoarrecirct doit ecirctre ou

non respecteacute

Le point drsquoarrecirct conditionnel se diffeacuterencie drsquoun point drsquoarrecirct classique par le point drsquoin-terrogation (ldquordquo) au centre du point rouge

Cette fonctionnaliteacute est tregraves utile dans un traitement de type boucle pour que le point drsquoarrecirct srsquoactive agrave partir drsquoune certaine iteacuteration

3 Se positionner sur une proceacutedureQui nrsquoa jamais chercheacute une proceacutedure dans une collection de proceacutedures ou dans une classe vous connaissez son nom approxi-mativement mais impossible de la trouver

Depuis lrsquoeacutediteur de code le raccourci ldquoAlt+Crdquo ouvre la combo des eacuteleacutements fils dans le rubanCette combo est en saisie et permet de recher-cher une proceacutedure par son nom (ou une partie de son nom)

Il ne reste plus qursquoagrave seacutelectionner  lrsquoeacuteleacutement et agrave valider par Entreacutee lrsquoeacutediteur de code se positionne automatiquement sur lrsquoeacuteleacutement

30 - TDF Tech 2015 - wwwpcsoftfr

4 Fenecirctre de visualisationLa fenecirctre de visualisation (ou fenecirctre de ldquowatchrdquo) permet de visualiser le contenu drsquoune variable

Cette fenecirctre offre de nombreuses fonction-naliteacutes souvent meacuteconnues

Pour afficher cette fenecirctre de visualisation depuis le volet du deacutebogueur il suffit de double-cliquer sur une ligne drsquoexpression pour afficher la variable correspondante

Cette fenecirctre est non modale cela signifie que vous pouvez en ouvrir plusieurs simulta-neacutement tout en continuant agrave travailler

Cette fenecirctre est arborescente vous pouvez descendre dans lrsquoarborescence des variables afficheacutees Il suffit de cliquer sur le plus (ldquo+rdquo) pour afficher les sous-eacuteleacutements

Il est eacutegalement possible drsquoafficher un eacuteleacutement donneacute dans une nouvelle fenecirctre de visuali-sation faites un clic droit option ldquoEditerrdquo sur lrsquoeacuteleacutement souhaiteacute

Autre fonctionnaliteacute meacuteconnue dans cette fenecirctre de deacutetail vous pouvez seacutelectionner le format de visualisation que vous souhaitez

Il est possible de visualiser un eacuteleacutement au format texte hexadeacutecimal HTML ou image

Crsquoest tregraves pratique pour visualiser le code source drsquoun contenu HTML ou le code hexa-deacutecimal drsquoune image par exemple

Visualisation drsquoune variable structure (STUnEchange) qui contient drsquoautres structures

Lrsquoutilisation de lrsquooption ldquoEacutediterrdquo sur un membre structure (stEmetteur) permet drsquoaffi-cher cette variable dans une fenecirctre de visualisation qui lui est propre

mais vous pouvez modifier le format drsquoaffichage(ici lrsquoimage en Hexadeacutecimal)

De la mecircme maniegravere lrsquooption ldquoEacutediterrdquo permet drsquoafficher une fenecirctre de visualisation sur un type ldquosimplerdquo (chaicircne image )

Ici le membre Photo est affi-cheacute dans une fenecirctre speacuteci-fiqueWINDEV  deacutetecte  automa-tiquement qursquoil srsquoagit drsquoune image et positionne le type drsquoaffichage adapteacute

1

2

3

4

TDF Tech 2015 - wwwpcsoftfr - 31

NOUVEAUTEacuteS SUR LES EacuteTATS

Les eacuteditions sont incontournables dans une application de gestion rapport statistiques listing etcLa version 20 apporte son lot de nouveauteacutes sur les eacuteditionsPetit tour drsquohorizon de nouvelles fonctionnaliteacutes et de fonctionnaliteacutes existantes

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD Etats TDF20rdquo  (preacutesent  sur le DVD)

Imprimer un graphe Secteur multiniveauLe graphe Secteur Multiniveau permet drsquoaffi-cher des donneacutees comportant une hieacuterarchie (voir le deacutetail pages 40-41)

Dans les eacutetats il est bien entendu possible drsquoimprimer tous les types de graphes secteur multiniveau compris

Le remplissage drsquoun graphe dans un eacutetat est strictement identique au remplissage dans une fenecirctre la source peut ecirctre un fichier de donneacutees une variable ou du code

Nouvel aperccedilu avant impressionEn version 20 lrsquoaperccedilu avant impression a eacuteteacute relookeacute  un ruban a fait son apparition

Le ruban permet drsquoorganiser les nombreuses options offertes par lrsquoaperccedilu bull le volet ldquoAperccedilurdquo permet de modifier  les options drsquoaffichage de lrsquoaperccedilubull le volet ldquoImpressionrdquo permet drsquoimprimer et de modifier les options drsquoimpressionsbull le volet ldquoExportrdquo regroupe tous les exports (Word PDF etc)bull le volet  ldquoRechercherdquo contient  toutes  les options pour rechercher dans le contenu de lrsquoeacutetatbull le volet ldquoAnnoterrdquo permet drsquoannoter lrsquoeacutetat (ajout de flegraveches cadres )

RappelDans vos applications vous avez la possibiliteacute drsquointeacutegrer la fenecirctre drsquoaperccedilu avant impres-sion dans la description du projet onglet

ldquoStylerdquo il suffit de positionner lrsquooption ldquoAperccedilu avant impressionrdquo agrave ldquoPersonnaliseacute (inteacutegreacute dans le projet)rdquo

La mireLa mire est une fonctionnaliteacute tregraves pratique de lrsquoaperccedilu pour lire confortablement des tableaux de chiffres

La mire peut ecirctre personnaliseacutee (couleurs et eacutepaisseur)

Planning agenda Gantt personnalisationGracircce aux eacutetats  il est possible drsquoimprimer le contenu de champs Agenda Planning ou Gantt

En version 20 vous pouvez personnaliser lrsquoaffichage des rendez-vous et des tacircches pour ces types drsquoeacutetats

Il est ainsi possible drsquoimprimer un eacutetat ayant le mecircme rendu que le champ

Pour personnaliser lrsquoaffichage des rendez-vous ou des tacircches dans la description du champ dans lrsquoeacutediteur drsquoeacutetats onglet ldquoGeacuteneacuteralrdquo deacuteroulez le paramegravetre ldquoEtat personnaliseacute pour lrsquoaffichage des rendez-vousrdquo et seacutelectionnez ldquoEtat preacutedeacutefinirdquo

Lrsquoeacutetat preacutedeacutefini est automatiquement ajouteacute au projet

Vous pouvez alors le personnaliser bull modifier les styles des champsbull ajouter un champbull modifier le code

Remarque par deacutefaut tout le code de gestion de lrsquoeacutetat preacutedeacutefini est localiseacute dans le code de deacuteclaration

Important Pensez agrave deacutefinir les ancrages dans les dif-feacuterents champs de lrsquoeacutetat cela permettra agrave vos champs de srsquoadapter en fonction de la hauteur et de la largeur de chaque rendez-vous ou tacircche

RAZ du numeacutero de pagePour certaines impressions il peut ecirctre utile de reacuteinitialiser le numeacutero de page en cours drsquoimpression par exemple si vous impri-mez toutes les factures drsquoune journeacutee il faut que le numeacutero de page soit reacuteinitialiseacute pour chaque facture

Cette fonctionnaliteacute est disponible

32 - TDF Tech 2015 - wwwpcsoftfr

bull en eacutedition dans la description du bloc onglet ldquoIHMrdquo il suffit de cocher lrsquooption ldquoReacuteinitialiser le nombre de pages apregraves impression du blocrdquobull par  programmation  via  la  fonction WLangage iRAZNbPages

Changer lrsquoimage de fond par programmationUn eacutetat formulaire peut srsquoimprimer soit sur du papier preacute-imprimeacute soit sur du papier blanc

Il peut ecirctre  inteacuteressant pour  lrsquoutilisateur de pouvoir afficher ou non lrsquoimage de fond de formulaire selon le type de papier chargeacute dans lrsquoimprimante

En version 20 bull la proprieacuteteacute ImageFondImprimeacutee permet de modifier la visibiliteacute de lrsquoimage de fond drsquoun eacutetat Papier preacute-imprimeacute ne pas afficher lrsquoimage de fondMonEtatImageFondImprimeacutee=Faux

bull la proprieacuteteacute ImageFond permet de modi-fier lrsquoimage de fond drsquoun eacutetat Affiche la 2egraveme page du PDF en tant que fond de lrsquoeacutetatMonEtatImageFond = PDFExtraitPage(ldquocerfapdfrdquo 2)

Modegraveles drsquoeacutetatsLes modegraveles drsquoeacutetats permettent comme les modegraveles de fenecirctres de partager des champs des traitements entre plusieurs eacutetats

Un modegravele drsquoeacutetats peut par exemple permettre de faire un papier agrave entecircte (avec le logo de lrsquoentreprise son nom) et un pied de page (les infos leacutegales lrsquoadresse etc)

Ce modegravele utiliseacute dans tous les eacutetats drsquoun pro-jet permet drsquouniformiser toutes les eacuteditions

Les modegraveles drsquoeacutetats permettent de faire des morceaux drsquoeacutetats geacuteneacuteriques et donc de gagner encore du temps lors de la creacuteation de nouveaux eacutetats

Lrsquoaperccedilu avant impression dispose drsquoun ruban qui offre de nombreuses fonctionnaliteacutes export (diffeacuterents formats) mire de visualisation annotation (rectangles flegraveches texte ) etc

TDF Tech 2015 - wwwpcsoftfr - 33

PCSCLOUD VOTRE SOLUTION CLOUD

PCSCloud propose des plateformes drsquoexploitation pour deacuteployer vos installations sites WEBDEV Webservices et bases de donneacutees HFSQLPCSCloud propose eacutegalement des plateformes de deacuteveloppement pour stocker et partager vos projets (Gestionnaire de Sources)  les donneacutees de vos Centres de Controcircle et la configuration de votre environnement de deacuteveloppement

1 Plateforme drsquoexploitation vos applications et vos sites accessibles

bull Sur une plateforme drsquoexploitation vous pouvez heacuteberger 

vos sites WEBDEV vos Webservices vos bases HFSQL vos installationsdrsquoapplicationsWINDEV

vos reacuteplications universelles de

donneacutees

bull Depuis le tableau de bord du Cloud vous deacutefinissez les rocircles de votre plateforme 

bull Depuis le produit si un deacuteploiement est disponible pour le Cloud le choix est proposeacute 

34 - TDF Tech 2015 - wwwpcsoftfr

2 Plateforme de deacuteveloppement vos projets virtualiseacutes

bull Avec une plateforme de deacuteveloppement vous pouvez stocker et partager 

vos projets WINDEV WEBDEV et WINDEV Mobile

vos donneacutees des Centres de

Controcircle

votre environnement

de travail

bull Depuis le tableau de bord du Cloud vous deacutefinissez vos utilisateurs et leurs droits 

bull Depuis le produit la localisation du GDS (ou des fichiers des Centres de Controcircle) peut ecirctre renseigneacutee avec vos paramegravetres de connexion Cloud

Le Cloud crsquoest une plateforme preacuteconfigureacutee mise agrave votre disposition vous nrsquoavez pas agrave vous preacuteoccuper du mateacuteriel de la maintenance des licences de la seacutecuriteacute du serveurEt vous acceacutedez agrave vos donneacutees de nrsquoimporte ougrave dans le monde

Toutes les informations sur le Cloud sont disponibles agrave cette adresse ldquowwwpcscloudnetrdquo

TDF Tech 2015 - wwwpcsoftfr - 35

3 Comment deacutefinir une vueDepuis lrsquoeacutediteur drsquoanalyses dans le ruban sous le volet ldquoAnalyserdquo dans le groupe ldquoCreacuteationrdquo deacuteroulez ldquoNouveaurdquo et seacutelectionnez ldquoVuerdquo

Il est eacutegalement possible de deacutefinir une vue depuis le volet ldquoAnalyserdquo de lrsquoeacutediteur via un clic droit sur les cateacutegories ldquoVuesrdquo et ldquoVues mateacute-rialiseacuteesrdquo en choisissant lrsquooption ldquoNouvelle vuerdquo

Le contenu de la vue peut ecirctre deacutefini bull via lrsquoassistant (eacutediteur de requecirctes)bull en saisissant directement le code SQL de la requecircte

2 Les types de vuesEn version 20 deux types de vues sont disponibles les vues ldquoSQLrdquo et les vues ldquomateacuterialiseacuteesrdquo

Les vues SQL sont exeacutecuteacutees agrave chaque utilisation de la vueAvantage des vues SQL  elles sont toujours agrave jour

Les vues mateacuterialiseacutees elles sont persistantes sur le serveurElles peuvent ecirctre repreacutesenteacutees comme des requecirctes dont le reacutesultat est sauvegardeacuteAvantage des vues mateacuterialiseacutees les donneacutees sont accessibles immeacutediatement

1 Une vue crsquoest quoi Une vue permet de mettre agrave la disposition des utilisateurs et des applications qui accegravedent agrave une base de donneacuteesune structure des donneacutees ldquoameacutenageacuteerdquo agrave un besoin

Une vue correspond agrave un fichier de donneacutees qui est construit agrave partir drsquoune requecircte

Une vue permet par exemple de concateacutener deux rubriques ldquoNomrdquo et ldquoPreacutenomrdquo ou de masquer aux utilisateurs des rubriques qui contiennent des donneacutees confidentielles

En version 20 HFSQL offre la possibiliteacute de creacuteer des ldquovues SQLrdquoQursquoest-ce qursquoune vue Comment la manipuler Voici les reacuteponses en images

HFSQL LES VUES

36 - TDF Tech 2015 - wwwpcsoftfr

7 Geacuterer des droits sur les vuesLes droits des vues permettent de donner agrave certains utili-sateurs lrsquoaccegraves agrave des donneacutees auxquelles ils nrsquoauraient pas droit initialement

La fonction WLangage HModifieDroitVue permet de modifier les droits drsquoune vue pour un groupe ou un utilisateur donneacute Plusieurs droits sont disponibles lecture ajout suppression etc Autorise le droit de lecture agrave lrsquoutilisateur DurandHModifieDroitVue(gcnxMaConnexion ldquoDurandrdquo hDroitLecture hAutoriseacute ldquoMaBaserdquo AnnuaireDu34)

La fonction HInfoDroitVue permet de reacutecupeacuterer les droits en cours sur une vue

6 Manipuler une vue (requecircte Hxxx)La manipulation drsquoune vue est strictement identique agrave la manipulation drsquoun fichier de donneacutees classiqueVous pouvez tout agrave fait utiliser les fonctions Hxxx

Exeacutecute la vue ldquoSQLrdquoSI HExeacutecuteRequecircte(AnnuaireDu34) ALORS Parcourt la vue POUR TOUT AnnuaireDu34 FINFIN

Vous pouvez eacutegalement deacutefinir une requecircte baseacutee sur une vue

5 Tacircche planifieacuteePour faciliter la mise agrave jour des vues mateacuterialiseacutees le WLangage met agrave disposition un type de variable hPlani-ficationVueMateacuterialiseacutee il suffit de parameacutetrer la tacircche

planifieacutee ( jour heure) et de deacutefinir la ou les vues agrave mettre agrave jourrefreshView est une hPlanificationVueMateacuterialiseacuteerefreshViewDescription = ldquoRecalcul des donneacutees des vuesrdquo Caracteacuteristiques de la planification Rafraicircchit la vue ldquoMaVuerdquo de la base de donneacutees ldquoMaBaserdquorefreshViewVue[1] = ldquoMaBaseMaVuerdquoHAjoutePlanification(gcnxMaConnexion refreshView)

4 Mettre agrave jour la vue sur le serveurUne vue peut ecirctre mise agrave jour sur le serveur bull degraves sa creacuteation par la modification autobull par programmation via la fonction WLangage HRafraicircchit-

Vue

Bien entendu seules les vues ldquomateacuterialiseacuteesrdquo peuvent ecirctre mises agrave jour

Si votre vue contient des informations qui nrsquoont pas besoin drsquoecirctre mises agrave jour en temps reacuteel (des statistiques un annuaire ) nous vous conseillons de mettre agrave jour votre vue via une tacircche planifieacutee (voir le point 5)Dans le cas contraire pour que votre vue soit agrave jour directement apregraves la modification drsquoun fichier speacutecifique nrsquoheacutesitez pas agrave utiliser un trigger serveur (httpdocpcsoftfr3044369)

TDF Tech 2015 - wwwpcsoftfr - 37

TABLEAU CROISEacute DYNAMIQUE 4 RAISONS DE LrsquoUTILISER

Le champ Tableau croiseacute dynamique est LE champ deacutecisionnel incontournable pour vos applications Voici 4 bonnes raisons drsquointeacutegrer ce champ dans vos applications et de satisfaire vos utilisateursLrsquoexemple  ldquoWD GraphesEtTCD TDF20rdquo  (preacutesent  sur  le DVD)  est  lrsquoexemple servant agrave illustrer cet article

2 Vous pouvez utiliser nrsquoimporte quelle source de donneacuteesLa source de donneacutees la plus simple agrave utiliser ce sont les fichiers HFSQL Mais en version 20 vous pouvez remplir le champ agrave partir de nrsquoimporte quelles donneacutees en utilisant un tableau de structures

1 Toutes les donneacutees sont afficheacutees simultaneacutementLrsquoavantage du champ Tableau croiseacute dynamique est le suivant lrsquointeacutegraliteacute des donneacutees fournies initialement est afficheacutee dans le mecircme champ et organiseacutee intelligemment Les regroupements le deacutetail les totaux Tout est automatique

Tableau des vols Vols est un tableau de InfosVol

Remplit le tableau (par une requecircte des calculs etc)

Lance le calcul du tableauTCDCalculeTout(StatsVols)

38 - TDF Tech 2015 - wwwpcsoftfr

3 Lrsquoutilisateur peut reacuteorganiser ses donneacutees comme il le souhaiteLrsquooption ldquoReacuteorganiser les entecirctes de lignes et de colonnesrdquo permet agrave lrsquoutilisateur de reacuteorganiser complegravetement les entecirctes position visibiliteacute etc Crsquoest tregraves utile pour obtenir une statistique qui nrsquoaurait pas eacuteteacute preacutevue initialement par le deacuteveloppeurDe plus lrsquoutilisateur peut supprimer une valeur drsquoentecircte donneacutee (par exemple supprimer le pays ldquoFrancerdquo de la liste des pays)

4 La mise en forme est simplifieacutee eYeMagnet manuelle par programmationAvoir des chiffres crsquoest bien Pouvoir les analyser rapidement et simplement crsquoest mieux Pour satisfaire ce besoin le tableau croiseacute dynamique permet de mettre en forme les donneacutees bull via le systegraveme eYeMagnet depuis la description de la valeur agrave afficher Crsquoest le cas dans notre exemple le eYeMagnet permet drsquoafficher 

la cellule du beacuteneacutefice en rouge ou vert selon la valeurbull manuellement depuis le menu contextuel Lrsquoutilisateur peut en effet marquer une cellule particuliegravere avec une couleur pour la mettre en eacutevidencebull par programmation en modifiant la couleur de texte de fond ou le style de la cellule Hachure les cellules sans donneacuteesSI Beacuteneacutefice = 0 ALORS BeacuteneacuteficeStyleFond = styleHachureDiagonaleGauche

TDF Tech 2015 - wwwpcsoftfr - 39

LE CHAMP GRAPHE SECTEUR MULTINIVEAU

Le graphe Secteur multiniveau permet de repreacutesenter visuellement des donneacutees arborescentes et de naviguer parmi les diffeacuterents niveauxVoici 3 utilisations diffeacuterentes de ce nouveau graphe

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo (preacutesent sur le DVD)

Agrave propos du champ Graphe

Types de graphesLe champ Graphe permet de creacuteer diffeacuterents types de graphes bull courbebull airebull secteur (camembert)bull beignet (donut)bull heacutemicyclebull histogrammebull nuage de pointsbull graphe boursierbull graphe agrave bullesbull surfacebull entonnoirbull radarbull waterfall

bull secteur multiniveau (apparu en version 20)

Comment remplir un grapheLe champ Graphe peut ecirctre rempli de diffeacute-rentes faccedilons bull par programmation  avec  les  fonctions grXXX du WLangagebull agrave partir drsquoun fichier de la base de donneacutees (ou drsquoune requecircte)bull agrave partir des valeurs drsquoune colonne de table bull agrave partir drsquoun champ Listebull agrave partir drsquoune variable tableau WLangage

La source de donneacutees du graphe peut ecirctre deacutefinie dans lrsquoonglet ldquoSeacuteriesrdquo de la description du champ

Le champ graphe Secteur multiniveauLe graphe de type Secteur multiniveau est un graphe Secteur contenant plusieurs niveaux de donneacutees hieacuterarchiques

Lrsquointeacuterecirct de ce type de graphe est double bull drsquoune part il permet lrsquoaffichage concis et hieacute-

rarchiseacute drsquoun tregraves grand nombre de donneacuteesbull drsquoautre part ce type de graphe est interactif  le clic sur une part permet de rentrer dans le deacutetail des sous-niveaux de cette part

Comment utiliser ce grapheEn plus des fonctions grXXX standard le graphe Secteur multiniveau dispose de fonc-tions speacutecifiques bull grSMNAjouteDonneacutee pour ajouter une donneacuteebull grSMNCouleurPortion pour changer la couleur drsquoune portionbull grSMNPortionRacine pour changer ou preacuteciser le chemin de la racinebull grSMNReacutecupegravereDonneacutee pour reacutecupeacuterer une valeur Deacutefinit les valeursgrSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo 200000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoParisrdquo 50000)grSMNAjouteDonneacutee(GRF_SunBurst ldquoFrancerdquo +TAB+ ldquoLyonrdquo 10000) Couleur de la portion ldquoFrancerdquogrSMNCouleurPortion(

NOUVEAUTEacuteS DU CHAMP GRAPHEEn version 20 le champ Graphe dispose de deux nouveauteacutes tregraves utiles

1 La bulle de survol a eacuteteacute ameacutelioreacutee bull elle srsquoaffiche avec une leacutegegravere transparence (pour ne pas masquer de contenu)bull son cadre est de la mecircme couleur que la seacuterie actuellement survoleacutee (pour ecirctre sucircr que la donneacutee visualiseacutee est bien celle attendue)

2 La majoriteacute des types de graphes dispose drsquoune mire qui facilite la lecture des valeurs survoleacutees

Cette mire est activable depuis  la description du champ Graphe onglet ldquoDeacutetailrdquo via lrsquooption ldquoActiver la mire du grapherdquo

Pour les graphes de type Courbe et Histogramme empileacute il est possible de demander une mire multiple au survol de la valeur drsquoune courbe la bulle de la mire va afficher les valeurs de toutes les courbes pour la mecircme abscisse

40 - TDF Tech 2015 - wwwpcsoftfr

GRF_SunBurst ldquoFrancerdquo BleuPastel)

2 utilisations originales du Secteur multiniveau

1 Afficher le contenu drsquoun tableau croiseacute dynamiqueLrsquoexemple fournit un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo pour afficher le rendu drsquoun tableau croiseacute dynamique dans un graphe Secteur multiniveau

Lrsquoutilisation de ce modegravele de champs se fait simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe

Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne 2)

Pour plus de deacutetails sur la mise en œuvre et lrsquoutilisation de ce modegravele de champs vous pouvez consulter lrsquoannexe 3

Attention ce type drsquoaffichage nrsquoest pas adapteacute agrave un tableau croiseacute dynamique com-prenant des valeurs neacutegativesEn effet une valeur neacutegative ne peut pas ecirctre repreacutesenteacutee dans un graphe Secteur multiniveau

2 Creacuteer un menu originalLe menu principal drsquoune fenecirctre contient geacuteneacuteralement plusieurs sous-menus et options

Il existe donc une notion de hieacuterarchie exploi-table via un graphe Secteur multiniveau

Lrsquoideacutee est de positionner une valeur dans le graphe pour chaque sous-menu option du menu principal

bull en cliquant sur une portion correspondant agrave un menu le menu est afficheacute comme racine et les options du menu sont afficheacuteesbull en cliquant sur une portion correspondant agrave une option le code de cette option est exeacutecuteacute

La collection de proceacutedures ldquoCOL_MenuSMNrdquo de lrsquoexemple contient les fonctions utiles pour transformer un menu principal en menu graphe

Pour utiliser ce menu animeacute et graphique il suffit de bull positionner  un  champ Graphe de  type Secteur multiniveaubull appeler  la  fonction MenuVersSecteur-Multiniveau en preacutecisant le nom de la fenecirctre contenant le menu (source) et le nom du graphe (destination) Construit le menu ldquographerdquo agrave partir du menu de la fenecirctreMenuVersSecteurMultiNiveau( MaFenecirctreNom GRF_MENU)

bull cacher le menu de la fenecirctre Cache le menu de la fenecirctre _MenuVisible = Faux

TDF Tech 2015 - wwwpcsoftfr - 41

ONGLETS DYNAMIQUES MODERNISER UNE APPLICATION

Les onglets dynamiques permettent de proposer une interface moderne et intuitiveCet article vous preacutesente lrsquoutilisation de ce champ ainsi que la transformation pas agrave pas drsquoune interface ldquofenecirctre MDIrdquo en ldquoonglet dynamiquerdquo

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD OngletDynamique TDF20rdquo (preacutesent sur le DVD)

Les onglets dynamiquesEn version 20 le champ Onglet propose la fonctionnaliteacute ldquoonglets dynamiquesrdquoCette fonctionnaliteacute permet de creacuteer des IHM proches des navigateurs reacutecents avec des volets qui srsquoouvrent se deacutetachent etc

Un volet dynamique est un volet qui sera ouvert dynamiquement agrave la demande

Le contenu drsquoun volet dynamique correspond agrave une fenecirctre interne

Pour activer les onglets dynamiques sur un champ Onglet cochez lrsquooption ldquoActiver les fonctionnaliteacutes des onglets dynamiquesrdquo (onglet ldquoDeacutetailrdquo de la description du champ)

Important dans un champ Onglet il est tout agrave fait possible drsquoafficher des volets statiques et des volets dynamiques simultaneacutement

Ajouter un volet dynamiqueLes volets dynamiques peuvent ecirctre ajouteacutes de diffeacuterentes faccedilons 1 Dans lrsquoonglet ldquoDeacutetailrdquo du champ vous preacute-cisez la fenecirctre interne utiliseacutee lors drsquoun clic sur le bouton ldquo+rdquoCette solution est agrave utiliser si les volets doivent afficher un contenu similaire (des fiches clients par exemple)

2 Par programmation via la fonction Onglet-Ouvre vous pouvez ajouter un volet avec nrsquoimporte quelle fenecirctre interne du projetCette solution est agrave utiliser si les volets affichent des informations heacuteteacuterogegravenes ou si les fenecirctres internes attendent des paramegravetres Ouvre un ongletOngletOuvre(ONG_Exemple ldquoOnglet avec paramegravetresrdquo FI_Volet_Programmation ldquoParamegravetrerdquo)

Parameacutetrer les volets dynamiquesDepuis la description du champ Onglet onglet ldquoDeacutetailrdquo il est possible de parameacutetrer le com-portement des volets dynamiques bull preacutesence drsquoun bouton ldquoNouveau (+)rdquo pour ajouter un nouveau volet avec la fenecirctre interne deacutefinie en eacuteditionbull preacutesence drsquoun bouton ldquoFermer  (x)rdquo pour fermer manuellement un volet dynamiquebull possibiliteacute de deacutetacher les voletsbull meacutemorisation de la configuration des volets

Remarque il est possible de sauver et charger une configuration drsquoonglets dynamiques via les fonctions WLangage OngletSauveCon-figuration et OngletChargeConfiguration

Transformer une application fenecirctre MDILes fenecirctres MDI sont preacutesentes dans le perso-dossier ldquoFenecirctre MDIrdquoLes  fenecirctres relookeacutees avec onglets dyna-miques sont preacutesentes dans le perso-dossier ldquoOnglet Dynamiquerdquo

1 Fenecirctre principaleLa premiegravere eacutetape consiste agrave transformer la fenecirctre megravere MDI (ldquoFEN_Principale_MDIrdquo) en fenecirctre libre avec un champ Onglet dyna-mique

Dans la description de la fenecirctre onglet ldquoDeacutetailrdquo modifiez le type de la fenecirctre en ldquoFenecirctre librerdquo et supprimez le menu principal de la fenecirctre

Ajoutez un champ Onglet dynamique en haut de la fenecirctre ouvrez sa description et nommez-le ldquoONG_MonOngletrdquo

Nous allons deacutefinir un volet statique qui contiendra la table des clients dans lrsquoonglet

ldquoGeacuteneacuteralrdquo cliquez sur ldquoNouveaurdquo et saisissez le libelleacute ldquoListe des clientsrdquo

Le contenu de ce volet crsquoest tout simplement le contenu de la fenecirctre ldquoFEN_Table_MDIrdquo  depuis la fenecirctre ldquoFEN_Table_MDIrdquo copiez le champ Table ainsi que les boutons ldquoNouveaurdquo et ldquoModifierrdquo et collez ces 3 champs dans le volet statique

2 Fenecirctre interne ldquoFicherdquoNotre champ Onglet doit pouvoir ouvrir un volet ldquoFiche clientrdquo pour saisir un nouveau client  Il est donc neacutecessaire de creacuteer une fenecirctre interne contenant les champs utiles agrave une fiche client

Pour cela bull ouvrez la fenecirctre ldquoFEN_Fiche_MDIrdquobull seacutelectionnez tous les champs de la fenecirctrebull faites un clic droit sur votre seacutelectionbull cliquez sur lrsquooption ldquoRefactoring  Creacuteer une fenecirctre interne avec la seacutelectionrdquobull renommez  la  fenecirctre  interne  creacuteeacutee  en ldquoFI_FicheClientrdquo

Dans le code drsquoinitialisation de la fenecirctre interne creacuteeacutee recopiez le code drsquoinitialisation de la fenecirctre ldquoFEN_Fiche_MDIrdquo (sans omettre le paramegravetre de la fenecirctre)

Pour deacutefinir notre nouvelle fenecirctre interne comme fenecirctre agrave utiliser en cas drsquoajout de volet affichez la description du champ Onglet onglet ldquoDeacutetailrdquo et seacutelectionnez la fenecirctre que nous venons de creacuteer comme ldquoFenecirctre interne en creacuteationrdquo

Au passage vous pouvez bull deacutefinir un  libelleacute par deacutefaut pour  le volet qui sera creacuteeacute (ldquoNouveau clientrdquo par exemple)bull  activer  lrsquooption  ldquoVolets  deacutetachablesrdquo  si neacutecessaire

42 - TDF Tech 2015 - wwwpcsoftfr

Important dans la description de la fenecirctre interne onglet ldquoDeacutetailrdquo il faut absolument cocher la case ldquoContexte HFSQL indeacutependantrdquoDans le cas contraire les appels aux fonctions FichierVersEcran et EcranVersFichier vont modifier les donneacutees de tous les onglets

3 Modifier les appels agrave MDIOuvreMaintenant que notre application nrsquoest plus une application ldquoMegravereFille MDIrdquo il est neacuteces-saire de remplacer les appels agrave la fonction MDIOuvre par des appels agrave la nouvelle fonc-tion WLangage OngletOuvre

Pour le bouton ldquoNouveaurdquo crsquoest tregraves simple On ouvre la fenecirctre en creacuteationOngletOuvre( ONG_MonOnglet ldquoNouveau clientrdquo FI_FicheClient 0)

Pour le bouton ldquoModifierrdquo crsquoest un peu plus technique

Dans lrsquoancienne application le deacuteveloppeur donnait un alias (baseacute sur lrsquoidentifiant auto-matique de lrsquoenregistrement) agrave chaque fenecirctre fille pour ne pas les ouvrir deux fois

Avec les nouveaux onglets dynamiques crsquoest lrsquoapplication qui deacutetermine automatiquement lrsquoalias du volet drsquoonglet au moment de lrsquoappel agrave la fonction OngletOuvre

Il est donc neacutecessaire de conserver la liste des volets ouverts dans un tableau associatif de chaicircnes la cleacute de ce tableau sera lrsquoidentifiant automatique du client Ce tableau doit ecirctre deacutefini dans le traitement de deacuteclaration de la fenecirctregtaOnglet est un tableau associatif de chaicircnes

La deacutefinition existante de lrsquoalias est donc modifieacutee par Reacutecupegravere lrsquoidentifiant du clientsAlias est une chaicircne = gtaOnglet[nNumClient]

Au lieu de tester la preacutesence drsquoune fenecirctre fille MDI via FenEtat il faut maintenant utiliser ChampExiste pour deacuteterminer si le volet a

deacutejagrave eacuteteacute creacuteeacute

Comme preacuteceacutedemment lrsquoappel agrave MDIOuvre doit ecirctre remplaceacute par un appel agrave OngletOuvre (les paramegravetres restent inchangeacutes)

La fonction OngletOuvre retourne le nom de lrsquoalias attribueacute agrave lrsquoonglet il est donc important de lrsquoajouter dans le tableau associatif preacutevu

Et enfin lrsquoappel agrave MDIActive doit ecirctre rem-placeacute par un appel agrave DonneFocus pour activer lrsquoonglet srsquoil existe deacutejagrave

Regarde si la fiche client nrsquoest pas deacutejagrave ouverte SI sAlias = ldquordquo _OU_ChampExiste(sAlias) = Faux ALORS Ouvre la fenecirctre en modif gtaOnglet[nNumClient] = OngletOuvre(ONG_MonOnglet ChaicircneConstruit( ldquoFiche client de 1rdquo Table_CLIENTNom[nIndice]) FI_FicheClient nNumClient)SINON Donne le focus au volet DonneFocus(sAlias)FIN

4 Modifier la fiche clientDans la fenecirctre interne ldquoFiche clientrdquo il est neacutecessaire drsquoadapter le code des boutons

Le bouton ldquoAnnulerrdquo fait un appel agrave Ferme ce qui nrsquoest pas adapteacute agrave la fenecirctre interne la fonction Ferme va fermer la fenecirctre en cours alors que nous voulons annuler les modifications sur la fiche

Pour cela il suffit de refaire un appel agrave la fonc-tion FichierVerEcran les valeurs preacutesentes dans le fichier de donneacutees seront reacuteafficheacutees annulant ainsi les eacuteventuelles modifications

Et le bouton Valider

Lrsquoappel agrave la fonction FenEtat nrsquoest plus utile puisque la table est preacutesente dans la mecircme

fenecirctre que la fiche Et ici aussi il convient de supprimer lrsquoappel agrave la fonction Ferme pour ne pas fermer lrsquoapplication

5 Modifier le libelleacute du voletNotre application est maintenant fonction-nelle

Mais il reste un petit deacutetail agrave reacutegler agrave la creacuteation drsquoun nouveau client apregraves avoir saisi ses informations et valideacute le libelleacute du volet est toujours ldquoNouveau clientrdquo

Comme pour lrsquoouverture drsquoune fiche depuis la table il faudrait que le libelleacute se modifie en ldquoFiche client de ltnom du clientgtrdquo

Pour modifier le libelleacute de lrsquoonglet depuis la fenecirctre interne utilisez la nouvelle fonction WLangage de la version 20  OngletDuChamp

Cette fonction prend en paramegravetre un champ et retourne le nom du champ Onglet qui le contient

En effectuant une indirection sur le reacutesultat de cette fonction il est possible de reacutecupeacuterer directement le volet courant (variable de type Champ) Reacutecupegravere le volet courantchOnglet est un Champ lt- OngletDuChamp(MoiMecircme) indChamp Si aucun alias nrsquoest deacutefiniSI FEN_Principale_MDIgtaOnglet[ClientIDClient]Vide ALORS Meacutemorise lrsquoalias FEN_Principale_MDIgtaOnglet[ ClientIDClient] = chOnglet FIN Modifie le libelleacute du voletchOnglet[FEN_Principale_MDIgtaOnglet[ClientIDClient]]Libelleacute = ChaicircneConstruit( ldquoFiche client de 1rdquoNom)

TDF Tech 2015 - wwwpcsoftfr - 43

LE CHAMP TABLEUR

Le champ Tableur vous permet drsquointeacutegrer un tableur directement dans vos applications Plus besoin de geacuterer des licences drsquoinstaller Office ou de manipuler un ActiveX Vous utilisez un champ et des ordres WLangage adapteacutes 

Mise en formeLrsquoutilisateur peut modifier le format des cellules leur mise en forme avec la barre drsquooutil en haut bull la police (nom taille)bull le gras souligneacute italiquebull le cadrebull la couleur de fond et la couleur de textebull lrsquoalignementbull la fusionbull le format de la cellule

FormuleLrsquoutilisateur peut utiliser des formules pour effectuer des calculs par exemple ici la somme des valeurs drsquoune colonne (=SOMME(F6F10))Pour faciliter le choix parmi les nombreuses fonctions disponibles (plus drsquoune centaine ) la saisie de la formule propose une compleacutetion

Vous pouvez eacutegalement ajouter vos propres fonctions WLangage (voir la section ldquoManipuler le champ par pro-grammationrdquo)

ParameacutetrageDans la description du champ Tableur onglet ldquoDeacutetailrdquo vous pouvez deacutefinir si lrsquoutilisateur pourra saisir des valeurs et des formulesVous pourrez eacutegalement deacutefinir la visibiliteacute des entecirctes de lignes et de colonnes de la barre drsquooutils et de la barre de saisie de formule

44 - TDF Tech 2015 - wwwpcsoftfr

Exemple didactique disponibleLrsquoexemple ldquoWD Tableurrdquo  livreacute en standard avec WINDEV est un exemple didactique sur le champ Tableur qui vous permettra de manipuler ce champ de tester les fonctions et les options de parameacutetrage

Sauver le contenuBien entendu il est possible de sauvegarder le contenu du champ Tableur

Il suffit drsquoutiliser  lrsquooption ldquoEnregistrer sous  rdquo du menu contextuel du champ (FAA)

Le champ Tableur est capable nativement drsquoafficher et de sauver des fichiers Excel au format XLSX

Eacutedition depuis lrsquoeacutediteur de fenecirctresLe champ Tableur peut ecirctre eacutediteacute degraves sa creacuteation directement depuis lrsquoeacutediteur de fenecirctresIl suffit drsquoutiliser lrsquooption ldquoEditer le contenurdquo du menu contextuel du champIl est eacutegalement possible de passer en eacutedition en effectuant un simple clic lorsque le champ est deacutejagrave seacutelectionneacute

Un cadre jaune apparaicirct autour du champ cela signifie que le mode eacutedition est actif La touche ldquoEchaprdquo permet de quitter le mode eacutedition

En mode eacutedition vous pouvez saisir des donneacutees des calculs et mettre en forme les cellulesTout le contenu deacutefini en eacutedition constituera le contenu initial du champ

Manipuler le champ par programmationPour remplir des cellules drsquoun champ Tableur ou reacutecupeacuterer leur valeur la syntaxe agrave utiliser est la suivante ltChampTableurgt[ltcellulegt]TBLR_MonTableur[ldquoA1rdquo] = 42

Le WLangage dispose de plusieurs fonctions pour manipuler le champ Tableur bull TableurCharge pour charger un document Excel directement dans le champbull TableurSauve pour sauvegarder le contenu drsquoun champ Tableur dans un fichierbull TableurAjouteFormule pour ajouter une formule dans une cellulebull 

La fonction TableurAutoriseProceacutedure est tregraves inteacuteressante elle permet drsquoautoriser vos proceacutedures WLangage agrave ecirctre utiliseacutees dans une formule

La proceacutedure sera automatiquement proposeacutee agrave lrsquoutilisateur final dans le champ Tableur (via la compleacutetion)TableurAutoriseProceacutedure( TBLR_MonTableur DeacutetermineAcompte)

Votre proceacutedure peut prendre autant de paramegravetres que neacutecessaire et doit absolument renvoyer une valeur le reacutesultat agrave afficher dans la cellule

TDF Tech 2015 - wwwpcsoftfr - 45

LE CHAMP CONFEacuteRENCE

Le champ Confeacuterence vous permet drsquoeacutechanger la videacuteo et le son entre deux applications situeacutees sur deux machines distantesAvec  1  champ  et  2  fonctions  WLangage  vous  reacutealisez  simplement  et rapidement un outil de communication

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWD VisioConfeacuterencerdquo  (livreacute en standard avec WINDEV)

Le champ VisionConfeacuterenceDans un premier temps il est important de diffeacuterencier les champs Confeacuterence Cameacutera et Multimeacutedia bull le champ Multimeacutedia permet de jouer une videacuteo provenant drsquoun fichierbull le champ Cameacutera permet drsquoafficher en direct la videacuteo de la webcam de lrsquoordinateur sur lequel est installeacutee lrsquoapplicationbull le champ Confeacuterence permet drsquoafficher la videacuteo drsquoune webcam drsquoun autre poste (local ou distant)

Une fenecirctre contenant 2 champs Confeacuterence un sur la webcam locale et lrsquoautre sur la web-cam drsquoun ordinateur distant permet donc de reacutealiser une visioconfeacuterence

DescriptionDans la description du champ Confeacuterence onglet ldquoGeacuteneacuteralrdquo il est possible drsquoindiquer si le champ doit afficher la videacuteo reccedilue ou la videacuteo envoyeacutee

La videacuteo et le son transitent avec des flux ce sont ces flux que vous allez manipuler

Le champ Confeacuterence est simplement un conteneur qui affiche le contenu du flux (videacuteo et son)

Le bouton ldquoEditer les flux de la fenecirctrerdquo permet de parameacutetrer le flux de la fenecirctre

Vous pouvez ainsi choisir ce que le flux trans-porte videacuteo etou son en envoi etou en reacuteception

Connecter deux applicationsLa programmation du champ Confeacuterence est reacutealiseacutee par la famille de fonctions FluxXXX du WLangagePour connecter deux applications avec le champ Confeacuterence deux eacutetapes suffisent

1 La premiegravere application doit ldquoamorcerrdquo la connexion avec  la  fonction WLangage FluxConnecte pour lancer la connexion

Identifant de connexion (lrsquoutilisateur en cours)FLUX_MonFluxIdentifiant = ReacuteseauUtilisateur() Connexion du flux du champ CONF_Reacuteception agrave lrsquoadresse demandeacuteeFluxConnecte(CONF_Reacuteception sIP)SI FLUX_MonFlux = 0 ALORS Erreur(ldquoEacutechec de connexionrdquo) FIN

Remarque lrsquoidentifiant de flux peut ecirctre reacutecupeacutereacute par lrsquoapplication cliente pour savoir

46 - TDF Tech 2015 - wwwpcsoftfr

qui effectue la demande Pensez agrave bien le renseigner

2 La deuxiegraveme application est preacutevenue de la demande de connexion dans le traitement de ldquoDemande de connexion drsquoun nouveau fluxrdquo du champ ConfeacuterencePour acceacuteder aux traitements des flux choisis-sez lrsquooption ldquoCode du flux associeacuterdquo du menu contextuel du champ ConfeacuterenceCe traitement reccediloit en paramegravetre lrsquoidenti-fiant du flux

Avec la fonction WLangage FluxInfo il est possible de reacutecupeacuterer des informations sur

ce flux bull le nom de lrsquoappelant (proprieacuteteacute Identifiant renseigneacutee par lrsquoapplication appelante)bull lrsquoadresse IP de lrsquoappelant

La fonction FluxAccepte permet drsquoaccepter la demande de connexion et lance la visiocon-feacuterence A contrario la fonction FluxRefuse permet de refuser une connexion

nIdFlux contient lrsquoidentifiant du flux deacutetecteacutePROCEDURE NouveauFlux(nIdFlux) Nom de lrsquoappelantsNomAppelant est une chaicircne

sNomAppelant = FluxInfo(nIdFlux FluxNomAppelant) Adresse de lrsquoappelantsAdresseAppelant=FluxInfo(nIdFlux FluxNumeacuteroAppelant) Accepte le fluxFluxAccepte(nIdFlux CONF_Reacuteception)

TDF Tech 2015 - wwwpcsoftfr - 47

1 Gestion des alignementsEn version 20 lrsquoeacutediteur de fenecirctres propose des types drsquoalignement

suppleacutementaires tregraves utilesCes alignements sont disponibles dans le volet ldquoAlignementrdquo du rubanParmi les nouveauteacutes vous retrouverez bull des positionnements  (coin haut gauche coin bas droit etc)

bull des agrandissements

Agrave la creacuteation drsquoun champ les ancrages sont automatiquement ajouteacutes

Ces ancrages sont calculeacutes par rapport aux ancrages des champs deacutejagrave preacutesents dans la fenecirctre

Et si le champ creacuteeacute est un champ ldquoconteneurrdquo (un onglet une table un tableur un tableau croiseacute dynamique) le champ prend auto-matiquement la plus grande place disponible

2 Cadres sur les champsPour chaque champ il est possible de deacutefinir un cadre

En version 20 vous pouvez maintenant deacutefinir le cadre drsquoun champ directement depuis lrsquoeacutediteur de fenecirctres sans aller dans la des-cription du champ

Pour deacutefinir un cadre directement depuis

lrsquoeacutediteur de fenecirctres seacutelectionnez un champ et appuyez sur la touche ldquoAltrdquo un bouton speacutecifique ( ) apparaicirct alors Ce bouton permet de passer en mode eacutedition de cadre

En mode eacutedition 2 panneaux drsquooutils sont afficheacutes Ces panneaux permettent de modifier toutes les options du cadre bull lrsquoeacutepaisseur du traitbull le type de traitbull la couleurbull le  type drsquoarrondi sur chaque coin  (seacutepa-reacutement )

Remarque si vous voulez vous pouvez mecircme deacutefinir des couleurs de traits diffeacuterentes pour les diffeacuterents bords  crsquoest WINDEV qui calcule automatiquement le deacutegradeacute pour passer drsquoune couleur agrave lrsquoautre

3 Le ldquoDo It Againrdquo (F4)Le raccourci ldquoF4rdquo permet drsquoappliquer sur la seacutelection de champs la der-

niegravere opeacuteration effectueacutee sur un autre champ

Par exemple si vous venez de deacutefinir un cadre complexe sur un champ il vous suffit de seacutelectionner les autres champs sur lequel le cadre doit ecirctre appliqueacute et drsquoappuyer sur F4 tous les champs seacutelectionneacutes ont maintenant le mecircme cadre

4 Ancrage en redimension-nementEn version 20 un groupe de champs

peut ecirctre redimensionneacute en une seule opeacute-ration en utilisant la logique des ancrages

Cette fonctionnaliteacute est particuliegraverement utile lorsque vous devez modifier une IHM complexe 1 Vous seacutelectionnez les champs agrave redimen-

sionner2 Vous jouez avec les points drsquoancrages drsquoun des champs tous les champs suivent le mecircme mouvement

La figure 1 illustre parfaitement cette fonc-tionnaliteacute tous les champs sont seacutelection-neacutes et lrsquoutilisateur agrandit tous les champs en deacuteplaccedilant le point drsquoancrage du bouton ldquoEnvoyerrdquo vers le bas et vers la droite

5 Bouton texte riche RTFEn version 20 tous les boutons peuvent afficher du texte RTF

Cette fonctionnaliteacute est particuliegraverement utile pour mettre en eacutevidence un mot dans le libelleacute du bouton

Par exemple pour un bouton ldquoSupprimer deacutefinitivement toutes les lignesrdquo

il peut ecirctre utile pour lrsquoutilisateur de mettre en eacutevidence le mot ldquodeacutefinitivementrdquo (en rouge) et le mot ldquotoutesrdquo (souligneacute)

6 FotoliaLe catalogue drsquoimages de WINDEV met agrave disposition des milliers drsquoimages reacuteparties en diffeacuterents

thegravemes pour srsquoadapter au mieux au look de vos applications

En version 20 vous pouvez maintenant utiliser

En version 20 lrsquoeacutediteur de fenecirctres eacutevolue pour encore plus de productiviteacute et drsquoergonomieDans ce sujet nous vous preacutesentons 11 fonctionnaliteacutes tregraves utiles de lrsquoeacutediteur de fenecirctresLisez attentivement vous allez certainement deacutecouvrir de nombreuses fonctionnaliteacutes meacuteconnues

EacuteDITEUR DE FENEcircTRES

48 - TDF Tech 2015 - wwwpcsoftfr

des images qui proviennent de Fotolia

AttentionCette fonctionnaliteacute neacutecessite un abonnement agrave Fotolia

7 Raccourci clavier sur un boutonLes raccourcis clavier sont indispen-sables dans une application

Ils permettent drsquoeacuteviter des clics  inutiles agrave lrsquoutilisateur pour les actions les plus courantes

Pour deacutefinir un raccourci sur un champ Bouton dans la description du bouton onglet ldquoIHMrdquo cliquez sur le bouton  situeacute agrave cocircteacute de lrsquooption ldquoLettre drsquoappelrdquo

Dans la fenecirctre qui srsquoaffiche cliquez sur le bouton ldquoDeacutetectionrdquo et appuyez sur le rac-courci souhaiteacute

8 Recyclage des fenecirctresPar deacutefaut la fenecirctre de description de champ nrsquoest pas recycleacutee pour

chaque description de champ ouverte une nouvelle fenecirctre de description est ouverte un cadenas ouvert est afficheacute dans la barre de titre

Pour que lrsquoeacutediteur de fenecirctres recycle la fenecirctre de description et ouvre toutes les descriptions dans la mecircme fenecirctre il suffit de cliquer sur le cadenas pour le fermer

9 Jaune infinieLe champ Jauge permet de repreacute-senter visuellement la progression drsquoun traitement

Il est tregraves utile pour donner une indication agrave lrsquoutilisateur et eacuteviter lrsquoeffet ldquofigeacutebloqueacuterdquo

Il arrive souvent qursquoun traitement speacutecifique ait un temps de traitement inconnu il est ideacuteal dans ce cas drsquoutiliser une jauge infinie (une jauge qui boucle toute seule indeacutefiniment)

AttentionLe champ Jauge infinie est un champ diffeacute-rent du champ Jauge ldquoclassiquerdquo il nrsquoest pas possible de passer de lrsquoun agrave lrsquoautre

10 Ordre de tabulationLrsquoordre de tabulation est une fonctionnaliteacute tregraves solliciteacutee par

les utilisateurs sur les IHM contenant de nom-breux champs de saisie un appui sur TAB permet de passer au champ suivant crsquoest un gain de temps indeacuteniable

Les anciennes versions de WINDEV prenaient lrsquoordre de creacuteation des champs comme ordre de tabulation par deacutefaut

Chaque deacuteplacement de champs dans la fenecirctre pouvait donc neacutecessiter de la part du deacuteveloppeur une modification de lrsquoordre de tabulation

Pour toutes les fenecirctres creacuteeacutees en version 20 lrsquoordre de tabulation est deacutefini en auto-matique  crsquoest-agrave-dire que WINDEV calculera 

automatiquement lrsquoordre de tabulation le plus pertinent agrave chaque modification de lrsquoIHM

Pour les fenecirctres qui ont eacuteteacute creacuteeacutees avec drsquoanciennes versions vous pouvez activer cette option directement depuis la fenecirctre ldquoOrdre de navigationrdquo sous le volet ldquoFenecirctrerdquo dans le groupe ldquoOrdrerdquo cliquez sur ldquoNavigationrdquo et cochez lrsquooption ldquoDeacutefinir automatiquement lrsquoordre de navigation agrave chaque modification de la fenecirctrerdquo

Bien entendu vous pouvez deacutefinir lrsquoordre de tabulation manuellement (si lrsquoordre automa-tique nrsquoest pas adapteacute agrave votre IHM)

11 Centralisation de la mise agrave jour de lrsquoIHMEn version 20 un nouveau traite-

ment ldquoDemande de mise agrave jour de lrsquoaffichagerdquo est disponible pour les fenecirctres

Ce traitement permet de mettre agrave jour lrsquoIHM des fenecirctres de maniegravere centraliseacutee le code de ce traitement sera exeacutecuteacute lors drsquoun appel aux fonctions DemandeMiseAJourIHM (exeacute-cution du traitement agrave la fin du traitement en cours) et ExeacutecuteMiseAJourIHM (exeacutecution immeacutediate du traitement)

Il vous suffit donc de positionner le code qui met agrave jour le contenu de la fenecirctre (rafraicirc-chissement drsquoune table de champs de saisie etc) dans ce traitement

AstuceIl  est possible de passer des paramegravetres aux fonctions DemandeMiseAJourIHM et ExeacutecuteMiseAJourIHMCes paramegravetres seront retransmis au traite-ment de mise agrave jour cela permet notamment de rafraicircchir uniquement certaines infor-mations

TDF Tech 2015 - wwwpcsoftfr - 49

ARCHITECTURE LOGICIELLE MVP (MODEgraveLE-VUE-PREacuteSENTATION)

Bien architecturer son projet crsquoest un aspect essentiel du deacuteveloppementLrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation) est une architecture logicielle tregraves reacutepandue qursquoil est possible drsquoutiliser facilement avec WINDEV 20Cet article deacutetaille une utilisation de cette architecture

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD Deacutecouverte MVP - Partie 1rdquo (livreacute en standard)

Pour bien appreacutehender lrsquoarchitecture MVP et son utilisation avec WINDEV nous vous recommandons fortement de consulter lrsquoaide en ligne et de tester les exemples ldquoWD Deacutecouverte MVP xxxrdquo livreacutes en standard avec WINDEV

Architecture MVPPour organiser un projet il existe de nom-breuses architectures

Avec WINDEV vous pouvez tregraves simplement utiliser lrsquoarchitecture MVP (Modegravele-Vue-Preacutesentation)

Cette architecture consiste agrave deacutecouper votre application en trois parties distinctes

Les trois parties sont seacutepareacutees il est possible de les deacutevelopper et de les tester indeacutepen-damment et de partager des eacuteleacutements avec drsquoautres projets en minimisant les risques

Le scheacutema de la page suivante affiche de faccedilon syntheacutetique lrsquoessentiel de lrsquoarchitecture MVP bull la vuebull la preacutesentationbull le modegravelebull les interactions possibles entre chaque partie

Modegravele de donneacuteesLe modegravele de donneacutees constitue le cœur de lrsquoapplication

Le modegravele est constitueacute drsquoune ou plusieurs classes qui modeacutelisent les donneacutees mani-puleacutees

Ces classes accegravedent aux donneacutees reacuteelles Ce sont eacutegalement ces classes qui contiennent le code meacutetier de lrsquoapplication

Point important avec le MVP le modegravele nrsquoa pas connaissance des autres eacuteleacutements de lrsquoapplication

De ce point deacutecoulent deux avantages bull drsquoune part il est tregraves facile de partager (gracircce au GDS par exemple) un modegravele entre plu-sieurs applications y compris des applications mobiles et des sites Webbull drsquoautre  part  tester  le modegravele  est  aiseacute puisqursquoil ne contient que du code et des accegraves aux donneacutees

VuesLes vues sont les IHM de votre application  les fenecirctres les eacutetats etc

Dans lrsquoarchitecture MVP les vues ne connaissent pas le modegravele elles nrsquoaccegrave-dent pas aux donneacutees directement

Pour reacutealiser lrsquoaffichage les vues puisent les informations dont elles ont besoin dans le troisiegraveme eacuteleacutement la Preacutesentation

PreacutesentationLa preacutesentation est chargeacutee de remplir lrsquoespace entre la vue et le modegravele

Lorsque la vue veut srsquoafficher elle demande les informations agrave la preacutesentation

Lorsque lrsquoutilisateur saisit des donneacutees dans la vue elles sont transmises agrave la preacutesentation

Lorsque la preacutesentation reccediloit des change-ments elle les reacutepercute sur le modegravele

Enfin si le modegravele est modifieacute il notifie la preacutesentation qui agrave son tour demande aux vues de se mettre agrave jour

Mettre en place le MVP avec WINDEVPour vous preacutesenter le MVP nous allons nous appuyer sur lrsquoexemple didactique ldquoWD 

Deacutecouverte MVP - Partie 1rdquo livreacute en standard avec WINDEV Il srsquoagit drsquoune application de carnet drsquoadresses

Dans cette application il y a deux vues bull la table des contacts (ldquoFEN_Table_Contactrdquo)bull la fiche drsquoun contact (ldquoFEN_Fiche_Contactrdquo)

Nous allons eacutetudier la vue ldquoFEN_Fiche_Contactrdquo et les eacuteleacutements lieacutes bull la classe CModegraveleContact (classe modegravele)bull la  classe CPreacutesentationFicheContact (classe preacutesentation)

Code du modegraveleLa classe modegravele CModegraveleContact corres-pond au fichier de donneacutees ldquoContactrdquo

Chaque membre de cette classe correspond agrave une rubrique du fichier de donneacuteesUn mapping permet au compilateur de faire le lien entre la rubrique et le membre de la classe (voir le paragraphe sur lrsquoattribut mapping page 29)

Identifiant est un entier sur 8 octets ltmapping = IDContactgtNom est une chaicircne ltmapping = NomContactgt

RemarquePour faciliter le deacuteveloppement de classes ldquomodegravelesrdquo lrsquoexemple dispose drsquoune classe CModegraveleBase qui correspond agrave un modegravele ldquogeacuteneacuteriquerdquo Cette classe modegravele dispose des meacutethodes pour bull ajouter un nouvel enregistrement dans le fichier de donneacuteesbull modifier un enregistrement existantbull lire des donneacutees

Code de la preacutesentationLa classe preacutesentation CPreacutesentationFiche-Contact repreacutesente lrsquoeacutedition drsquoun contact

50 - TDF Tech 2015 - wwwpcsoftfr

Cette classe preacutesentation connaicirct le modegravele gracircce agrave lrsquoattribut ldquoassocieacuterdquo

m_clContactCourant est unCModeleContact ltassocieacutegt

Cet attribut indique que tous les membres et les meacutethodes publiques de la classe asso-cieacutee (ici la classe CModegraveleContact) seront accessibles directement comme srsquoils eacutetaient des membres ou des meacutethodes publiques de la classe CPreacutesentationFicheContact

Cet attribut eacutevite drsquoeacutecrire de nombreuses et fastidieuses meacutethodes de rebond

Si un nouveau membre est ajouteacute agrave la classe CModegraveleContact il est directement accessible agrave travers la preacutesentation

Code de la vueDans la vue les champs sont relieacutes agrave des proprieacuteteacutes de la preacutesentation en utilisant le data binding

Mais comme le modegravele est associeacute agrave la preacute-sentation la liaison sur la proprieacuteteacute Nom (par exemple) rebondit directement sur la proprieacuteteacute Nom du modegravele

La vue dispose drsquoun traitement particulier ldquoDemande de mise agrave jour de lrsquoaffichagerdquo

Dans ce traitement la vue reacutealise le remplis-sage des champs (via la fonction WLangage SourceVersEcran dans notre exemple)

Mise agrave jour des champs lieacutes de la fenecirctreSourceVersEcran()

Ce traitement est appeleacute automatiquement lorsque la fonction WLangage DemandeMise-AJourIHM est appeleacutee dans la fenecirctre

Mais dans le cadre de lrsquoarchitecture MVP cette fonction doit forceacutement ecirctre appeleacutee dans une classe preacutesentation ou modegravele

Pour faire le lien entre une vue (ici la fenecirctre ldquoFEN_Fiche_Contactrdquo) et la classe preacutesenta-tion (ici CPresentationFicheContact) il est neacutecessaire drsquoutiliser lrsquoattribut preacutesentation

PROCEDURE FEN_Fiche_Contact( gpclFicheContact est un CPresentationFicheContact dynamique ltpreacutesentationgt)

RAD MVPAgrave partir de la version 200052 WINDEV met agrave votre disposition un RAD MVP

Ce RAD MVP permet de geacuteneacuterer automati-quement agrave partir drsquoun fichier de donneacutees les classes et fenecirctre adeacutequates

TDF Tech 2015 - wwwpcsoftfr - 51

APPLICATIONS TRANSPORTABLES(ldquoPORTABLESAPPSrdquo)

Une application transportable est une application qui peut ecirctre copieacutee sur une cleacute USB pour ecirctre utiliseacutee nrsquoimporte ougrave Avec WINDEV vous pouvez creacuteer ce genre drsquoapplication facilementAttention toutefois il y a quelques regravegles agrave respecter

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWD PortableApp TDF20rdquo (preacutesent sur le DVD)

Une application transportable crsquoest quoi Une application transportable (ou ldquoPortable-Appsrdquo) est une application que vous pouvez transporter facilement drsquoun ordinateur agrave un autre

Vous pouvez par exemple la copier sur une cleacute USB et lrsquoemporter avec vous

Pour qursquoune application soit dite ldquotranspor-tablerdquo elle doit respecter certaines regravegles bull aucune installationbull fonctionnelle  sur  toutes  les versions de Windowsbull meacutemorisation des donneacutees agrave cocircteacute de lrsquoappli-cationbull aucune modification du systegraveme sur lequel 

elle srsquoexeacutecute

Avec WINDEV creacuteer une application trans-portable est tout ce qursquoil y a de plus simple

Il suffit de faire attention aux 4 regravegles eacutenon-ceacutees

1 Aucune installationPour ecirctre consideacutereacutee comme transportable une application doit ecirctre capable de srsquoexeacutecuter directement sur lrsquoordinateur sans installation preacutealable

Avec WINDEV crsquoest le cas depuis toujours

Vous nrsquoavez pas besoin drsquoinstaller un fra-mework ou une machine virtuelle  lrsquoexeacutecutable et les DLL du framework WINDEV suffisent

En version 20 il est eacutegalement possible de geacuteneacuterer un exeacutecutable autonome tout le code neacutecessaire sera inteacutegreacute directement dans le fichier exeacutecutable (ldquoexerdquo)

Les exeacutecutables autonomes sont complets et precircts agrave lrsquoemploi ils nrsquoextraient pas de fichiers temporaires sur lrsquoordinateur

Pour creacuteer un exeacutecutable autonome dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoFrameworkrdquo choisissez ldquoFramework inteacutegreacute dans lrsquoexeacutecutablerdquo Et crsquoest tout

2 Fonctionnelle sur toutes les ver-sions de WindowsAvec WINDEV vous ecirctes tranquille agrave ce sujet  les applications WINDEV sont compatibles avec toutes les versions de Windows

Vous ne vous occupez de rien

3 Meacutemorisation des donneacutees agrave cocircteacute de lrsquoapplicationPour ecirctre transportable une application ne doit pas acceacuteder agrave des donneacutees de lrsquoordinateur (ce qui irait contre la 4egraveme regravegle)

Les donneacutees doivent donc ecirctre localiseacutees dans le mecircme emplacement que lrsquoexeacutecutable

Dans lrsquoassistant de creacuteation drsquoexeacutecutable eacutetape ldquoDonneacutees et groupwareldquo choisissez de creacuteer les fichiers de donneacutees dans le ldquoreacutepertoire de lrsquoapplicationrdquo

Attention il sera neacutecessaire de veacuterifier que votre application nrsquoutilise pas la fonction HChangeRep pour changer le reacutepertoire des fichiers et qursquoelle ne modifie pas non plus le reacutepertoire courant avec la fonction fRepEnCours

4 Aucune modification du systegravemeCette regravegle implique en particulier que lrsquoappli-cation ne doit pas eacutecrire dans le reacutepertoire du profil de lrsquoutilisateur ou dans la base de registre

Pour enregistrer la configuration de lrsquoappli-cation il est facile de se passer de la base de registre il suffit drsquoutiliser les fonctions SauveParamegravetre et ChargeParamegravetre

La localisation des paramegravetres manipuleacutes est

52 - TDF Tech 2015 - wwwpcsoftfr

deacutetermineacutee par la fonction InitParamegravetre

Il vous suffit drsquoindiquer avec InitParamegravetre que vous souhaitez sauver les informations dans un fichier XML (par exemple) qui sera sauveacute dans le reacutepertoire de lrsquoapplication (ou dans un sous-reacutepertoire)

Un composant interne pour vous aiderPour faciliter la transportabiliteacute drsquoune appli-cation  lrsquoexemple ldquoWD PortableApp TDF20rdquo met agrave disposition un composant interne ldquoPortableApprdquo

Ce composant interne surcharge plusieurs fonctions du WLangage pour respecter  la regravegle numeacutero 4 ne pas acceacuteder aux donneacutees du poste

Pour chaque fonction manipulant un chemin de fichier la fonction surchargeacutee redirige lrsquoappel sur un chemin interne agrave lrsquoapplication

Lrsquoarchitecture des donneacutees du composant (et donc de lrsquoapplication) est le suivant

[Dossier Application] [Data] (fRepDonneacutees HChangeRep ) [Registry] (RegistreXXX) [Config] (INILit INIEcrit InitParamegravetre)  [Global] [Common] (fRepGlobalCommun) [ltUsergt] (fRepGlobalUtilisateur) [Local] [Common] (fRepDonneacuteesCommun) [Temp] (fFichierTemp fOuvreFichierTemp fReacutepertoireTemp) [ltUsergt] (fRepDonneacuteesUtilisateur)

Lorsque vous avez termineacute votre application il peut ecirctre inteacuteressant de veacuterifier que votre application nrsquoaccegravede plus agrave des eacuteleacutements non deacutesireacutes

Il existe diffeacuterents outils qui permettent de surveiller les accegraves drsquoune applicationLrsquoun des plus connus est ProcessMonitor (procmonexe)Cet outil est disponible agrave cette adresse ldquohttpstechnetmicrosoftcomfr-frsysin-ternalsbb896645rdquo

Pour surveiller votre application avec ProcessMonitor 1 Filtrez les eacuteveacutenements de votre applica-tion uniquement deacuteplacez lrsquooutil ldquociblerdquo sur le titre de votre fenecirctre

2 Filtrez les types drsquoeacuteveacutenements base de registre et fichiers pour notre cas drsquoutilisation

3 Faites un nettoyage pour repartir drsquoune liste vierge (outil ldquoClearrdquo raccourci ldquoCtrl + Xrdquo)

4 Manipulez votre application

Les eacuteveacutenements de votre application cor-respondant aux types deacutefinis sont afficheacutes

Dans cette capture plusieurs opeacuterations sont probleacutematiques bull un fichier est creacuteeacute (ldquoCreateFilerdquo) et modifieacute (ldquoWriteFilerdquo) sur le poste (ldquoCTempTesttxtrdquo)bull une cleacute de registre est creacuteeacutee (ldquoRegCreateKeyrdquo)bull une valeur est modifieacutee (ldquoRegSetValuerdquo) dans la base de registre

Utiliser ProcessMonitor pour controcircler les accegraves drsquoune application

Ce type drsquoapplication peut eacutegalement ecirctre utiliseacute lors drsquoun transfert par FTP pour des applications sensibles ne devant pas ecirctre accessibles ou sur des ordinateurs ougrave les utilisateurs disposent de droits restreints

TDF Tech 2015 - wwwpcsoftfr - 53

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_TableaudeBord_TDF20rdquo (preacute-sent sur le DVD)

Certains points sont eacutegalement illustreacutes par lrsquoexemple  ldquoWW_TableaudeBordrdquo  (livreacute en standard)

Le champ Tableau de bord

PreacutesentationUn champ Tableau de bord permet de creacuteer facilement des tableaux de bord logiciels

Ces tableaux de bord sont geacuteneacuteralement utiliseacutes pour afficher les informations cleacutes drsquoun  Intranet ou drsquoun Extranet utiles aux deacutecisionnaires

Les informations sont afficheacutees dans des blocs appeleacutes ldquowidgetsrdquo

La position et les dimensions de chaque widget sont personnalisables par lrsquoutilisateur

final qui organise son tableau de bord comme il le souhaite

Il suffit pour cela de passer en mode eacutedition (via un clic sur le bouton associeacute au champ)

La disposition des widgets est appeleacutee ldquoConfigurationrdquo bull le positionnement au premier affichage du champ est la ldquoConfiguration initialerdquo

bull lrsquoutilisateur peut sauver et  recharger des configurations (voir le paragraphe ldquoGestion des configurationsrdquo)

ParameacutetrageLe champ Tableau de bord se deacutecoupe en cellules (ou zones) Attention de ne pas confondre avec la notion de cellules (champ) de WEBDEV

Chaque cellule deacutefinit la taille minimale alloueacutee agrave un widget Bien entendu les tailles des cellules et des marges entre chaque cellule sont parameacutetrables (onglet ldquoDeacutetailrdquo de la description du champ)

Ce quadrillage permet drsquoassurer au tableau de bord un rendu ergonomique plus agreacuteable

Plusieurs modes de preacutesentation sont dis-ponibles bull largeur des widgets variable (le nombre de widgets est fixe) Les widgets seront agrandis en fonction de la taille du navigateur si le champ est ancreacutebull nombre des widgets variable  (la  largeur des widgets est fixe) De nouvelles ldquocellulesrdquo

Eacutequivalent du champ Tableau de bord disponible dans WINDEV le champ Tableau de bord de WEBDEV reprend les mecircmes concepts mais adapteacutes au Web Ideacuteal pour avoir une vision globale ou syntheacutetique il va rapidement devenir INDISPENSABLE 

UN TABLEAU DE BORD DANS VOS SITES

54 - TDF Tech 2015 - wwwpcsoftfr

seront disponibles lors drsquoun agrandissement Lrsquoutilisateur pourra alors y positionner des widgetsbull largeur et nombre de widgets fixes

Dans lrsquoonglet ldquoDeacutetailrdquo de la description du champ lrsquooption ldquoMeacutemoriser la configuration des widgetsrdquo permet de meacutemoriser pour lrsquoutilisateur courant la configuration du champ agrave la fermeture de lrsquoapplication

Cette configuration sera alors automatique-ment rechargeacutee agrave la prochaine ouverture

Les widgetsTechniquement un widget est une page interne  Il est donc  tregraves simple drsquoen creacuteer ou mecircme de transformer une page interne existante en widget (il nrsquoy a rien agrave faire )

Notre astucePour optimiser lrsquoaffichage du tableau de bord pensez agrave creacuteer des widgets dont les dimensions sont un multiple de la cellule de reacutefeacuterence

Initialiser un tableau de bord

Widgets par deacutefautDans lrsquoonglet ldquoContenurdquo de la description du champ il est possible de deacutefinir les widgets preacutesents par deacutefaut

Pour chaque widget vous pouvez deacutefinir bull sa visibiliteacute initiale (visible par deacutefaut)bull ses dimensions (en nombre de cellules)bull sa position (en cellules)bull son  libelleacute Ce  libelleacute sera utiliseacute dans  le menu de lrsquoutilisateur final pour identifier les widgets agrave afficher

Si le widget ou plus preacuteciseacutement la page interne attend un paramegravetre obliga-toire il est neacutecessaire drsquoutiliser la fonction TDBConfigurationInitiale pour lrsquoajouter au lancement du tableau de bord

TDBConfigurationInitialeLa fonction TDBConfigurationInitiale per-met drsquoajouter des widgets agrave la configuration initiale

Cette fonction est utile bull pour ajouter un widget qui  attend des paramegravetresbull pour ajouter un widget sur une condition donneacutee (par exemple pour ajouter un widget uniquement si lrsquoutilisateur est commercial)

La fonction TDBConfigurationInitiale doit obligatoirement ecirctre utiliseacutee dans le traitement drsquoinitialisation du champ

Cette fonction srsquoutilise toujours avec la fonc-tion TDBAjouteWidget

Ajoute le widgetnIndice = TDBAjouteWidget( MoiMecircme FI_Widget_ChiffreCleacute

dDate) Configure le widgetTDBConfigurationInitiale( MoiMecircme nIndice 1 1)

Gestion des configurationsLa configuration initiale drsquoun champ Tableau de bord est agrave la charge du deacuteveloppeur

Mais bien souvent chaque utilisateur final va modifier cette configuration (deacuteplacement affichage etc) agrave sa guise pour avoir SON tableau de bord

La fonction TDBSauveConfiguration permet de reacutecupeacuterer la configuration courante sous forme de chaicircneCette chaicircne peut ensuite ecirctre meacutemoriseacutee dans un fichier ou en base par exemple

Reacutecupegravere la configuration courantesConfiguration = TDBSauveConfiguration( TDB_TableauDeBord) Sauve la configurationfSauveTexte(sFichier sConfiguration)

La fonction TDBChargeConfiguration per-met de recharger une configuration agrave partir drsquoune chaicircne

Retrouvez de nouvelles ambiances et des ideacutees drsquointerfaces dans chaque LST (par exemple un extrait de lrsquoambiance ldquo200 Furyordquo de la LST 100)

TDF Tech 2015 - wwwpcsoftfr - 55

3 Initialiser un widget neacutecessitant des paramegravetresSi un widget neacutecessite un ou plusieurs paramegravetres il suffit drsquoutiliser la fonction TDBAjouteWidget pour les fournir

nIndiceWidget est un entier Initialise et ajoute le widgetnIndiceWidget= TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires rdquoPrestatairesrdquo nIDProjetAffocheacute) Paramegravetre 1 Affiche le widgetTDB_PROJETS[nIndiceWidget]Visible = Vrai

2 Ajouter un widget par programmationLa fonction WLangage TDBAjouteWidget permet drsquoajouter un widget au champ en cours drsquoexeacutecution

Ajoute un widgetnIndice = TDBAjouteWidget( TDB_PROJETS PI_WidgetPrestataires)

Notre astuceUn widget ajouteacute par programmation est non visible par deacutefaut Il peut bien entendu ecirctre rendu visible par lrsquoutilisateur final via le menu contextuel en mode eacutedition Mais il est tout agrave fait possible drsquoafficher immeacutediatement le widget il suffit drsquoutiliser la proprieacuteteacute Visible

1 Personnaliser le bouton drsquoeacuteditionPar deacutefaut lors de la creacuteation drsquoun champ Tableau de bord un bouton est automatiquement creacuteeacute

Ce bouton permet agrave lrsquoutilisateur de passer en mode ldquoeacuteditionrdquo et drsquoindiquer le ou les widgets qursquoil veut afficher Ce bouton est alors ldquolieacuterdquo en terme de position au champ Tableau de bord

Pour des raisons pratiques ou estheacutetiques il est possible de creacuteer un bouton nrsquoimporte ougrave dans la page pour proposer le mecircme menu agrave lrsquoutilisateur il suffit drsquoindiquer lrsquoaction ldquoOuvrir le menu du tableau de bord rdquo comme action du bouton

Crsquoest termineacute  Cette fonctionnaliteacute est utiliseacutee dans la page ldquoPAGE_Tableau_de_bordrdquo de lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo

Le  champ  Tableau  de  bord  de WEBDEV peut  ecirctre  deacutefini  entiegraverement  en eacutedition dans la plupart des cas Il est cependant possible de le personnaliser preacuteciseacutement par programmationVoici 7 astuces agrave connaicirctre pour maicirctriser le champ Tableau de bord 

7 ASTUCES POUR MAIcircTRISER LE CHAMP TABLEAU DE BORD

56 - TDF Tech 2015 - wwwpcsoftfr

7 Actualiser un ou plusieurs widgetsCertains widgets peuvent afficher des donneacutees qui eacutevoluent et qui doivent donc ecirctre reacuteactualiseacutees

Pour geacuterer lrsquoactualisation drsquoun widget il suffit de remplir le traitement ldquoRafraicircchissement du widgetrdquo de la page interne Crsquoest ce code qui sera exeacutecuteacute lors de lrsquoappel agrave la fonction TDBAffiche

La fonction WLangage TDBAffiche permet de lancer le traitement drsquoactualisation sur la totaliteacute des widgets du champ ou une seacutelection Rafraicircchit tous les widgetsTDBAffiche(TDB_TableauDeBord)

6 Creacuteer une interface speacutecifique pour choisir les widgetsLors de la creacuteation drsquoun champ Tableau de bord un bouton ouvrant un menu contextuel est geacuteneacutereacute automatiquement

(voir astuce 1)

Il est cependant possible de reacutealiser une  interface entiegraverement speacutecifique gracircce aux fonctions de manipulation du champ Tableau de bord du WLangage TDBxxx et aux proprieacuteteacutes sur les widgets Affiche le widget 1 si la 1egravere option de lrsquointerrupteur est cocheacuteeTDB_PROJETS[1]Visible = INT_CHOIX_WIDGETS[1]

5 Ajouter une couleur de fond speacutecifique agrave un widgetLes widgets sont deacutefinis par des pages internes Les pages internes nrsquoont pas de couleur de fond speacutecifique puisqursquoelles

sont destineacutees agrave ecirctre reacuteutiliseacutees dans drsquoautres pages (elles utilisent la couleur de fond de leur champ support)

Dans le cas drsquoun widget la couleur de fond est elle aussi deacutefinie par le champ support le champ ldquoTableau de Bordrdquo (dans lrsquoonglet ldquoStylerdquo)

Cependant il est possible de reacutealiser des widgets avec des couleurs de fond speacutecifiques (comme dans lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo) en utilisant un champ Cellule dans la page interne (positionneacute en (00) et de mecircmes dimensions que la page interne)

4 Les widgets des pages internes comme les autres Lrsquoutilisation de pages internes comme support pour les widgets permet de les partager simplement entre projets

Mais cela permet eacutegalement de beacuteneacuteficier de toutes les fonction-naliteacutes des pages internes (traitement drsquoaffectation ou accegraves aux proceacutedures publiques)

Dans  lrsquoexemple ldquoWW_TableauDeBord_TDF20rdquo  le widget ldquoAgendardquo permet eacutegalement drsquoafficher la page ldquoPAGE_Agendardquo en mode plein eacutecran un exemple de personnalisation est reacutealiseacute dans la proceacutedure DeacutesactiveModeWidget (deacuteplacement ou affichage de champs etc) Modifie la couleur du libelleacute selon le modeLIB_AgendaCouleur = CouleurPalette(couleurTexteGeacuteneacuteral 1)

TDF Tech 2015 - wwwpcsoftfr - 57

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple  ldquoWW_Graphes_TDF20rdquo  (preacutesent sur le DVD)

Le champ Graphe de WEBDEV 20Le champ Graphe de WEBDEV 20 a subi une eacutevolution majeure puisque deacutesormais bull il beacuteneacuteficie drsquoun nouvel algorithme de rendu qui srsquoexeacutecute directement dans le navigateur les actions sont fluides et dynamiquesbull il peut ecirctre interactif  lrsquoutilisateur peut cliquer sur des portions sur la leacutegende changer le type de graphique etcbull il peut ecirctre animeacute  lors de sa construction ou du changement des donneacutees des animations sont deacuteclencheacutees entiegraverement geacutereacutees sur le navigateur (pas drsquoaccegraves au serveur)bull il est vectoriel   il peut ecirctre agrandi sans perte de qualiteacutebull il gegravere le survol  les valeurs survoleacutees ou des mires peuvent ecirctre afficheacutees pour ameacuteliorer

la lisibiliteacute des donneacuteesbull il dispose de nouvelles FAA (Fonctionnaliteacutes Automatiques de lrsquoApplication) masquer une seacuterie mettre en valeur une seacuterie de la leacutegende etc

Activer ces nouvelles fonctionnaliteacutes sur un graphe existantPar deacutefaut et pour des raisons eacutevidentes de compatibiliteacute lrsquoancien algorithme de rendu des graphes est conserveacute

Pour activer lrsquoensemble des nouvelles fonction-naliteacutes sur un champ Graphe existant il suffit drsquoactiver  lrsquooption ldquoGraphe interactifrdquo depuis lrsquoonglet ldquoDeacutetailrdquo de la fenecirctre de description du champ Graphe

Note si vous souhaitez beacuteneacuteficier des nou-veaux graphes mais sans animation deacutecochez simplement lrsquooption ldquoActiver les animationsrdquo

Creacuteer un graphe interactifLa creacuteation drsquoun champ Graphe  interactif srsquoeffectue comme la creacuteation drsquoun champ Graphe ldquonormalrdquo bull Drag amp Drop depuis le rubanbull lancement de lrsquoassistantbull saisie des informations  titre position drsquoune leacutegende etcbull choix du type de graphique Crsquoest le point important  veacuterifiez lrsquooption ldquoGraphe interactifrdquo

bull configuration des axes des seacuteries et des cateacutegories

Une fois le champ Graphe deacutefini il suffit de lrsquoalimenter en donneacutees  Ici encore crsquoest  le mecircme fonctionnement que dans les ver-sions preacuteceacutedentes et que dans WINDEV ou 

Reacutevolution complegravete du cocircteacute du champ Graphe de WEBDEV 20 

DES GRAPHES INTERACTIFS EN 1 CLIC

58 - TDF Tech 2015 - wwwpcsoftfr

WINDEV MOBILE

Astuce geacuterer une popup lors drsquoune rotation de grapheGracircce aux animations  les graphes de type ldquoSecteurrdquo ou ldquoBeignetrdquo peuvent tourner pour placer la cateacutegorie seacutelectionneacutee en bas

Gracircce agrave  la  fonction WLangage grInfoXY disponible en code navigateur dans WEBDEV 20 il est possible de reacutealiser une action contex-tualiseacutee lors du clic (traitement ldquoonclickrdquo)

nCategorieSelectionnee est un entier Reacutecupeacuteration de la cateacutegorie seacutelectionneacutee dans le graphenCategorieSelectionnee = grInfoXY( GRF_Hamburger grCateacutegorie SourisPosX() SourisPosY())

Par exemple pour afficher une page popup avec des informations sur le produit seacutelec-tionneacute Reacutecupeacuteration des ingreacutedients de cette cateacutegoriesListeIngredients est une chaicircne = AJAXExeacutecute( ajaxAppelSimple rdquoListeIngredientsrdquo nCategorieSelectionnee)

Est-ce qursquoil y a des ingreacutedients agrave afficher SI sListeIngredients = ldquordquo ALORS LIB_INGREDIENTSVisible = FauxSINON LIB_INGREDIENTS = sListeIngredients LIB_INGREDIENTSVisible = Vrai FIN

TDF Tech 2015 - wwwpcsoftfr - 59

Lrsquoappel de traitements serveur en mode AJAX permet de reacutealiser des sites Web capables de srsquoactualiser partiellement et ainsi drsquoavoir un comportement

proche drsquoune application Cette possibiliteacute est inteacutegreacutee depuis de nombreuses versions dans WEBDEV

WEBDEV 19 offrait une ameacutelioration impor-tante gracircce au traitement ldquoretour de trai-tement Ajaxrdquo pour geacuterer la mise agrave jour de lrsquoaffichage

WEBDEV 20 va plus  loin en proposant une solution transparente pour le deacuteveloppeur la possibiliteacute de mettre agrave jour TOUS les champs acceacutedeacutes lors drsquoun traitement ser-veur AJAX automatiquement sans traite-ment navigateur

Projet drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoWW_Astuces_TDF20rdquo (preacutesent sur le DVD)

Actualisation des champs lors drsquoun traitement AJAX

PrincipeLa fonction WLangage AjaxExeacutecute dispose agrave partir de la version 20 drsquoun nouveau paramegravetre permettant drsquoindiquer si la mise agrave jour des champs impacteacutes par le code serveur doit ecirctre effectueacutee ou non

Le premier paramegravetre de la fonction

AjaxExeacutecute permet deacutesormais drsquoutiliser les constantes bull ajaxAppelSimple (mode par deacutefaut) les champs modifieacutes ne sont pas actualiseacutes dans la pagebull ajaxActualiseChamps (nouveauteacute) les champs modifieacutes sont automatiquement actualiseacutes dans la page

Note par deacutefaut les champs ne sont pas actualiseacutes par compatibiliteacute avec le code existant

Mise en œuvreDans lrsquoexemple ldquoWW_Astuces_TDF20rdquo la page ldquoPAGE_AJAXActualiseChamprdquo affiche une liste de livres stockeacutee dans une base de donneacutees

Le bouton ldquoNouveaurdquo affiche une popup permettant la saisie drsquoun nouveau livre

Cette popup doit donc bull ajouter un livre dans la base de donneacuteesbull mettre agrave jour le contenu de la table avec le nouveau livre

Deux solutions sont alors possibles pour le deacuteveloppeur 1 Le bouton drsquoajout du livre dans la popup peut ecirctre un bouton ldquosubmitrdquo En cas de validation la page entiegravere sera demandeacutee au serveur et reacuteafficheacutee entiegraverement par le navigateurCette solution apporte des inconveacutenients temps de traitement effets drsquoaffichage selon la position de la page et temps de reacuteponse pouvant sembler ldquolongrdquo agrave lrsquoutilisateur Traitement de validationValidePopup()

Note le code serveur eacutetant ici en submit il nrsquoest pas neacutecessaire de passer en paramegravetre les champs qui sont directement accessibles dans la proceacutedure

2 Utiliser un appel AJAX avec actualisation du champ Table La popup devra alors ecirctre fermeacutee (cocircteacute navigateur donc immeacutediat) et seule la partie neacutecessaire de la table sera actualiseacutee (donc plus rapidement et sans effet de reacuteaffichage) Traitement de validation en AJAXAJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)

Rappel pour pouvoir appeler une proceacute-dure avec AJAX le deacuteveloppeur doit lrsquoavoir explicitement autoriseacute (en activant le bouton AJAX dans la barre de traitement) Crsquoest une question de seacutecuriteacute seules les proceacutedures preacutevues sont appelables en AJAX

Autre avantage de lrsquoappel AJAXEn reacutealisant le traitement dans un appel AJAX il est possible de geacuterer plus finement les cas drsquoerreurs

Dans lrsquoexemple ldquoWW_Astuces_TDF20rdquo le code de la proceacutedure ValidePopup est tregraves simple bull si  lrsquoajout reacuteussi  la proceacutedure actualise  le contenu du champ Table affiche un toast de confirmation et renvoie Vraibull si lrsquoajout eacutechoue la proceacutedure affiche sim-plement un toast et renvoie Faux

Lrsquointeacuterecirct suppleacutementaire est ici de pouvoir fermer la popup UNIQUEMENT si lrsquoajout a pu ecirctre effectueacute dans le cas contraire la popup reste ouverte pour que lrsquoutilisateur puisse modifier sa saisie SI AJAXExeacutecute( ajaxActualiseChamps ValidePopup SAI_Titre SAI_Auteur SAI_ISBN13)=Vrai ALORS PopupFerme()FIN

Simplifiez le dialogue avec lrsquoutilisateur et reacuteduisez les temps de reacuteponses gracircce agrave lrsquoactualisation automatique des champs apregraves un appel Ajax

ACTUALISER SIMPLEMENT DES CHAMPS APREgraveS UN APPEL AJAX

60 - TDF Tech 2015 - wwwpcsoftfr

N ouveauteacute  WEBDEV  20  incon-tournable pour les sites AWP  les sessions preacutelanceacutees Lrsquoutilisation des sessions preacutelanceacutees permet

drsquoacceacuteleacuterer lrsquoaffichage des pages en effec-tuant par anticipation des traitements longs (connexions aux bases de donneacutees charge-ment de configurations et de pages etc)Les sessions preacutelanceacutees fonctionnent de la mecircme maniegravere pour les sites classiques les sites AWP et mecircmes les services Web

Principe drsquoune requecircte sur une page AWPLorsqursquoun internaute effectue une requecircte sur une page AWP (mecircme un simple affichage de page) les opeacuterations suivantes sont reacutealiseacutees 1 la requecircte part du navigateur et est trans-mise au serveur Web2 le serveur Web analyse la requecircte et voit qursquoil srsquoagit drsquoune page WEBDEV3  le serveur Web transmet  la  requecircte au serveur drsquoapplication WEBDEV pour produire la page4 le serveur drsquoapplication WEBDEV charge le projet correspondant agrave la page5 le serveur drsquoapplication WEBDEV exeacutecute le code drsquoinitialisation du projet puis le code de la page et il retourne le tout au serveur Web6 le serveur Web renvoie le tout au navigateur

Pourquoi des sessions preacutelanceacutees Il  est  important  de  comprendre  dans  le scheacutema de cette page que chaque appel au serveur drsquoapplication WEBDEV est totalement 

indeacutependant

Donc agrave chaque requecircte (chaque change-ment de page chaque appel AJAX) le serveur drsquoapplication recharge le projet et reacuteexeacutecute le code drsquoinitialisation

Et souvent dans le code drsquoinitialisation du projet des opeacuterations ldquolonguesrdquo sont reacutealiseacutees bull la connexion agrave la base de donneacuteesbull le chargement des fichiers de configurationbull etc

Gracircce aux sessions preacutelanceacutees de WEBDEV 20 il est possible de demander au serveur drsquoappli-cation de faire toutes ces opeacuterations agrave lrsquoavance par anticipationLorsque la requecircte de lrsquointernaute arrive au serveur drsquoapplication tout est precirct pour la traiter le serveur drsquoapplication nrsquoa plus qursquoagrave exeacutecuter la requecircte et agrave renvoyer le reacutesultat

Mise en œuvre

Activer la deacutetection des erreurs speacutecifiquesWEBDEV dispose drsquoun mode de deacutetection et drsquoaffichage des erreurs speacutecifiques aux sessions preacutelanceacutees Ce mode peut ecirctre activeacute dans le volet des erreurs gracircce au bouton drsquoactivation ci-dessous

En effet certaines fonctions ne peuvent plus ecirctre traiteacutees au mecircme moment Lrsquoinitialisation du projet va ecirctre scindeacutee en deux eacutetapes bull lrsquoinitialisation avant lrsquoarriveacutee de la requecircte

bull la fin drsquoinitialisation qui neacutecessite le ldquocontenurdquo de la requecircte

Par exemple la fonction PageParamegravetre du WLangage nrsquoest pas autoriseacutee dans le traite-ment drsquoinitialisation des sessions preacutelanceacuteesEn effet comme ce traitement sera exeacute-cuteacute avant que la requecircte nrsquoarrive les paramegravetres de la page ne seront pas encore connus

La correction est geacuteneacuteralement toujours la mecircme et est tregraves simple deacuteplacer le code correspondant dans le nouveau traitement ldquoInitialisation du projet apregraves connexionrdquo (apparu en version 20)

Lorsque votre site est compatible avec le meacutecanisme de sessions preacutelanceacutees il est possible drsquoactiver celles-ci sur le serveur drsquoapplication WEBDEV

Activer les sessions preacutelanceacutees sur le serveur drsquoapplicationLrsquoactivation des sessions preacutelanceacutees srsquoeffectue dans lrsquoadministrateur WEBDEV par la coche ldquoAutoriser les sessions preacutelanceacuteesrdquo de lrsquoonglet ldquoConfigurationrdquo

Ensuite pour chaque site dans les proprieacute-teacutes du site il suffit drsquoindiquer le nombre de sessions preacutelanceacutees

Notre astuceLes sessions preacutelanceacutees sont compteacutes dans le nombre total de connexions au site Ne lrsquooubliez pas lorsque vous parameacutetrez le ser-veur drsquoapplication WEBDEV

DES SITES PLUS RAPIDES GRAcircCE AUX SESSIONS PREacuteLANCEacuteES

TDF Tech 2015 - wwwpcsoftfr - 61

3 Des effets automatiques sur les imagesWEBDEV dispose en standard de nombreux effets automa-tiques sur les images Ces effets peuvent ecirctre deacuteclencheacutes lors drsquoune transition (un changement drsquoimage) ou drsquoactions

speacutecifiques (comme le survol par exemple)

La deacutefinition de ces effets srsquoeffectue dans la fenecirctre de description du champ Image (35 effets proposeacutes en standard ) et il est possible de parameacutetrer chaque animation (dureacutee courbe drsquoacceacuteleacuteration ou autre paramegravetre)

Notre astuceGardez des animations assez courtes pour dynamiser les sites sans que lrsquoutilisateur ne trouve cela peacutenalisant ou ldquoexcessifrdquo

2 Changement dynamique de feuilles de styles CSSWEBDEV 20 permet de modifier la classe CSS drsquoun champpar programmation (par exemple si une feuille de styles

CSS est fournie par un graphiste ou importeacutee depuis un autre site)

Cette opeacuteration est possible gracircce agrave la proprieacuteteacute ClasseHTML du WLangage

Par exemple  la page ldquoPAGE_Classe_CSS_par_programmationrdquo de lrsquoexemple ldquoWW_Astuces_TDF20 ldquo propose un bouton permettant de changer la classe CSS drsquoun libelleacute Applique le style CSS ldquoTXT-Attention-3rdquo au champ ZTR_ExempleClasseHTML = ldquoTXT-Attention-3rdquo

1 Des formulaires originaux Des champs dans une zone de texte richeEn WEBDEV 20 les champs peuvent ecirctre inteacutegreacutes dans une 

zone de texte il est donc possible de creacuteer des formulaires ougrave les champs sont inteacutegreacutes dans le texte

Par exemple  la page ldquoPAGE_INSCRIPTIONrdquo de  lrsquoexemple ldquoWW_Astuces_TDF20rdquo propose un formulaire drsquoinscription contenu dans un seul bloc de texte riche

Rappel pour ajouter un champ dans une zone de texte riche il suffit de seacutelectionner ce champ dans le ruban et de le glisser dans le texte directement agrave lrsquoendroit souhaiteacute Ces champs restent entiegraverement modifiables et accessibles par programmation comme nrsquoimporte quel champ WEBDEV

Notre astuce en cas de reacuteduction de la largeur du navigateur le texte se reacuteduit lui aussi et les champs de saisie se replacent auto-matiquement

WEBDEV 20 5 ASTUCES RAPIDES Agrave METTRE EN ŒUVRE

62 - TDF Tech 2015 - wwwpcsoftfr

Champ Table ou champ Zone Reacutepeacuteteacutee Avec les colonnes ldquoconteneurrdquo le champ Table permet de nouvelles interfaces plus sophistiqueacuteesVoici un tableau reacutecapitulatif pouvant guider un deacuteveloppeur entre lrsquoutilisation drsquoun champ Table ou drsquoun champ Zone reacutepeacuteteacutee avec WEBDEV 20

5 Les colonnes conteneur simplifiez-vous le deacuteveloppementLa page ldquoPage_Tablesrdquo de lrsquoexemple ldquoWW_Astuces_TDF20rdquo contient un champ Table avec des colonnes ldquoconteneurrdquo

Ce nouveau type de colonne de WEBDEV 20 permet drsquoajouter dans une table tous les champs qui nrsquoexistent pas en tant que colonne ou de les placer librement une image plusieurs libelleacutes dont une zone de texte riche des liens De plus tous les avantages des tables sont conserveacutes tris automatiques recherche filtres exportshellip

Notre astucePour les tris les filtres et les recherches dans une colonne conteneur il suffit drsquoindiquer le champ agrave utiliser pour ces opeacuterations (option ldquoChamp principalrdquo onglet ldquoGeacuteneacuteralrdquo de la description de la colonne)

4 Des ruptures dans les tablesUne rupture est une seacuteparation qui se place entre plusieurs lignes de la table lorsqursquoune colonne change de valeurLes ruptures dans les tables peuvent ecirctre enrouleacutees ou deacuterou-

leacutees par programmation (fonctions TableEnroule TableDeacuteroule ) et par lrsquoutilisateur

Pour activer cette fonctionnaliteacute il suffit drsquoindiquer les colonnes de ruptures dans lrsquoonglet ldquoContenurdquo de la description du champ Table

Dans lrsquoeacutediteur la rupture est alors mateacuterialiseacutee par des bandeaux de haut et de bas de rupture dans lesquels des champs peuvent ecirctre utiliseacutes ldquocomme drsquohabituderdquo

Notre astuce la fonction WLangage TableIndiceRupture permet de reacutecupeacuterer lrsquoindice de la rupture pour acceacuteder agrave un champ de rupture par programmation

TDF Tech 2015 - wwwpcsoftfr - 63

LE CHAMP TABLE EN MOBILE

Le champ Table est un champ incontournable dans les applications WindowsEn version 20 les applications Android et iOS disposent drsquoun champ Table proposant les mecircmes fonctionnaliteacutes et la mecircme richesse que dans une application WINDEV

Toutes les FAA utilesLorsque lrsquoutilisateur appuie sur un titre de colonne une boicircte agrave outils apparaicirct et permet de bull trier la colonnebull effectuer une recherchebull effectuer un filtre

Lrsquoutilisateur peut eacutegalement bull redimensionner les colonnes au doigtbull seacutelectionner une ou plusieurs lignes

Style amp GabaritBien entendu le champ Table dispose de nom-breux styles pour chaque gabarit disponible

Et il est tout agrave fait possible de personnaliser chaque eacuteleacutement titre ligne paireimpaire etc

64 - TDF Tech 2015 - wwwpcsoftfr

Deacutefinir des sur-entecirctes de colonnesLes sur-entecirctes de colonnes permettent drsquoafficher un titre suppleacutementaire au-dessus du titre drsquoune ou plusieurs colonnes les regrou-pements ainsi obtenus ameacuteliorent la visibiliteacute geacuteneacuterale de la tablePour deacutefinir des sur-entecirctes dans la description de la table onglet ldquoDeacutetailrdquo cliquez sur le bouton ldquoEacutediter les sur-entecirctes de colonnesrdquo

Table meacutemoire table fichier Pour programmer le remplissage de la table vous avez le choix bull accegraves direct au fichier de donneacuteesbull fichier chargeacute en meacutemoirebull par programmation

Comme en WINDEV il est important de choisir lrsquooption de remplissage adapteacutee agrave la base de donneacutees (et crsquoest encore plus vrai en mobile)

1 Si la base de donneacutees est embarqueacutee sur la tablette vous pouvez faire un accegraves direct sans risque

2 Si vous acceacutedez agrave une base situeacutee sur un serveur HFSQL il faut tenir compte de la connexion reacuteseau 

En WiFi  lrsquoaccegraves direct est eacutegalement possible mais pour des questions de performances il peut ecirctre preacute-feacuterable drsquoutiliser un accegraves ldquoFichier chargeacute en meacutemoirerdquo Lrsquoapplication fera ainsi moins drsquoaccegraves au serveur

3 Si vous nrsquoavez pas accegraves au serveur de faccedilon permanente (comme crsquoest souvent le cas dans des applications industrielles si le bacirctiment est grand ou lrsquoenvironnement hostile) vous pouvez alors utiliser une base locale sur la tablette et installer une reacuteplication HFSQL avec le serveur

TDF Tech 2015 - wwwpcsoftfr - 65

1 Les agencements quelle utiliteacute Un agencement permet de deacutefinir plusieurs ldquovuesrdquo drsquoune mecircme fenecirctre sans dupliquer cette fenecirctre

Les agencements permettent de geacuterer tregraves facilement bull les diffeacuterentes reacutesolutions tablette et teacuteleacutephonebull les diffeacuterences entre les systegravemes drsquoexploitation Android iOS  Windows Phone  Windows Store Appsbull les diffeacuterences entre les modes portrait et paysage

Crsquoest donc une fonctionnaliteacute incontournable dans lrsquounivers heacuteteacute-roclite de la mobiliteacute

2 Deacutefinir un nouvel agencementPour ajouter un agencement agrave une fenecirctre existante sous le volet ldquoFenecirctrerdquo groupe ldquoAgencementsrdquo deacuteroulez ldquoAgencementsrdquo et seacutelectionnez ldquoAjouter des agencementsrdquo

La fenecirctre drsquoajout drsquoagencements affiche alors bull agrave gauche tous les types drsquoagencement possibles en fonction des plateformes et configurations du projetbull agrave droite la liste des agencements deacutefinis dans la fenecirctrebull en bas un aperccedilu de la seacutelection courante

Notre conseilNe tombez pas dans le piegravege du ldquosur-agencementrdquo Preacutevoyez des agencements basiques et eacutevidents (tablette teacuteleacutephone Android iOS) Dans la plupart des cas les ancrages suffisent agrave geacuterer les diffeacuterents cas de mise en page (voir point 6)

3 Passer en mode ldquoDouble vuerdquoUne fonctionnaliteacute tregraves utile lorsque vous utilisez des agen-cements crsquoest lrsquoeacutedition en mode ldquodouble vuerdquo cela permet de voir simultaneacutement 2 agencements

Ainsi quand vous eacuteditez un nouvel agencement il est possible de le voir en parallegravele drsquoun existant vous pouvez voir rapidement quelles proprieacuteteacutes doivent ecirctre dissocieacutees

Pour activer la double vue ouvrez le menu contextuel (clic droit) sur un agencement non afficheacute et seacutelectionnez lrsquooption ldquoActiver (double vue)rdquo

Les agencements permettent en quelques clics de deacutefinir plusieurs ldquomises en pagerdquo pour vos IHM mobilesAgrave  lrsquoexeacutecution  WINDEV  Mobile  utilise  automatiquement  lrsquoagencement  le plus adapteacute au peacuteripheacuterique drsquoexeacutecution en fonction de la reacutesolution de lrsquoorientation et du systegraveme drsquoexploitation

LES AGENCEMENTS

66 - TDF Tech 2015 - wwwpcsoftfr

4 Dissocier les positionsPar deacutefaut si vous modifiez la position ou les dimensions drsquoun champ cette modification est reacutepercuteacutee dans tous les agencements

Si vous souhaitez faire une modification propre agrave lrsquoagencement courant il est neacutecessaire de dissocier les proprieacuteteacutes du champ

Pour cela ouvrez le menu contextuel du champ deacuteroulez le sous-menu ldquoAgencementrdquo et choisissez lrsquooption de dissociation adeacutequate il est possible de dissocier position taille ancrage et style

Il est eacutegalement possible de modifier la visibiliteacute drsquoun champ

5 et les stylesLa dissociation de styles permet de proposer un look speacute-cifique notamment entre les diffeacuterents systegravemes (Android iOS)

La dissociation des styles permet par exemple de choisir une police de caractegraveres diffeacuterente entre Android et iOS

Depuis la version 20 vous pouvez en effet adapter la police au systegraveme il est possible drsquoutiliser pour chaque systegraveme des polices connues et preacutesentes sur le systegraveme

6 Ne pas neacutegliger les ancragesSi les agencements permettent de proposer des mises en forme adapteacutees il est indispensable de deacutefinir des ancrages

Comme indiqueacute preacuteceacutedemment preacutevoir un agencement pour chaque peacuteripheacuterique sur le marcheacute est contre-indiqueacute (en plus drsquoecirctre tregraves long cela complique la maintenance)

Les ancrages permettent drsquoadapter les champs (position et dimensions) aux diffeacuterentes reacutesolutions pour un mecircme agencement

Par exemple un agencement ldquoAndroid Teacuteleacutephonerdquo avec des ancrages bien penseacutes permettra de geacuterer tous les teacuteleacutephones Android du marcheacute

7 Code tenir compte des agencementsPar deacutefaut le code exeacutecuteacute est bien entendu identique quel que soit lrsquoagencement en cours

Le WLangage propose cependant des fonctions speacutecifiques aux agencements bull FenAgencementEnCours permet de connaicirctre lrsquoagencement en cours drsquoexeacutecution Cela permet de lancer un traitement speacutecifique pour cet agencementbull FenChangeAgencement permet de changer lrsquoagencement cou-rant Un exemple drsquoutilisation de cette fonction est disponible dans la LST 98 (exemple ldquoWM Utilisation Agencementrdquo)

TDF Tech 2015 - wwwpcsoftfr - 67

NOUVEAUTEacuteS MOBILES

Mise en place du ldquopull to refreshrdquo utilisation du ldquoTouch IDrdquo deacuteseacuterialisation de contenu JSON Voici quelques-unes des nouveauteacutes mobiles de la version 20

Projets drsquoillustrationLe projet utiliseacute pour illustrer ce sujet est lrsquoexemple ldquoiOS Catalogue Produit TDF20rdquo (preacutesent sur le DVD)

Lrsquoexemple ldquoWW_Serveur_Catalogue_Produit_TDF20rdquo (preacutesent sur le DVD) correspond agrave un service simplifieacute de type REST qui permet de reacutecupeacuterer les produits Ce service est utiliseacute par lrsquoapplication iOS pour lister les produits

Pour utiliser lrsquoexemple iOS vous devez avoir lanceacute une premiegravere fois lrsquoexemple WEBDEV

Touch ID (iOS)Le ldquoTouch IDrdquo permet agrave une application de veacuterifier lrsquoidentiteacute de lrsquoutilisateur gracircce agrave son empreinte digitale

La fonctionnaliteacute ldquoTouch IDrdquo est speacutecifique aux iPhones 5S (et supeacuterieurs) et est disponible agrave partir de la version 80 de iOS

Si vous souhaitez utiliser cette fonctionnaliteacute vous devez compiler votre projet avec la ver-sion 6 de XCode (ou une version supeacuterieure)

La  fonction WLangage VeacuterifieIdentiteacute-Utilisateur permet drsquoutiliser  le ldquoTouch IDrdquo pour veacuterifier lrsquoidentiteacute de lrsquoutilisateur avant de lancer un traitement

Cette fonction est asynchrone elle rend la main directement agrave lrsquoapplication et elle appelle une proceacutedure callback pour indiquer le reacutesul-tat de la veacuterification

Lance la veacuterification de lrsquoidentiteacute de lrsquoutilisateurVeacuterifieIdentiteacuteUtilisateur( ldquoVeacuterification de lrsquoidentiteacuterdquo RetourVeacuterificationIdentiteacute)

Agrave lrsquoappel de cette fonction le teacuteleacutephone pro-posera agrave lrsquoutilisateur drsquoapposer son doigt pour controcircler son identiteacute

La proceacutedure callback (ici  RetourVeacuterification-Identiteacute) attend deux paramegravetres bull lrsquoeacutetat de lrsquoauthentificationbull le message drsquoerreur eacuteventuel

PROCEDURE RetourVeacuterificationIdentiteacute( nEtat est un entier sMessage est une chaicircne = ldquorrdquo)

Lrsquoeacutetat de lrsquoauthentification correspond agrave une des constantes suivantes bull viuAuthentificationIndisponible si la fonctionnaliteacute drsquoauthentification est indispo-nible ou deacutesactiveacutee par lrsquoutilisateurbull viuAuthentificationManuelle si lrsquoutilisa-teur a demandeacute agrave srsquoauthentifier en utilisant un mot de passebull viuAuthentifieacute si lrsquoauthentification est correcte

bull viuEchecAuthentification si lrsquoauthentifi-cation a eacutechoueacute

Authentification correcteSI nEtat = viuAuthentifieacute ALORS Ouverture de la fenecirctre ou lancement drsquoun processus FIN

Notre astuceLa fonction WLangage EnModeSimulateur permet de savoir si lrsquoexeacutecution a lieu en mode simulateur ou en mode reacuteel

Elle vous permet de geacuterer des cas particulierspar exemple lrsquoaccegraves agrave des peacuteripheacuteriques du terminal comme ici le lecteur drsquoempreinte

Cela permet par exemple drsquoappeler directe-ment la callback en indiquant une authenti-fication manuelle

En mode simulateur passe par une authentification manuelleSI EnModeSimulateur() ALORS RetourVeacuterificationIdentiteacute( viuAuthentificationManuelle)SINON Veacuterification par ldquoTouch IDrdquo VeacuterifieIdentiteacuteUtilisateur([])FIN

Menu contextuelUn menu contextuel permet aux utilisateurs drsquoacceacuteder plus facilement aux fonctionnaliteacutes speacutecifiques drsquoune fenecirctre ou drsquoun champ drsquoune fenecirctre

68 - TDF Tech 2015 - wwwpcsoftfr

Pour creacuteer un menu contextuel sous le volet ldquoFenecirctrerdquo dans le groupe ldquoBarres et menusrdquo deacuteroulez ldquoMenus contextuelsrdquo et seacutelectionnez ldquoNouveau menu contextuelrdquo

Pour deacutefinir les options il suffit drsquoouvrir le menu contextuel (clic droit) Vous pourrez alors bull ajouter une option (avant ou apregraves lrsquooption cliqueacutee)bull inseacuterer un seacuteparateurbull creacuteer un sous-menu

Pull to refreshLa fonctionnaliteacute ldquoPull to Refreshrdquo permet agrave lrsquoutilisateur de rafraicircchir le contenu drsquoun champ Table ou Zone reacutepeacuteteacutee simplement en ldquotirantrdquo le champ vers le bas

Une jauge srsquoaffiche indiquant que le rafraicirc-chissement est en cours puis le champ est mis agrave jour

Pour activer cette fonctionnaliteacute sur un champ il suffit de cocher lrsquooption ldquoTirer pour rafraicircchirrdquo dans la description du champ onglet ldquoDeacutetailrdquo

Pour rafraicircchir le contenu drsquoun champ lors drsquoun ldquopull to refreshrdquo il est neacutecessaire de saisir le code de rafraicircchissement dans le trai-tement ldquoRafraicircchissement par TirerRelacirccheacuterdquo du champ

Notre astuceVous pouvez personnaliser entiegraverement les informations afficheacutees pendant le ldquopull to refreshrdquo (texte jauge flegraveche ) il suffit pour cela drsquoutiliser une fenecirctre interne

Sous la coche ldquoTirer pour rafraicircchirrdquo deacuteroulez lrsquooption ldquoFenecirctrerdquo et choisissez ldquoFenecirctre preacute-deacutefinierdquo la fenecirctre interne utiliseacutee par deacutefaut par WINDEV Mobile (ldquoFI_PULL_TO_REFRESHrdquo) est ajouteacutee au projet

Tout le code est situeacute dans la fenecirctre et les diffeacuterents champs sont positionneacutes sur dif-

feacuterents plans

Deacuteseacuterialisation JSONDans notre exemple ldquoiOS Catalogue Produit TDF20rdquo la zone reacutepeacuteteacutee a comme source de donneacutees un tableau de structures STProduit

STProduit est une Structure nIDProduit est un entier sImage est une chaicircne sNom est une chaicircne moPrix est un moneacutetaire nQuantiteacuteEnStock est un entier bEnStock est un booleacuteenFIN

gtabProduits est un tableau de STProduit

Dans le traitement ldquoRafraicircchissement par tirerrelacirccherrdquo le code est le suivant

Affiche le bandeau de rafraicircchissementZoneReacutepeacuteteacuteeRafraicircchissementVisible(ZR_Produits Vrai) Rafraicircchit le catalogueRafraicircchitCatalogue()

La fonction WLangage ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible permet drsquoafficher le ban-deau de rafraicircchissement automatique (zone qui affiche le contenu de la fenecirctre interne lors drsquoun ldquopull to refreshrdquo)

La proceacutedure RafraicircchitCatalogue va reacutecu-peacuterer les donneacutees depuis le serveur (via la fonction HTTPRequecircte) puis va deacuteseacuteriali-ser les donneacutees reccedilues dans le tableau des produits

Deacuteseacuterialisation du buffer JSONDeacuteseacuterialise(gtabProduits bufResultat psdJSON)

Pour mettre agrave jour le champ Zone reacutepeacuteteacutee il suf-fit drsquoutiliser la fonction ZoneReacutepeacuteteacuteeAffiche

Enfin une fois le rafraicircchissement termineacute le bandeau de rafraicircchissement est cacheacute tou-jours avec la fonction ZoneReacutepeacuteteacuteeRafraicirc-chissementVisible

Exeacutecution asynchronePour eacuteviter de figer lrsquoapplication le temps de reacutecupeacuterer les produits depuis le serveur la requecircte HTTP est exeacutecuteacutee en asynchrone (via la proceacutedure HTTPRequecircteAsynchrone) Requecircte au serveur HTTPRequecircteAsynchrone est parameacutetreacutee pour ecirctre exeacutecuteacutee dans un threadHTTPRequecircteAsynchrone( URL_Serveur + [ldquordquo] + URL_Catalogue FEN_PrincipaleCB_RafraicircchitCata-logue)

1 La requecircte HTTP est exeacutecuteacutee dans un thread ce qui ne bloque pas lrsquoutilisateur qui peut continuer drsquoutiliser lrsquoapplication Exeacutecute la requecircte HTTPHTTPRequecircte(sURL)

2 Lorsque le reacutesultat de la requecircte HTTP est reacutecupeacutereacute une proceacutedure callback est appeleacutee Cette proceacutedure reccediloit en paramegravetre le reacutesultat de la requecircte Crsquoest cette proceacutedure callback qui reacutealise le rafraicircchissement Exeacutecute la proceacutedure callback dans le thread principalExeacutecuteThreadPrincipal( pCallback HTTPDonneReacutesultat() Faux ldquordquo)

TDF Tech 2015 - wwwpcsoftfr - 69

RAD MOBILE CREacuteATION DrsquoUNE TABLE ET DrsquoUNE FICHE

Les fenecirctres RAD permettent de creacuteer en quelques clics des fenecirctres fonctionnelles pour vos applications Android et iOS disposant drsquoune analysePlusieurs types de fenecirctres RAD sont disponibles fiche (avec ou sans image) table zone reacutepeacuteteacutee etc Il suffit de suivre lrsquoassistant 

1 Agrave la demande de creacuteation drsquoune nouvelle fenecirctre si votre projet comporte une analyse plusieurs types de fenecirctres ldquoRAD fenecirctres pour ltteacuteleacutephone etou tablettegtrdquo vous sont proposeacutes (en fonction de la plateforme drsquoexeacutecution)

Commenccedilons par creacuteer une fenecirctre ldquotablerdquo

Un assistant se lance

Seacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo par exemple) puis choisissez les rubriques de ce fichier agrave afficher dans la table (ldquonomrdquo ldquopreacutenomrdquo ldquosocieacuteteacuterdquo )

Vous pouvez ensuite ajuster la largeur des colonnes directement dans lrsquoassistant en ayant une ideacutee du rendu selon lrsquoorientation du peacuteripheacuterique (portrait ou paysage)

2 Lrsquoassistant de creacuteation drsquoune fenecirctre propose ensuite diverses options de geacuteneacuteration

Il est possible de bull afficher un bouton ldquo+rdquo dans lrsquoAction Bar de la fenecirctre 

Crsquoest utile par exemple pour ouvrir la fenecirctre de saisie drsquoun nouveau client

bull activer  le ldquoPull  to refreshrdquo (ldquoTirer pour rafraicircchirrdquo en franccedilais) Cela permet de rafraicircchir le contenu de la table par un simple mouvement du doigt

bull autoriser  la suppression drsquoenregistrement par balayage de  la ligne de la table avec le doigt Il srsquoagit une fonctionnaliteacute standard de WINDEV Mobile qui offre une IHM intuitive

bull personnaliser le traitement de seacutelection drsquoune ligne pour ouvrir la fiche en saisie en affichage ou pour ne rien faire du tout

3 Et voilagrave Notre table est creacuteeacutee en quelques clics

Selon le parameacutetrage demandeacute il est possible que des erreurs soient preacutesentes il srsquoagit des codes drsquoouverture de la fenecirctre fiche qui ont eacuteteacute

automatiquement geacuteneacutereacutes alors que la fenecirctre fiche nrsquoa pas encore eacuteteacute creacuteeacutee

Notre astuceSi vous devez creacuteer les fenecirctres ldquotablerdquo et ldquoficherdquo drsquoun mecircme fichier conservez le nom de la fenecirctre proposeacutee par deacutefaut par lrsquoassistantLes erreurs apparues en creacuteation de la fenecirctre ldquotableldquo seront ainsi automatiquement corrigeacutees en creacuteation de la ldquoficherdquo

70 - TDF Tech 2015 - wwwpcsoftfr

4 Creacuteons maintenant ensemble la fenecirctre ldquoficherdquoNous souhaitons avoir une fiche en saisie et notre fichier ldquoClientrdquo comporte une photo le choix le plus eacutevident est donc le type ldquoImage + Fiche en saisierdquo

De la mecircme maniegravere que pour la table un assistant se lanceSeacutelectionnez le fichier de donneacutees agrave afficher (ldquoclientrdquo dans notre cas)

Le RAD Mobile propose plusieurs preacutesentations pour lrsquoentecircte de la fiche bull sans image avec les libelleacutes centreacutes dans la fenecirctrebull avec une petite image agrave gauche et les libelleacutes agrave droitebull avec une grande image prenant toute la largeur et sans libelleacutes

Choisissons lrsquoimage avec le libelleacute agrave droite (2e choix)

5 Lrsquoeacutecran suivant permet de parameacutetrer les rubriques agrave utiliser pour remplir lrsquoentecircte

WINDEV Mobile deacutetecte automatiquement les rubriques les plus approprieacutees mais vous pouvez bien entendu

les modifier

Dans notre exemple bull lrsquoimage est remplie agrave partir de la rubrique Photobull les libelleacutes sont remplis agrave partir des rubriques Nom et Preacutenom

Vous pourrez ensuite deacutefinir les rubriques agrave afficher en dessous de lrsquoentecircte lrsquoadresse (adresse code postal ville) les informations teacuteleacutephoniques etc

6 Lrsquoassistant vous permet ensuite de choisir entre une preacutesentation traditionnelle des champs de saisie (avec un libelleacute agrave gauche de la zone de saisie) ou une mise en forme plus actuelle avec le libelleacute en texte drsquoindication dans la zone de saisie

Cette mise en forme est beaucoup plus adapteacutee pour les smart-phones ougrave la surface drsquoaffichage est plus reacuteduite

Remarque cette meacutethode drsquoaffichage (texte drsquoindication aucun libelleacute) peut ecirctre utiliseacutee pour vos applications WINDEV et WEBDEVCela permet drsquoalleacuteger consideacuterablement lrsquoIHM

7 Et (re)voilagrave Notre fiche est creacuteeacutee et est directement accessible depuis la table creacuteeacutee preacuteceacutedemment

Notre astucePour la modification du champ Image le RAD a automatiquement geacuteneacutereacute un 

code de modification fonctionnel pour lrsquoexeacutecution qui utilise la fonction AlbumSeacutelecteur Cependant en simulateur cette fonction nrsquoest pas utilisable Il est donc possible drsquoadapter le code du bouton de modification comme suit Seacutelection drsquoune image dans la galeriesCheminImage est une chaicircneSI EnModeSimulateur()=Faux ALORS sCheminImage = AlbumSeacutelecteur(albumImage)SINON sCheminImage = fSeacutelecteurImage(ldquordquo ldquordquo ldquordquo)FINSI sCheminImageltgtrdquordquo ALORS [] SI EnModeSimulateur()=Faux ALORS fSupprime(sCheminImage)FIN

La fonction fSeacutelecteurImage est deacutetecteacutee comme non disponible en Android aucun souci cette fonction ne sera jamais appeleacutee lors de lrsquoexeacutecution Android

TDF Tech 2015 - wwwpcsoftfr - 71

AU SOMMAIRE DE LA LST 100

bull Programmation asynchrone sous Windows Android et iOSbull Geacuteneacuterer des cachets (texte circulaire) dans un eacutetatbull Utiliser des onglets ldquoinvisiblesrdquo pour geacuterer des plans partielsbull Des gabarits et ambiances (et leurs palettes de couleurs)bull Les rubriques ldquoQuestions amp Reacuteponsesrdquo et ldquoLe Saviez-Vous rdquobull  et encore beaucoup drsquoautres sujets 

Pas encore abonneacute Crsquoest le moment

72 - TDF Tech 2015 - wwwpcsoftfr

ABONNEZ-VOUS 

PROGRAMME EXEMPLE deacutesigne tout logiciel source fourni avec la LST et en particulier celui qui inclut ce texte

Le PROGRAMME EXEMPLE est fourni dans un but didactique

Lrsquoutilisation de ce programme srsquoeffectue sous lrsquoentiegravere responsabiliteacute de son uti-lisateur La responsabiliteacute de PC SOFT ne pourra en aucun cas ecirctre mise en cause si le PROGRAMME EXEMPLE ne fonctionne pas tel que vous lrsquoattendez ou pour quelque raison que ce soit

Tout deacutetenteur drsquoune licence WINDEV 20 etou WEBDEV 20 etou WINDEV Mobile 20 enregistreacutee peut utiliser etou modifier ce PROGRAMME EXEMPLE en respectant les conditions suivantes bull Les PROGRAMMES EXEMPLE peuvent ecirctre inclus dans des applications sauf mention contraire dans lrsquoarticle de preacutesentation etou le programme fournibull Toute mention se rapportant agrave PC SOFT ou agrave WINDEV ou agrave WEBDEV devra ecirctre supprimeacutee afin qursquoaucun doute ne puisse subsister dans lrsquoesprit drsquoun utilisateur final

bull Si les applications sont destineacutees exclusi-vement agrave un usage interne au site physique de la socieacuteteacute abonneacutee agrave la LST il nrsquoy a pas de contrainte particuliegravere agrave lrsquoutilisa-tion du PROGRAMME EXEMPLE dans les applicationsbull Si le PROGRAMME EXEMPLE est destineacute agrave ecirctre diffuseacute agrave titre gratuit ou payant par quel que moyen que ce soit ce PROGRAMME EXEMPLE doit ecirctre inclus dans une application dont 90 au moins des fonctionnaliteacutes de cette application est constitueacutee drsquoeacuteleacutements autres que des PROGRAMMES EXEMPLE provenant drsquoune LST

Il est donc interdit par exemple de modifier leacutegegraverement un PROGRAMME EXEMPLE et de le diffuser Il est interdit de copier le contenu de cette LST en partie ou en totaliteacute par quelque moyen que ce soit et quel que soit le but Il est interdit de dupliquer etou diffuser etou transmettre toute ou partie du CD DVD

Une LST est destineacutee agrave lrsquousage unique de la personne qui y est abonneacutee

Il est interdit de precircter louer ou vendre ldquola LSTrdquo (CD et ou magazine) Il est interdit de diffuser par quelque moyen que ce soit les codes sources accompagnant une LST

Le suppor t technique pour ce PROGRAMME EXEMPLE est accessible agrave travers le service lsquolsquoAssistance Directerdquo uniquement Malgreacute les soins appor-teacutes agrave sa reacutedaction ce document nrsquoest pas contractuel Les copies drsquoeacutecran sont indicatives PC SOFT se reacuteserve le droit drsquoameacuteliorer et de modifier ses produits agrave tout moment

LICENCE LST

L15112Tarif modifiable sans preacuteavis

Bulletin drsquoabonnement agrave retourner avec votre regraveglement agrave

PC SOFTLettre du Support TechniqueBP 44 40834197 MONTPELLIER Cedex 05France

En cas de paiement par carte bancaire vous pouvez nous faxer votre abonne-ment au +33 (0) 4 67 03 07 87

Je choisis un abonnement ldquoLST PC SOFTrdquo pour

FRANCE Meacutetropolitaine 1 an - 4 Ndeg+ 4 DVD 159 euros HT 19080 euros TTC 2 ans - 8 Ndeg+ 8 DVD 279 euros HT 33480 euros TTC

AUTRE (exp par avion) 1 an - 4 Ndeg+ 4 DVD 175 euros HT 2 ans - 8 Ndeg+ 8 DVD 299 euros HT

Je regravegle par chegraveque Jrsquoautorise PC SOFT agrave deacutebiter sur ma carte VISAMasterCard la somme de Euros Je regravegle par Carte Bancaire Cryptogramme Numeacutero complet de la carte la carte expire mois anneacutee Signature obligatoire du deacutetenteur de la carte Nom du deacutetenteur de la carte

Vos Nom amp Preacutenom Votre Socieacuteteacute Votre Adresse preacutecise Code Postal Ville Pays Tel Adresse Email

Agrave partir du numeacutero

Ci joint mon regraveglement de Euros TTC Note une facture acquitteacutee est systeacutematique-ment adresseacutee

Restez informeacutesFournissez votre email et recevez des informations reacuteguliegraveres en plus de la LST

La LST fournit tous les trimestres des informations mises agrave jour et trucs et astuces sur les diffeacuterents produits PC SOFTPour obtenir automatiquement des informations entre deux LST fournissez votre adresse email agrave PC SOFT Vous serez ainsi reacuteguliegraverement preacutevenu bull des nouvelles versions disponibles en teacuteleacutechargementbull des nouvelles FAQ disponibles sur le site de PC SOFTbull

Nrsquoheacutesitez pas agrave envoyer un email agrave PC SOFT (pcsoftpcsoftfr) pour indi-quer vos coordonneacutees eacutelectroniquesVotre adresse email ne sera utiliseacutee que par PC SOFT

TDF Tech 2015 - wwwpcsoftfr - 73

74 - TDF Tech 2015 - wwwpcsoftfr

Annexes

TDF Tech 2015 - wwwpcsoftfr - 75

Le GDS est un gestionnaire de sources eacutelaboreacute qui permet de sauvegarder les sources les historiques les versions Cet outil dispose de nombreuses fonctionnaliteacutes avanceacutees et tregraves utiles mais parfois meacuteconnuesVoici 8 points importants agrave propos du GDS

LE GDS PRENEZ SOIN DE VOS SOURCES

1 Le GDS  rappels

2 LrsquoAdministrateur du GDS  lrsquooutil indispensable

Le GDS permet de sauvegarder dans une base de sources tous les eacuteleacutements de vos projets proceacutedures classes fenecirctres pages eacutetats composants analyses

Cette base peut ecirctre installeacutee bull sur un serveur (en mode HFSQL Classic ou HFSQL ClientServeur)bull sur un poste du reacuteseau dans un reacutepertoire partageacutebull dans  le cloud des applications PC SOFT (PCSCloud) Pour plus drsquoinformations consul-tez le site ldquowwwpcscloudnetrdquo

Le GDS permet un fonctionnement connecteacute en local et agrave distance (via Internet)Il est ainsi possible de travailler sur un pro-jet depuis une agence ou depuis un site client sans crainte de perte des modifications effectueacutees

Le GDS permet eacutegalement un fonctionnement deacutecon-necteacute (train avion )

Principe drsquoutilisationInstallationTous les eacuteleacutements du projet sont enregistreacutes dans la base de sources (sur le serveur)Cette opeacuteration est effectueacutee agrave la creacuteation du projet ou lors de lrsquoimportation drsquoun projet existant dans le gestionnaire de sources

Chaque deacuteveloppeur utilisant le gestionnaire de sources reacutecupegravere une copie du projet en local

UtilisationPour travailler sur un eacuteleacutement du projet (fenecirctre page ) le deacuteveloppeur doit extraire

lrsquoeacuteleacutement de la base de sources le modifier puis le reacuteinteacutegrer

Pour profiter des modifications effectueacutees les autres deacuteveloppeurs doivent synchroniser leur projet local avec le projet de reacutefeacuterence (preacutesent dans la base de sources)

Lrsquoadministrateur du GDS permet de manipuler les projets (et leurs sources) directement

Cet outil permet de bull geacuterer les branches drsquoun projetbull geacuterer les fichiers et les reacutepertoires preacutesents dans un projet de la base de sources (ajouter supprimer renommer des fichiers et des reacutepertoires)bull geacuterer  les diffeacuterents fichiers de  la base de sources (extraction reacuteinteacutegration partage )bull lancer des outils de maintenances ou drsquoadmi-nistrationbull 

Lrsquoadministrateur du GDS permet notamment de geacuterer les droits des utilisateurs sur les eacuteleacutements du GDS (voir point 3 de cet article)

76 - TDF Tech 2015 - wwwpcsoftfr

3 La gestion des droits utilisateurs proteacutegez lrsquoaccegraves agrave vos sources

4 La politique de reacuteinteacutegration garantissez un code fonctionnel

La gestion des droits drsquoaccegraves aux eacuteleacutements du GDS permet de limiter les accegraves (et donc les modifications) pour chaque deacuteveloppeur et pour chaque eacuteleacutement du GDS

Un droit est associeacute bull agrave un compte de connexion (un deacuteveloppeur)bull agrave un groupe (uniquement si la base du GDS est en mode ClientServeur)

Il est possible de deacutefinir des droits bull sur un reacutepertoirebull sur un fichier

La gestion des droits est reacutealiseacutee depuis lrsquoadmi-nistrateur du GDS

Deacutefinir un droitLa deacutefinition des droits drsquoun eacuteleacutement srsquoeffec-tue dans la fenecirctre des proprieacuteteacutes de lrsquoeacuteleacute-ment seacutelectionnez lrsquoeacuteleacutement et cliquez sur ldquoProprieacuteteacutesrdquo dans le menu contextuel Le volet ldquoDroitsrdquo affiche les droits deacutefinis de lrsquoeacuteleacutement

Par deacutefaut ldquotout le monde a tous les droitsrdquo

Pour ajouter un droit (ou une restriction) il suffit de cliquer sur le bouton ldquoAjouterrdquo et de seacutelectionner la porteacutee du droit tout le monde un groupe un utilisateur

Une ligne est alors ajouteacutee agrave la table des droits seacutelectionnez lrsquoutilisateur (ou le groupe)

et modifiez ses droits Il existe diffeacuterents types de droits

Types de droits1 Controcircle total lrsquoutilisateur peut reacutealiser toutes les opeacuterations2 Lecture lrsquoutilisateur peut lire lrsquoeacuteleacutement (reacutecupeacuterer une version et extraire pour test) Si un utilisateur nrsquoa pas le droit de lecture sur un reacutepertoire les fichiers du reacutepertoire sont invisibles3 Eacutecriture  lrsquoutilisateur peut ajouter modifier ou supprimer lrsquoeacuteleacutement bull Extraire et reacuteinteacutegrerbull Ajouter  permet drsquoajouter des fichiers des reacutepertoires un partage des eacutetiquettes et de creacuteer des branchesbull Renommer  permet de renommer un eacuteleacute-mentbull Supprimer   permet  de  supprimer  des fichiers des reacutepertoires ou des partages  Il permet eacutegalement de remplacer un partage par un autre partagebull Supprimer  deacutefinitivement   permet  de supprimer deacutefinitivement un fichier ou un reacutepertoire4 Modifier les droits lrsquoutilisateur peut modi-fier les permissions des autres utilisateurs

Une politique de reacuteinteacutegration deacutefinit des regravegles qui doivent ecirctre respecteacutees pour que le deacuteveloppeur soit autoriseacute agrave reacuteinteacutegrer des eacuteleacutements drsquoun projet

Deacutefinir une politiquePour deacutefinir une politique de reacuteinteacutegration bull depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoBase GDSrdquo deacuteroulez ldquoGeacutererrdquo et seacutelectionnez ldquoPolitique de reacuteinteacutegrationrdquobull depuis lrsquoadministrateur du GDS ouvrez le menu contextuel drsquoun reacutepertoire de projet et seacutelectionnez lrsquooption ldquoPolitique de reacutein-teacutegrationrdquo

Les regravegles sont deacutecoupeacutees en 3 thegravemes bull Geacuteneacuteral  aucune erreurwarninginforma-tion commentaire obligatoire bull Tests automatiques  preacutesence de tests auto-matiques pas de tests en erreurbull Meacutetrique de code  Taux de commentaires

FonctionnementAgrave la reacuteinteacutegration drsquoun eacuteleacutement si une regravegle nrsquoest pas respecteacutee une fenecirctre alerte lrsquouti-lisateur du non-respect de la politique de reacuteinteacutegration et la reacuteinteacutegration nrsquoest pas effectueacutee

Il est possible drsquoignorer les regravegles de la poli-tique agrave la reacuteinteacutegration (option ldquoCes regravegles peuvent ecirctre ignoreacuteesrdquo)

Cela permet de passer outre les restrictions notamment pour des eacuteleacutements de test (tous

les deacuteveloppeurs possegravedent des fenecirctres de test dans leurs projets )

Dans ce cas lrsquoutilisateur peut reacuteinteacutegrer son eacuteleacutement (en saisissant un commentaire facul-tatif sur cette reacuteinteacutegration ldquoforceacuteerdquo)

Notre astuceSi vous permettez drsquoignorer la politique de reacuteinteacutegration nous vous conseillons de forcer la saisie drsquoun commentaire Cela permet de conserver un suivi et drsquoeacuteviter drsquoeacuteventuels abus

TDF Tech 2015 - wwwpcsoftfr - 77

LE GDS PRENEZ SOIN DE VOS SOURCES (SUITE)

6 Comparaison et fusion identifiez et reacutecupeacuterez une modification

5 Historique et eacutetiquette gardez trace de tout

La principale caracteacuteristique drsquoun gestionnaire de sources est lrsquoaccegraves agrave lrsquohistorique de lrsquoeacuteleacutement Chaque reacuteinteacutegration creacutee une ligne drsquohistorique

RemarquePour ne pas faire grossir trop rapidement la base de sources lrsquohistorique est sauvegardeacute de maniegravere diffeacuterentielle Un his-torique meacutemorise donc unique-ment les diffeacuterences par rapport agrave lrsquohistorique preacuteceacutedent

La fenecirctre drsquohistorique affiche pour chaque ligne bull le deacuteveloppeur qui a effectueacute la modificationbull la date de modificationbull la version interne (VI) utiliseacuteebull le commentaire de reacuteinteacutegration

Pour une ligne drsquohistorique il est possible de bull revenir agrave cette versionbull reacutecupeacuterer lrsquohistorique agrave fin de tests

bull enregistrer lrsquohistoriquebull comparer  fusionner avec la version cou-rante de lrsquoeacuteleacutement

EacutetiquetteLe picto repreacutesente une eacutetiquette

Une eacutetiquette symbolise la creacuteation drsquoune version client ou la creacuteation drsquoune branche

En un coup drsquoœil vous voyez quelle version de lrsquoeacuteleacutement a eacuteteacute inteacutegreacutee dans la version deacuteployeacuteeDepuis lrsquohistorique du projet vous pouvez ajouter vous-mecircme une eacutetiquette sur une ligne drsquohistoriqueLes eacutetiquettes permettent eacutegalement de creacuteer une branche ldquoa posteriorirdquo

Le bouton ldquoComparerrdquo permet de comparer lrsquoeacuteleacutement courant avec la ligne drsquohistorique en ldquolecture seulerdquo Cela permet uniquement de voir les modifications mais pas drsquoagir

Le bouton ldquoFusionner avecrdquo permet drsquoeffec-tuer une fusion crsquoest-agrave-dire de reporter les modifications de lrsquohistorique dans la version courante (et bien entendu non lrsquoinverse )

Ce bouton propose donc automatiquement lrsquoextraction de lrsquoeacuteleacutement

Le saviez-vous Il est possible de comparer 2 historiques de versions il suffit de seacutelectionner les deux lignes drsquohistorique et de cliquer sur le bouton ldquoComparerrdquo

78 - TDF Tech 2015 - wwwpcsoftfr

7 Les branches geacuterez vos versions et reportez vos modifications

8 Partage drsquoeacuteleacutements des eacuteleacutements toujours agrave jour

Les branches GDS permettent de geacuterer en parallegravele plusieurs versions drsquoune application

Par exemple une version de lrsquoapplication est diffuseacutee en clientegravele elle est dans une branche Le tronc commun contient la future version de lrsquoapplication

Vous pouvez continuer de travailler sur la version en clientegravele et mecircme reporter des corrections de bugs sur cette version agrave partir du tronc commun

Creacuteer une branche1 Pour creacuteer une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoCreacuteer une brancherdquo La branche est alors creacuteeacutee agrave partir de la version en cours des eacuteleacutements

2 Une branche peut ecirctre creacuteeacutee automatique-ment lorsque vous ouvrez un projet dans une version supeacuterieure de WINDEV (par exemple si vous ouvrez dans WINDEV 20 un projet deacuteveloppeacute avec WINDEV 19)

3 Une branche peut ecirctre creacuteeacutee a posteriori 

depuis lrsquohistorique du projet Dans lrsquoadminis-trateur du GDS ouvrez le menu contextuel sur le reacutepertoire du projet et seacutelectionnez ldquoHistoriquerdquo Vous pouvez alors creacuteer une branche agrave partir drsquoune ligne drsquohistorique via le bouton ldquoCreacuteer une brancherdquo

Reporter une modificationPour reacutecupeacuterer une modification depuis une branche sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo deacuteroulez ldquoBranchesrdquo et seacutelectionnez ldquoReacutecupeacuterer des modifications depuis une brancherdquo

Lrsquoassistant de report de modifications srsquoaffichePour chaque eacuteleacutement diffeacuterent (ajouteacute modifieacute ou supprimeacute) il est possible de choisir lrsquoaction agrave effectuer bull ne rien fairebull ajouter dans le projetbull 

Lrsquoun des avantages majeurs du GDS est de pouvoir partager un eacuteleacutement entre plusieurs projets bull une fenecirctrebull une collection de proceacuteduresbull un modegravele de fenecirctres ou de champsbull un composant internebull ou mecircme une analyse 

Cette fonctionnaliteacute preacutesente plusieurs avan-tages bull les modifications sont reporteacutees automati-quement dans tous les projets qui partagent lrsquoeacuteleacutementbull cet eacuteleacutement est modifiable directement dans chacun des projets

Partager un eacuteleacutementPour partager un eacuteleacutement depuis lrsquoeacutediteur sous le volet ldquoGDSrdquo dans le groupe ldquoProjetrdquo cliquez sur ldquoImporter depuis le GDSrdquo

La fenecirctre qui srsquoouvre permet de bull rechercher un eacuteleacutement par son nombull parcourir lrsquoarborescence du GDS

Lorsque vous seacutelectionnez un eacuteleacutement la liste des partages est afficheacutee

Pour partager lrsquoeacuteleacutement il vous suffit de cliquer sur le bouton ldquoPartagerrdquo en bas

Le bouton ldquoImporter une copierdquo permet de reacutecupeacuterer une copie locale de lrsquoeacuteleacutement dans le projet lrsquoeacuteleacutement nrsquoest alors pas partageacute

RemarqueIl est eacutegalement possible de partager un eacuteleacute-ment depuis lrsquoadministrateur du GDS  il suffit de seacutelectionner lrsquoeacuteleacutement dans le projet source puis drsquoutiliser le bouton ou drsquoeffectuer un Drag and Drop vers le reacutepertoire du projet destination dans lrsquoarborescence

TDF Tech 2015 - wwwpcsoftfr - 79

Produire automatiquement une application agrave partir des sources mecircme partageacutees via le GDS  Crsquoest le rocircle de la fabrique logicielle 

Lrsquointeacutegration continue est un ensemble de pratiques qui consiste entre autres agrave veacuterifier agrave chaque modi-fication de code source que le

reacutesultat des modifications ne produit pas de reacutegressions de lrsquoapplication en cours de deacuteveloppement

Cette veacuterification est effectueacutee quasiment en temps reacuteel en geacuteneacuteral chaque nuit Par exemple la fabrique logicielle peut effectuer automatiquement bull La reacutecupeacuteration de tous les eacuteleacutements du GDSbull La mise agrave jour de tous les modegravelesbull La reacutecupeacuteration de tous  les composants externesbull La geacuteneacuteration de tous les exeacutecutables com-posants bull Le lancement des tests 

Les automates renvoient des comptes-rendus permettant de connaicirctre lrsquoeacutetat de la version du produit ainsi geacuteneacutereacute Ce concept de fabrique logicielle permet drsquoautomatiser les tacircches reacutepeacutetitives et chronophages que toutes les eacutequipes de deacuteveloppement doivent effectuer

Principe de fonctionnement et terminologieLa mise en œuvre du concept de fabrique logicielle deacutebute dans WINDEV par la deacutefi-nition des actions agrave reacutealiser sur le projet par exemple ouverture du projet recompilation du projet lancement des tests copie des fichiers sur le reacuteseau suppression des fichiers de test renommage des reacutepertoires etc

Ces diffeacuterentes actions se deacutefinissent dans un ldquoPlan drsquoactionrdquo

Ensuite ce plan drsquoaction est deacuteployeacute sur une

machine appeleacutee ldquocoordinateurrdquo Celdquocoordinateurrdquo se chargera drsquoexeacutecuter les diffeacuterentes tacircches du plan drsquoaction sur la ou les machine(s) de build (une machine de build est une machine deacutedieacutee agrave la compilation des projets) Les machines de build sont geacutereacutees par un automate

Note La ou les machine(s) de build tout comme celle heacutebergeant le coordinateur drsquoailleurs peuvent ecirctre des machines de deacuteve-loppement pendant les peacuteriodes drsquoinutilisation (la nuit ou le week-end par exemple)

Pour les eacutequipes de deacuteveloppement reacutealisant de nombreux projets le coordinateur peut geacuterer plusieurs machines de build simulta-neacutement

Enfin agrave chaque exeacutecution drsquoun plan drsquoaction un compte-rendu est automatiquement geacuteneacutereacute

INTEacuteGRATION CONTINUE

80 - TDF Tech 2015 - wwwpcsoftfr

Retrouvez ces informations sur le scheacutema de la page suivante

Installation du coordinateurLe coordinateur est lrsquoapplication serveur qui stocke les plans drsquoaction reacutepartit leur exeacutecu-tion et meacutemorise les comptes-rendus

Lrsquoinstallation du coordinateur se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile Le coordinateur se preacutesente sous la forme drsquoun service Il nrsquoest pas neacutecessaire que le serveur heacutebergeant ce service soit deacutedieacute au coordinateur

Installation drsquoun automate sur une machine de buildLrsquoexeacutecution des plans drsquoaction srsquoeffectue sur des machines de build (ou des machines de deacuteveloppement inutiliseacutees) Pour cela il faut installer puis lancer lrsquoautomate sur la machine cette machine pourra exeacutecuter des plans drsquoaction tant que lrsquoapplication automate (WDFAutomateexe) sera en exeacutecution

Lrsquoinstallation de lrsquoautomate se trouve dans le reacutepertoire ldquoInstallFabriquerdquo de WINDEV WEBDEV ou WINDEV Mobile

Creacuteation drsquoun plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue depuis

WINDEV WEBDEV ou WINDEV Mobile Il peut srsquoagir drsquoun projet deacutedieacute ou drsquoune configuration de projet

Un plan drsquoaction se preacutesente comme une liste drsquoactions successives avec un meacutecanisme de gestion des erreurs

Les actions leur parameacutetrage et la pro-grammation drsquoactions speacutecifiques sont deacutetailleacutes dans les pages suivantes de ce support de cours

Deacuteploiement drsquoun plan drsquoactionLe deacuteploiement drsquoun plan drsquoaction dans la fabrique logicielle srsquoeffectue au travers du coordinateur (en indiquant le nom de la machine heacutebergeant le coordinateur)

Degraves qursquoun plan drsquoaction est deacutefini WINDEV propose dans les boutons drsquoaccegraves rapide de deacuteployer la bibliothegraveque de plans drsquoaction correspondants sur le coordinateur

Exeacutecution drsquoun plan drsquoactionUne fois le plan drsquoaction deacuteployeacute il est possible de le parameacutetrer (si des paramegravetres ont eacuteteacute deacutefinis) et de lrsquoexeacutecuter Ces opeacuterations srsquoeffec-tuent par lrsquoAdministrateur de la fabrique logicielle

Note Par deacutefaut lrsquoadministrateur de la fabrique logicielle nrsquoaffiche que les plans drsquoaction du deacuteveloppeur ldquoen coursrdquoPour voir les plans drsquoaction de tous les deacuteve-loppeurs il suffit de seacutelectionner ldquotousrdquo dans le champ combo en haut de lrsquointerface

ParameacutetrageDans la majoriteacute des cas les plans drsquoaction sont parameacutetrables notamment par le nom du projet pour pouvoir ecirctre reacuteutiliseacutes pour diffeacuterents projets La configuration et le para-meacutetrage drsquoun plan drsquoaction srsquoeffectuent par le bouton ldquoParameacutetrer le plan drsquoactionrdquo de lrsquoadministrateur de la fabrique logicielle

Exeacutecution et planificationUne fois le plan parameacutetreacute il est precirct agrave ecirctre

exeacutecuteacute Il est possible de lrsquoexeacutecuter immeacutedia-tement (en cliquant sur le bouton ldquoExeacutecuterrdquo) ou de planifier son exeacutecution

Notre conseil La planification permet par exemple drsquoexeacutecuter un plan drsquoaction tous les soirs afin de mettre en place une meacutethodo-logie drsquointeacutegration continue Lrsquointeacutegration continue permet aux deacuteve-loppeurs et aux chefs de projets drsquoavoir reacuteguliegraverement un compte-rendu complet sur la qualiteacute des projets en cours de deacuteve-loppement

Sur lrsquoautomateUne fois une demande drsquoexeacutecution effectueacutee un automate va ecirctre choisi Bien entendu la machine de compilation doit disposer drsquoune  version  de WINDEV WEBDEV  ou WINDEV Mobile correspondant au projet agrave compiler

WINDEV srsquoouvre alors et passe en mode ldquofabrique logiciellerdquo il est alors important de ne pas manipuler le poste ougrave lrsquoautomate srsquoexeacutecute pour eacuteviter de fausser les reacutesultats (par exemple en deacuteplaccedilant la souris pendant un test unitaire)

Reacuteutilisation des plans drsquoactionDegraves qursquoun plan drsquoaction est parameacutetrable il peut ecirctre reacuteutiliseacute par autant de projets et de deacuteveloppeurs que neacutecessaire il suffit de creacuteer un nouveau parameacutetrage

Reacutesultats des plans drsquoactionIl est possible drsquoindiquer depuis  lrsquoadminis-trateur de la fabrique logicielle la meacutethode drsquoenvoi du compte-rendu (messagerie interne des centres de controcircles email etc)

Il est eacutegalement possible de voir pour chaque parameacutetrage de plan drsquoaction le reacutesultat de la derniegravere exeacutecution

TDF Tech 2015 - wwwpcsoftfr - 81

82 - TDF Tech 2015 - wwwpcsoftfr

INTEacuteGRATION CONTINUE LE SCHEacuteMA EXPLICATIF

La fonction PlanActionExeacutecuteDisponible agrave partir de la version 20 la fonction WLangage PlanActionExeacutecute permet de lancer depuis une application lrsquoexeacutecution drsquoun plan drsquoaction Il est possible drsquoindiquer une proceacutedure ldquocallbackrdquo de suivi qui sera appeleacutee agrave chaque eacutetape drsquoavancement du plan drsquoaction

Exeacutecute lrsquoinstance du plan drsquoaction de compilation de mon projetPlanActionExeacutecute(ldquoCoordinateurrdquo ldquoadminrdquo ldquomotdepasserdquo ldquoMonPlanrdquo ProceacutedureSuivi)

TDF Tech 2015 - wwwpcsoftfr - 83

Un plan drsquoaction peut ecirctre quelque chose de tregraves simple ou bien ecirctre construit de faccedilon plus complexe ou personnaliseacutee pour reacutepondre agrave

des besoins speacutecifiques Voici une preacutesentation des principales possibiliteacutes des plans drsquoaction

Creacuteation du plan drsquoactionLa creacuteation drsquoun plan drsquoaction srsquoeffectue dans WINDEV WEBDEV ou WINDEV Mobile depuis la fenecirctre de creacuteation drsquoun nouvel eacuteleacutement en cliquant sur ldquoAutomatisationrdquo puis sur ldquoPlan drsquoactionrdquo Les plans drsquoaction neacutecessitent la creacuteation drsquoune configuration speacutecifique pour geacuteneacuterer une bibliothegraveque de plans drsquoaction

Notre conseil nous vous conseillons de creacuteer un projet speacutecifique pour deacutevelopper les plans drsquoaction

Notamment parce qursquoun plan drsquoaction peut ecirctre appliqueacute agrave tous les projets que vous souhaitez

Les plans drsquoaction beacuteneacuteficient drsquoun eacutediteur speacutecifique composeacute de deux parties bull Au  centre  le plan drsquoaction  sous  forme seacutequentielle crsquoest-agrave-dire la liste de toutes les opeacuterations qui doivent srsquoeffectuerbull Sur la gauche la liste des actions possibles

Lrsquoajout drsquoune action dans un plan drsquoaction srsquoeffectue par un simple ldquoDrag And Droprdquo agrave lrsquoendroit ougrave lrsquoaction doit ecirctre inseacutereacutee ou ajouteacutee Parmi les actions disponibles il est possible de bull Lancer WINDEVbull Ouvrir un projetbull Synchroniser les modegravelesbull Geacuteneacuterer une installationbull Reacuteinteacutegrer tous les eacuteleacutementsbull 

Il est eacutegalement possible drsquoexeacutecuter un autre plan drsquoaction ce qui permet de deacutecouper

structurer et reacuteutiliser des plans drsquoaction

De mecircme il est possible drsquoeacutecrire une action en code WLangage pour faire des traitements personnaliseacutes Par exemple envoyer un SMS faire une sauvegarde des sources sur un FTP

Ajout drsquoune action parameacutetreacuteeUne action peut avoir besoin de paramegravetres Par exemple sur lrsquoaction ldquoouverture drsquoun projet depuis le GDSrdquo il est neacutecessaire drsquoindiquer le projet agrave ouvrirLa deacutefinition de ces paramegravetres srsquoeffectue par la fenecirctre de description de lrsquoaction (acces-sible par le menu contextuel) dans lrsquoonglet ldquoGeacuteneacuteralrdquo

Les paramegravetres peuvent ecirctre deacutefinis bull Sous  forme de valeur  ldquofixerdquo crsquoest-agrave-dire que la valeur est speacutecifieacutee directement dans le plan drsquoaction

Les plans drsquoaction permettent de deacutefinir les diffeacuterentes opeacuterations reacutealiseacutees par la fabrique logicielle

INTEacuteGRATION CONTINUE CREacuteATION DE PLANS DrsquoACTION

84 - TDF Tech 2015 - wwwpcsoftfr

bull Sous forme de paramegravetres donneacutes lors de lrsquoexeacutecution du plan drsquoaction

Ce paramegravetre sera neacutecessaire pour pouvoir exeacutecuter le plan drsquoaction

Dans le cas du nom du projet agrave ouvrir le deacuteveloppeur a eacutevidemment inteacuterecirct agrave lrsquoindiquer en paramegravetre

Notre conseil Dans la mesure du possible nous vous conseillons drsquoutiliser des paramegravetres lors de la creacuteation de plans drsquoaction afin de pouvoir les reacuteutiliser pour diffeacuterents projets

Tester un plan drsquoactionIl est possible de faire ldquoGordquo drsquoun plan drsquoaction pour tester en local son fonctionnement et surtout les actions personnaliseacutees contenant du code WLangage

Note  Il est eacutegalement possible drsquoexeacutecuter et de parameacutetrer une action par programmation gracircce aux fonctions paXXX du WLangage Nous vous conseillons cependant drsquoutiliser les actions sous leur forme graphique afin de ne pas avoir agrave vous soucier des possibles eacutevolutions de ces fonctions

Gestion des eacutechecs et des erreursUne fois lrsquoaction deacutefinie et parameacutetreacutee il faut deacutefinir le comportement agrave adopter en cas drsquoeacutechec de lrsquoaction (par exemple la mise agrave jour drsquoune fenecirctre qui est extraite en exclusif chez un deacuteveloppeur)

Par deacutefaut WINDEV seacutelectionne la gestion drsquoerreurs qui est la plus coheacuterente avec lrsquoac-tion Mais il est bien entendu possible de la personnaliser Voici les modes de gestion drsquoerreurs possibles

Arrecircter lrsquoexeacutecution du plan drsquoaction et enregistrer lrsquoerreur dans le compte-renduCe mode de gestion est agrave reacuteserver pour les erreurs graves par exemple lrsquoouverture du projet qui eacutechoue il est inutile drsquoessayer de continuer

Exeacutecuter le traitement drsquoerreur per-sonnaliseacute du plan drsquoactionCe mode de gestion permet de geacuterer un meacutecanisme drsquoerreur speacutecifique Par exemple drsquoenvoyer un SMS en cas drsquoerreurs

Enregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionCe mode de gestion permet de continuer

lrsquoexeacutecution du plan drsquoaction mecircme en cas drsquoerreurs Par exemple en cas de non mise agrave jour drsquoun composant (serveur inaccessible etc) le plan drsquoaction peut continuer

Enregistrer pour information mais ne pas geacuteneacuterer drsquoerreursPar exemple lorsque lrsquoaudit deacutetecte qursquoil y a des fichiers non utiliseacutes dans le reacutepertoire du projet les eacutequipes de deacuteveloppement ne veulent pas forceacutement le consideacuterer comme une erreur mais veulent le savoir

Remonteacutee des erreursEn cas drsquoeacutechec de lrsquoaction vous pouvez speacute-cifier une ou plusieurs personnes agrave preacutevenir il suffit de les saisir dans lrsquoonglet ldquoMessagerdquo de lrsquoaction

Bien eacutevidemment quoi qursquoil advienne le proprieacutetaire du plan drsquoaction est preacutevenu de lrsquoeacutechec ou du succegraves de lrsquoexeacutecution

Notre conseilPour remonter toutes les erreurs potentielles drsquoun projet il est possible drsquoutiliser le mode ldquoEnregistrer lrsquoerreur dans le compte-rendu et de continuerrdquo et une action particuliegravere ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo

Lrsquoaction ldquoStopper lrsquoexeacutecution en cas drsquoerreurrdquo nrsquoest utile que si pour toutes les actions deacutefinies le mode de gestion des erreurs est ldquoEnregistrer lrsquoerreur dans le compte-rendu et continuer lrsquoexeacutecutionrdquo

Par exemple si la synchro des modegraveles ne srsquoest pas effectueacutee lrsquoerreur est enregistreacutee et le plan drsquoaction continue Si par la suite la recompilation drsquoIHM deacutetecte des erreurs elles seront stockeacutees etc

Ainsi toutes les erreurs du projet sont remonteacutees en une seule exeacutecution du plan drsquoaction

TDF Tech 2015 - wwwpcsoftfr - 85

WINDEV 20

LES DONNEacuteES DrsquoUN CHAMP TCD

(CUBE ROLAP) DANS 1 GRAPHE

Gracircce au nouveau type de graphe ldquoSecteur multiniveaurdquo de WINDEV 20 il est possible de repreacutesenter une arborescence multiniveau de faccedilon visuelle et interactive Ce type de graphe est donc tout adapteacute aux donneacutees drsquoun TCD

Le champ Tableau croiseacute dynamique (TCD) affiche dynamiquement des donneacutees qui proviennent du recou-pement de diffeacuterents fichiers drsquoune

base de donneacutees

Dans  la LST 92 nous vous proposions un modegravele de champs pour repreacutesenter les donneacutees drsquoun TCD sous la forme drsquoun his-togramme

Lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo propose drsquoutiliser le nouveau type de graphe ldquoSecteur multiniveaurdquo (aussi appeleacute ldquosunburstrdquo) Ce type de graphe permet de repreacutesenter des donneacutees qui ont une notion hieacuterarchique il est donc tout adapteacute pour repreacutesenter visuellement des donneacutees drsquoun tableau croiseacute dynamique car il est aussi dynamique

Important  vous devez utiliser WINDEV en version 200051J minimum pour tester cet exemple (des corrections sur le parcours de cellules drsquoun tableau croiseacute dynamique ont eacuteteacute apporteacutees dans cette version)

PrincipePour alimenter le graphe lrsquoideacutee de lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo est de parcourir chaque cellule du champ TCD et de reacutecupeacuterer bull la valeur de la cellulebull le titre de la lignebull le titre de la colonne

Il suffit ensuite de remplir le champ Graphe avec la valeur reacutecupeacutereacutee et la concateacutenation des titres en ldquoindicerdquo

Mise en œuvre

Parcours du champ TCDDans un premier temps il est neacutecessaire de mettre en place la boucle de parcours du champ Tableau croiseacute dynamique il est neacutecessaire de parcourir chaque colonne et chaque lignePour les lignes il y a une petite subtiliteacute le tableau croiseacute dynamique peut contenir plu-sieurs valeurs simultaneacutement (CA Quantiteacute ) alors que le graphe SMN est baseacute sur une valeur

Il est donc neacutecessaire de ne lire que les lignes drsquoune seule et mecircme valeur il est donc neacutecessaire de mettre en place une boucle de parcours avec un PAS Parcours des colonnesPOUR nColonne = 1 _A_ gChampTCDNombreColonne Parcours des lignes POUR nLigne = nIndiceValeurAAfficher _A_ gChampTCDOccurrence PAS nNbValeurs Traitement FIN FIN

Reacutecupeacuteration des informations du TCDPour reacutecupeacuterer le titre de la ligne pour la cellule en cours il suffit de reacutecupeacuterer la valeur de la cellule en cours pour la colonne 1 Titre lignesLigne = ExtraitChaicircne( gChampTCD[nLigne]1)

Pour reacutecupeacuterer le titre de la colonne pour la cellule en cours il suffit de reacutecupeacuterer le titre (proprieacuteteacute Titre) de la cellule en cours pour la ligne 1 Titre colonnesColonne = gChampTCD[1nColonne]Titre

Attention si le champ Tableau croiseacute dyna-mique affiche des totaux il ne faut bien entendu pas utiliser les valeurs de ces totaux

Alimentation du graphe par les donneacutees du TCDPour ajouter la donneacutee dans le graphe SMN il est neacutecessaire de deacutefinir le chemin de la seacuterie

Dans lrsquoexemple ldquoWD GraphesEtTCD TDF20rdquo les entecirctes de colonne seront utiliseacutes en premier dans la hieacuterarchie Deacutefinit que les entecirctes de colonnes sont des niveaux agrave prendre en compte en premier (par deacutefaut 2012 gt 2012T1 gt Janvier gt Europe gt France gt Paris)sChemin = sColonne+[ldquo|rdquo]+sLigne

La hieacuterarchie des titres depuis le TCD est deacutefinie par le caractegravere ldquo|rdquo

Il est neacutecessaire de remplacer ce caractegravere par un TAB qui est le caractegravere indiquant une hieacuterarchie dans une seacuterie drsquoun graphe SMN Remplace les ldquo|rdquo par des TAB (les hieacuterarchies du chemin drsquoun SMN sont deacutelimiteacutees par TAB)sChemin = Remplace(sChemin ldquo|rdquo TAB)

Il  suffit enfin drsquoajouter  la donneacutee dans  le graphe SMN Ajoute la donneacutee pour le chemin

86 - TDF Tech 2015 - wwwpcsoftfr

grSMNAjouteDonneacutee( GRF_GrapheSMN sChemin gChampTCD[nLigne nColonne])

Utilisation du modegravele de champsPour faciliter la reacuteutilisation du graphe SMN lrsquoexemple met agrave disposition un modegravele de champs ldquoMDLC_GrapheSMNPourTCDrdquo

Lrsquoutilisation de ce modegravele de champs se fait

simplement en 2 eacutetapes 1  Initialiser  le modegravele de champs en  indi-quant le champ Tableau croiseacute dynamique agrave utiliser via la fonction Initialise du modegravele de champs Initialise le modegravele de champsCMOD_GrapheInitialise( TCD_Statistiques)

2 Demander le dessin du graphe via la fonc-tion Dessine en indiquant bull lrsquoindice de la valeur qui servira de source 

de donneacuteesbull la dimension (colonne ou ligne) agrave afficher en premier parmi les niveaux du graphe Vous pouvez utiliser la constante tcdEntecirc-teColonne ou tcdEntecircteLignebull le nombre de niveaux afficheacutes simultaneacute-ment Dessine le grapheCMOD_GrapheDessine(1 tcdEntecircteColonne2)

TDF Tech 2015 - wwwpcsoftfr - 87

Page 10: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 11: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 12: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 13: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 14: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 15: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 16: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 17: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 18: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 19: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 20: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 21: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 22: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 23: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 24: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 25: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 26: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 27: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 28: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 29: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 30: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 31: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 32: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 33: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 34: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 35: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 36: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 37: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 38: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 39: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 40: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 41: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 42: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 43: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 44: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 45: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 46: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 47: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 48: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 49: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 50: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 51: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 52: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 53: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 54: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 55: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 56: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 57: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 58: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 59: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 60: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 61: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 62: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 63: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 64: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 65: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 66: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 67: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 68: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 69: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 70: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 71: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 72: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 73: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 74: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 75: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 76: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 77: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 78: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 79: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 80: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 81: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 82: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 83: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 84: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 85: TDF Tech 2015 Support de cours - PC SOFT WINDEV
Page 86: TDF Tech 2015 Support de cours - PC SOFT WINDEV