DOCUMENTATION EN LIGNE
DE WINDEVWEBDEV ET WINDEV MOBILE

Aide / Développer une application ou un site / Gabarits et Ambiances
  • Les différentes étapes
  • Étape 1 : Création d'un projet gabarit
  • Présentation
  • Créer un projet gabarit
  • Étape 2 : Création d'une fenêtre contenant les styles des champs
  • Présentation
  • Créer une fenêtre contenant les styles des champs
  • Étape 3 : Création d'une fenêtre gabarit de référence
  • Présentation
  • Créer une fenêtre de référence dans votre projet gabarit
  • Ajout d'éléments à la fenêtre référence
  • Étape 4 : Création d'une fenêtre de type gabarit
  • Présentation
  • Créer une fenêtre gabarit pour les fenêtres "Vierge"
  • Créer une fenêtre gabarit pour les fenêtres RAD (RAD conservé par compatibilité)
  • Ajout de boutons supplémentaires (RAD conservé par compatibilité)
  • Largeur initiale de la fenêtre (RAD conservé par compatibilité)
  • Étape 5 : Création finale du gabarit
  • Présentation
  • Créer un gabarit
  • Créer un aperçu de gabarit
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaEtats et RequêtesCode Utilisateur (MCU)
WEBDEV
WindowsLinuxPHPWEBDEV - Code Navigateur
WINDEV Mobile
AndroidWidget AndroidiPhone/iPadWidget IOSApple WatchMac CatalystUniversal Windows 10 App
Autres
Procédures stockées
Les différentes étapes
La création d'un gabarit de fenêtre se décompose en plusieurs étapes :
Remarques :
  • Nous vous indiquons ici une des méthodes de création d'un gabarit de fenêtre. La marche à suivre décrite ci-dessus est conseillée mais en aucun cas obligatoire.
  • L'icône indique un conseil. Les instructions données dans ces conseils ne sont pas obligatoires mais permettent une meilleure organisation pour la création d'un gabarit de fenêtre.
  • Pour modifier un gabarit existant, il suffit de modifier le fichier gabarit (fichier .STY) présent dans le répertoire où le gabarit a été généré. Ce fichier peut être ouvert sous l'éditeur, puis enregistré.
  • Il est également possible de créer un gabarit à partir d'un gabarit existant. Pour plus de détails, consultez Créer un gabarit à partir d'un gabarit existant.
Étape 1 : Création d'un projet gabarit

Présentation

Un gabarit est le plus souvent constitué de plusieurs fenêtres (1 au minimum, 12 au maximum). Pour simplifier la création et la modification de vos gabarits, nous vous conseillons d'utiliser un projet par gabarit.
Ce projet regroupera les différentes fenêtres correspondant à un gabarit.
Le projet gabarit regroupera :
  • une fenêtre contenant les styles des champs.
  • une fenêtre servant de "fenêtre de référence" à la fenêtre de type gabarit à créer.
  • une fenêtre gabarit pour chaque type de fenêtre.
Remarque : Si vous personnalisez vos états grâce à des gabarits, vous pouvez créer vos gabarits d'état dans ce projet. Pour plus de détails, consultez Création d'un gabarit d'état.

Créer un projet gabarit

Pour créer un projet gabarit : Sous WINDEV/WINDEV Mobile, créez un nouveau projet :
  • Cliquez sur parmi les boutons d'accès rapide.
  • La fenêtre de création d'un nouvel élément s'affiche : cliquez sur "Projet".
Ce projet doit respecter les deux conditions suivantes :
  • le projet ne doit être lié à aucune analyse.
  • le projet ne doit utiliser aucun gabarit.
Pour identifier facilement vos projets gabarit, nous vous conseillons d'utiliser la notation suivante : "Gabarit_<NomDuGabarit>". Par exemple, si le nom du gabarit est Caraïbe, le projet s'appellera "Gabarit_Caraïbe".
Étape 2 : Création d'une fenêtre contenant les styles des champs

Présentation

La création d'un gabarit consiste aussi bien à définir les caractéristiques des fenêtres (image de fond, type de cadre, ...) que les caractéristiques des champs (police utilisée, dimensions, ...).
Pour définir les caractéristiques des champs dans un gabarit, il suffit de créer une fenêtre contenant le ou les styles utilisés par les différents types de champs. A partir de cette fenêtre, la feuille du styles du gabarit sera créée.
Remarques :
Seuls les styles des types de champs utilisés dans vos applications doivent être définis. Par exemple, si vos applications n'utilisent pas de champ Spin, il n'est pas nécessaire de définir un style pour ce type de champ. La définition du style par défaut se fera directement dans le fichier gabarit (extension ".STY").
Plusieurs styles peuvent être définis pour le même type de champ.
Travail en GDS : pensez à extraire votre feuille de styles (fichier ".STY") avant de créer la fenêtre contenant les styles des champs.

Créer une fenêtre contenant les styles des champs

Pour créer une fenêtre contenant les styles des champs :
  1. Créez une fenêtre vierge :
    • Cliquez sur parmi les boutons d'accès rapide.
    • La fenêtre de création d'un nouvel élément s'affiche : cliquez sur "Fenêtre" puis sur "Fenêtre". L'assistant de création d'une fenêtre se lance.
    • Dans l'assistant, cliquez sur "Vierge" et validez.
  2. Insérez un type de champ. Par exemple, un champ de type "Champ de saisie".
  3. Modifiez l'aspect de ce champ dans l'onglet "Style" de la fenêtre de description (option "Description" du menu contextuel). Par exemple, modifiez la couleur de la zone de saisie.
  4. Indiquez le nom du champ dans l'onglet "Général" de la fenêtre de description (option "Description" du menu contextuel).
    Pour identifier plus facilement le style du champ en cours, nous vous conseillons d'utiliser la notation suivante : "<NomDuGabarit>_<TypeDuChamp>". Par exemple, "Caraïbe_ChampSaisieStandard".
  5. Modifiez si nécessaire les autres caractéristiques de ce champ dans la fenêtre de description (dimensions et cadrage par exemple).
  6. Répétez les opérations 2 à 5 pour tous les types de champs utilisés dans votre gabarit.
  7. Enregistrez la fenêtre ().
Pour identifier plus rapidement cette fenêtre, nous vous conseillons d'utiliser la notation suivante : <NomDuGabarit>_Champ". Par exemple, "Caraïbe_Champ".
Remarque : Pour personnaliser :
  • les boutons standard utilisés pour les boutons de type "Ouvrir", "OK" ou "Imprimer" par exemple : créez un bouton de dimensions 80 x 24.
    Pour identifier le bouton standard, nous vous conseillons d'utiliser la notation suivante : "<NomDuGabarit>_BtnStandard". Par exemple, "Caraïbe_BtnStandard".
  • les boutons de parcours utilisés pour parcourir les différents enregistrements affichés dans la fenêtre : créez quatre boutons de dimensions 20 x 24.
    Pour identifier les boutons de parcours, nous vous conseillons d'utiliser la notation suivante : "<NomDuGabarit>_Btn<FonctionBouton>". Par exemple, "Caraïbe_BtnPremier", "Caraïbe_BtnPrécédent", "Caraïbe_BtnSuivant" et "Caraïbe_BtnDernier".
Étape 3 : Création d'une fenêtre gabarit de référence

Présentation

Toutes les fenêtres d'un même gabarit vont utiliser des caractéristiques communes (image de fond, dimension, type de cadre, ...). Pour éviter de définir ces caractéristiques dans chaque nouvelle fenêtre gabarit, nous vous conseillons de créer une fenêtre gabarit de base.
Cette fenêtre servira de "fenêtre de référence" : les gabarits de fenêtre seront créés à partir de cette fenêtre.

Créer une fenêtre de référence dans votre projet gabarit

Pour créer une fenêtre de référence dans votre projet gabarit :
  1. Créez une fenêtre vierge :
    • Cliquez sur parmi les boutons d'accès rapide.
    • La fenêtre de création d'un nouvel élément s'affiche : cliquez sur "Fenêtre" puis sur "Fenêtre". L'assistant de création d'une fenêtre se lance.
    • Dans l'assistant, cliquez sur "Vierge" et validez.
  2. Dans la description de la fenêtre (option "Description" du menu contextuel), spécifiez :
    • le titre de la fenêtre dans l'onglet "Général".
      Pour connaître directement le gabarit utilisé, nous vous conseillons d'utiliser la notation suivante : "<NomDuGabarit>". Par exemple, "Caraïbe".
    • les caractéristiques de la fenêtre dans l'onglet "UI".
      Toutes les caractéristiques peuvent être paramétrées pour une fenêtre gabarit.
      Pour la taille de la fenêtre, il est conseillé de spécifier les valeurs suivantes :
      • options "Largeur min" et "Hauteur min" : Initial
      • options "Largeur max" et "Hauteur max" : <Défaut>
    • l'image de fond (si nécessaire) et ses caractéristiques (position, symétrie, ...) dans l'onglet "Image".
      Si la fenêtre est redimensionnable, l'utilisation du mode 9 images est conseillée. Le mode 9 images permet d'optimiser toutes les possibilités d'agrandissement de l'image de fond.
      Nous vous conseillons d'utiliser la notation suivante pour cette image : "<NomDuGabarit>_Fond.<Extension>". Par exemple, "Caraïbe_Fond.BMP".
    • le style souhaité (couleur de fond, type de cadre, ...) dans l'onglet "Style".
  3. Enregistrez la fenêtre ().
Pour identifier plus facilement cette fenêtre, nous vous conseillons d'utiliser la notation suivante : "<NomDuGabarit>_Référence". Par exemple, "Caraïbe_Référence".

Ajout d'éléments à la fenêtre référence

Des champs peuvent être ajoutés à la fenêtre référence (principalement des champs libellé et des champs image). Par exemple, le nom et le logo d'une entreprise peuvent être affichés dans les fenêtres.
Ces champs sont alors appelés "Images de décor". Ces champs font partie de l'interface des fenêtres.
Quelques conseils pour une utilisation simplifiée des "Images de décor" :
  • ancrez ces champs si la fenêtre est redimensionnable. Toutes les possibilités d'agrandissement de ces champs seront ainsi optimisées.
  • si ces champs sont des champs image, décochez l'option "Avec gestion du clic souris" dans l'onglet "Détail" de la description des champs. Ainsi, ces champs image ne réagiront pas à la souris.
Si des menus sont utilisés dans vos applications, il est possible d'ajouter et de décrire un menu principal dans la fenêtre de référence (option "Insertion .. Ajouter le menu principal").
Utilisation de fichiers image : Si des images sont utilisées dans votre fenêtre de référence (images utilisées dans les "images de décor" par exemple), nous vous conseillons de :
  • utiliser la notation suivante : "<NomDuGabarit>_<NomImage>.<Extension>. Par exemple, "Caraïbe_Plage.BMP".
  • regrouper ces fichiers dans le répertoire "Elément_<NomDuGabarit>" (par exemple "Elément_Caraïbe"), dans le répertoire du projet gabarit.
Étape 4 : Création d'une fenêtre de type gabarit

Présentation

Pour utiliser le gabarit sur les fenêtres de votre application, il est nécessaire de créer une fenêtre de type gabarit. Par défaut, une seule fenêtre est nécessaire : la fenêtre de type "Vierge".
Remarque : Si vos projets utilisent des fenêtres créées avec le RAD conservé par compatibilité (fenêtres générées avant la version 12 ou fenêtres générées en version 12 avec le pattern "RAD Compatible 11"), plusieurs fenêtres de type gabarit sont nécessaires. Chaque fenêtre créée correspondra à un type de fenêtre RAD.

Créer une fenêtre gabarit pour les fenêtres "Vierge"

Pour créer une fenêtre gabarit pour les fenêtres "Vierge" :
  1. Ouvrez la fenêtre référence du gabarit. Si vous avez utilisé les notations conseillées, cette fenêtre est la fenêtre "<NomDuGabarit>_Référence".
  2. Enregistrez la fenêtre sous un nom différent : sous le volet "Accueil", dans le groupe "Général", déroulez "Enregistrer" et sélectionnez "Enregistrer sous". Cette nouvelle fenêtre comporte automatiquement toutes les caractéristiques de la fenêtre modèle.
    Pour identifier plus facilement cette fenêtre gabarit, nous vous conseillons d'utiliser la notation suivante : "FenêtreVierge".
  3. Sous le volet "Affichage", dans le groupe "Options", cliquez sur "Mode gabarit" (Alt + G). La fenêtre d'édition d'un gabarit s'affiche.
  4. Sélectionnez le modèle "Fenêtre vierge (D)" et validez votre choix.
    Remarque : Trois modèles sont proposés par type de fenêtre. La lettre suivant le type de fenêtre indique la position des boutons dans la fenêtre :
    • D : Boutons situés dans la partie droite de la fenêtre.
    • G : Boutons situés dans la partie gauche de la fenêtre.
    • B : Boutons situés dans la partie basse de la fenêtre.
      Nous vous conseillons de sélectionner un nom de modèle suivi de la lettre "D".
  5. Si le type de la fenêtre ne doit pas comporter de menu principal, supprimez le menu principal de la fenêtre : sous le volet "Fenêtre", dans le groupe "Barres et menus", déroulez "Menu principal" et sélectionnez "Supprimer le menu principal".
  6. Enregistrez la fenêtre ().

Créer une fenêtre gabarit pour les fenêtres RAD (RAD conservé par compatibilité)

Pour créer une fenêtre gabarit pour les fenêtres RAD (RAD conservé par compatibilité) :
  1. Déterminez la fenêtre à créer. Les différents types de fenêtres RAD sont les suivants :
    • Fenêtre menu
    • Fenêtre fiche : simple, avec parcours, avec table reliée, avec table de relation, avec fiche relié
    • Fenêtre table : simple, avec fiche détail, avec table reliée, de relation
    • Fenêtre Vision Plus
  2. Ouvrez la fenêtre référence du gabarit. Si vous avez utilisé les notations conseillées, cette fenêtre est la fenêtre "<NomDuGabarit>_Référence".
  3. Enregistrez la fenêtre sous un nom différent : sous le volet "Accueil", dans le groupe "Général", déroulez "Enregistrer" et sélectionnez "Enregistrer sous". Cette nouvelle fenêtre comporte automatiquement toutes les caractéristiques de la fenêtre modèle.
    Pour identifier plus facilement les différentes fenêtres gabarit, nous vous conseillons d'utiliser un nom de fenêtre correspondant à la fenêtre RAD associée. Par exemple : "Fch_tbl_relie" pour une fenêtre fiche avec table reliée.
  4. Sous le volet "Affichage", dans le groupe "Options", cliquez sur "Mode gabarit" (Alt + G). La fenêtre d'édition d'un gabarit s'affiche.
  5. Sélectionnez le modèle RAD associé à la fenêtre gabarit en cours de création (nom du modèle suivi de la lettre 'D') et validez votre choix. Plusieurs zones apparaissent sur la fenêtre gabarit. Ces zones permettent l'affichage des différents champs (tables, boutons, boutons de parcours, ...) générés par le RAD pour le type de fenêtre RAD précédemment sélectionné.
    Remarque : Trois modèles sont proposés par type de fenêtre. La lettre suivant le type de fenêtre indique la position des boutons dans la fenêtre :
    • D : Boutons situés dans la partie droite de la fenêtre.
    • G : Boutons situés dans la partie gauche de la fenêtre.
    • B : Boutons situés dans la partie basse de la fenêtre.
      Nous vous conseillons de sélectionner un nom de modèle suivi de la lettre "D".
  6. Utilisez si nécessaire des repères de positionnement pour positionner les zones de gabarit : sous le volet "Affichage", dans le groupe "Aide à l'édition", cochez l'option "Règles" (Ctrl + R). Pour plus de détails sur les repères, consultez les règles d'alignement.
  7. Définissez l'ancrage des zones de gabarit dans la fenêtre de description du gabarit : sous le volet "Modification", dans le groupe "Aide à l'édition", cliquez sur "Description". L'ancrage d'une zone de gabarit est réalisé par rapport à la fenêtre.
  8. Si le type de la fenêtre RAD ne doit pas comporter de menu principal, supprimez le menu principal de la fenêtre : sous le volet "Fenêtre", dans le groupe "Barres et menus", déroulez "Menu principal" et sélectionnez "Supprimer le menu principal".
  9. Si la fenêtre correspond à la fenêtre menu générée par le RAD, cochez l'option "Mère MDI" dans l'onglet "Détail" de la description de la fenêtre.
  10. Enregistrez la fenêtre ().
Remarque : Il est nécessaire d'effectuer ces opérations pour toutes les fenêtres RAD utilisées dans vos applications.

Ajout de boutons supplémentaires (RAD conservé par compatibilité)

Lors de la création d'une fenêtre RAD, WINDEV crée automatiquement tous les boutons nécessaires à l'utilisation de la fenêtre. Ces boutons adoptent le style par défaut des boutons (défini dans la fenêtre de description des champs).
Pour utiliser un style de bouton différent, il suffit d'ajouter un bouton et de définir son style dans la fenêtre gabarit. Par exemple, dans une fenêtre gabarit donnée, il est possible d'utiliser des boutons de parcours différents de ceux définis par défaut.
Si des boutons supplémentaires sont ajoutés dans une fenêtre gabarit, ces boutons seront automatiquement utilisés par WINDEV lors de la création de la fenêtre RAD.
Pour ajouter un bouton supplémentaire :
  1. Passez la fenêtre en mode d'édition : sous le volet "Affichage", dans le groupe "Options", cliquez sur "Mode gabarit" (Alt + G).
  2. Ajoutez un bouton à la fenêtre.
  3. Définissez les caractéristiques de ce bouton dans sa fenêtre de description (option "Description" du menu contextuel).
  4. Passez la fenêtre en mode gabarit: sous le volet "Affichage", dans le groupe "Options", cliquez sur "Mode gabarit" (Alt + G).
  5. Affichez la fenêtre de description du gabarit : sous le volet "Modification", dans le groupe "Aide à l'édition", cliquez sur "Description". Sélectionnez l'onglet "Champs".
  6. Sélectionnez le bouton ajouté.
  7. Définissez le type, l'ancrage et la zone de gabarit associée à ce bouton.
    Remarque : L'ancrage du bouton associé à une zone de gabarit est réalisé par rapport à cette zone et non par rapport à la fenêtre.
  8. Validez la description du gabarit.

Largeur initiale de la fenêtre (RAD conservé par compatibilité)

La largeur initiale de la fenêtre doit être suffisamment importante pour afficher tous les boutons associés à chaque zone bouton. Lors de la création d'une fenêtre RAD, si les boutons ne peuvent pas être affichés les uns à côté des autres horizontalement, ils seront affichés verticalement les uns en dessous des autres.
Étape 5 : Création finale du gabarit

Présentation

Pour utiliser un gabarit personnalisé dans vos applications, il est nécessaire de créer le gabarit final. Pour cela, il suffit d'exporter vers un gabarit :
  1. la fenêtre contenant les styles des champs,
  2. puis toutes les fenêtres de type gabarit précédemment créées.
Attention : L'ordre d'exportation des fenêtres est important.
Pour faciliter l'utilisation d'un gabarit personnalisé, nous vous conseillons de créer des aperçus. Ces aperçus seront utilisés lors de l'application d'un gabarit sur une fenêtre ou sur un projet.
Chaque type de fenêtre est associé à un aperçu. Il est conseillé de créer un aperçu de fenêtre pour chacun des types de fenêtre utilisés.
Remarque : Il n'est pas obligatoire de créer un aperçu de fenêtre. Dans ce cas, aucun aperçu de gabarit n'apparaît dans la zone "Aperçu".

Créer un gabarit

Pour créer un gabarit :
  1. Ouvrez la fenêtre contenant les styles des champs. Si vous avez utilisé les notations conseillées, cette fenêtre est la fenêtre "<NomDuGabarit>_Champ".
  2. Sous le volet "Accueil", dans le groupe "Général", déroulez "Enregistrer" et sélectionnez "Exporter .. Vers un gabarit".
  3. Saisissez le nom du gabarit (par exemple "Caraïbe") et validez la saisie.
    Lors de l'exportation de la fenêtre contenant le style des champs :
    • le répertoire "<NomDuGabarit>" est créé dans le sous-répertoire "Personal\Templates" d'installation de WINDEV.
    • une feuille de styles de gabarit ("<NomDuGabarit>.STY") est créée dans le répertoire "<NomDuGabarit>".
    • une feuille de styles utilisable en exécution ("<NomDuGabarit>.WDY") est créée dans le répertoire "<NomDuGabarit>". Cette feuille de styles en exécution sera automatiquement installée avec votre projet. Cette feuille de styles est nécessaire pour appliquer dynamiquement un gabarit à une fenêtre (fonction ChangeGabarit).
  4. Effectuez les opérations 1 à 3 pour toutes les fenêtres de type gabarit en sélectionnant le gabarit précédemment saisi.
    Lors de l'exportation des fenêtres de type gabarit, les éléments suivants sont copiés dans le sous-répertoire "Personal\Templates\<NomDuGabarit>" :
    • la fenêtre exportée sous le nom "<NomDuGabarit><N°Fenêtre>.WDW",
      où <N°Fenêtre> correspond au numéro d'identification de la fenêtre associée.
      Type de fenêtreN° d'identification
      Fenêtre vierge00
      Fenêtre menu01
      Fenêtre fiche simple10
      Fenêtre fiche avec parcours02
      Fenêtre fiche avec table reliée06
      Fenêtre fiche avec table de relation07
      Fenêtre fiche avec fiche relié11
      Fenêtre table simple03
      Fenêtre table avec fiche détail05
      Fenêtre table avec table reliée09
      Fenêtre table de relation08
      Fenêtre Vision Plus04
    • les fichiers utilisés dans la fenêtre exportée (image de fond par exemple).
  5. Le gabarit personnalisé peut désormais être utilisé. Pour plus de détails, consultez Utilisation d'un gabarit dans vos applications.
Remarque : pour que le gabarit soit utilisable par WINDEV, il est nécessaire de relancer WINDEV.

Créer un aperçu de gabarit

Pour créer un aperçu de gabarit :
  1. Dans un projet associé à une analyse, créez une nouvelle fenêtre. Par exemple, créez une fenêtre de type "Fiche avec parcours".
  2. Sélectionnez le gabarit de fenêtre précédemment créé. Aucun aperçu de gabarit n'apparaît dans la zone "Aperçu".
  3. Validez la création de la fenêtre. La fenêtre créée devient la fenêtre en cours.
  4. Faites une copie de la fenêtre créée (Ctrl + C).
  5. Collez le contenu du presse-papiers dans un logiciel de dessin (Ctrl + V dans "Paint" par exemple).
  6. Enregistrez l'image :
    • dans le sous-répertoire "Personal\Templates\<NomDuGabarit>" d'installation de WINDEV.
    • selon la notation suivante : "RadFen_<N°Fenêtre>.GIF",
      où <N°Fenêtre> correspond au numéro d'identification de la fenêtre associée.
      Type de fenêtreN° d'identification
      Fenêtre vierge00
      Fenêtre menu01
      Fenêtre fiche simple10
      Fenêtre fiche avec parcours02
      Fenêtre fiche avec table reliée06
      Fenêtre fiche avec table de relation07
      Fenêtre fiche avec fiche relié11
      Fenêtre table simple03
      Fenêtre table avec fiche détail05
      Fenêtre table avec table reliée09
      Fenêtre table de relation08
      Fenêtre Vision Plus04
Remarques :
  • Une image spécifique est utilisée lors de l'application d'un gabarit sur un projet. Le nom de cette image doit être : "RadFen.GIF".
  • Il est possible d'éditer le gabarit directement en ouvrant le fichier STY sous l'éditeur.
Version minimum requise
  • Version 9
Commentaires
Cliquez sur [Ajouter] pour publier un commentaire

Dernière modification : 06/09/2023

Signaler une erreur ou faire une suggestion | Aide en ligne locale