DOCUMENTATION EN LIGNE
DE WINDEVWEBDEV ET WINDEV MOBILE

Aide / Développer une application ou un site / Gabarits et Ambiances
  • Présentation
  • Principe
  • Etape 1 : Création du répertoire contenant les sources du gabarit
  • Etape 2 : Personnalisation des différents éléments du gabarit
  • Etape 3 : Génération du 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
Présentation
Les équipes de développement possédant des compétences en infographie désirent parfois créer leurs propres gabarits. A partir de la version 21, un générateur de gabarits WINDEV et WINDEV Mobile est livré en standard.
Principe
Pour créer un gabarit, il est nécessaire de :
  1. Créer le répertoire contenant les sources du gabarit. Cette étape est réalisée via un assistant.
  2. Personnaliser les différentes images, des modèles de fenêtres et des modèles d'états du gabarit.
  3. Générer le gabarit personnalisé. Cette étape est réalisée via un assistant.
Le gabarit personnalisé est automatiquement proposé avec les gabarits standard lors de la création de projets ou lors de l'application d'un gabarit.
Etape 1 : Création du répertoire contenant les sources du gabarit
Pour créer le répertoire correspondant au gabarit :
  1. Lancez WINDEV ou WINDEV Mobile.
  2. Sous le volet "Outils", dans le groupe "Gabarits", cliquez sur "Générateur de gabarits".
    Attention : Aucun projet ne doit être ouvert sous l'éditeur car le générateur effectue de nombreuses opérations (compilations, synchronisation des styles et des modèles, ...).
  3. L'assistant de génération d'un gabarit se lance.
  4. Sélectionnez l'option "Générer les sources d'un nouveau gabarit". Passez à l'étape suivante grâce aux boutons fléchés.
  5. Indiquez le nom du gabarit. Le chemin du répertoire de travail (contenant les sources du gabarit) est automatiquement proposé. Ce chemin peut être modifié si nécessaire.
  6. Passez à l'étape suivante. Les fichiers source du gabarit ont été automatiquement générés dans le répertoire de travail indiqué. Différents répertoires sont créés. Ces répertoires contiennent les images et les modèles qui seront utilisés pour la génération du gabarit final.
Il est possible de personnaliser les images et les modèles de fenêtres du gabarit (étape 2).
Etape 2 : Personnalisation des différents éléments du gabarit
Avant de générer le gabarit, il est possible de personnaliser :
  • les différentes images utilisées pour définir le style des champs dans le gabarit.
  • les modèles de fenêtres.
  • les modèles d'états.
Pour plus de détails, consultez :
Etape 3 : Génération du gabarit
Pour générer le gabarit :
  1. Lancez WINDEV ou WINDEV Mobile.
  2. Sous le volet "Outils", dans le groupe "Gabarits", cliquez sur "Générateur de gabarits".
    Attention : Aucun projet ne doit être ouvert sous l'éditeur car le générateur effectue de nombreuses opérations (compilations, synchronisation des styles et des modèles, ...).
  3. L'assistant de génération d'un gabarit se lance.
  4. Sélectionnez l'option "Générer un gabarit personnalisé". Passez à l'étape suivante grâce aux boutons fléchés.
  5. Sélectionnez le gabarit voulu et son répertoire.
    Si le nom du gabarit n'apparaît pas dans la liste, utilisez le bouton "Charger un gabarit depuis le disque...". Passez à l'étape suivante grâce aux boutons fléchés.
  6. Les différentes étapes suivantes permettent de personnaliser les couleurs utilisées dans les différents styles du gabarit. Dans certains cas, si les styles utilisent des images, ces couleurs ne seront pas visibles.
  7. L'étape "Textes" permet de sélectionner :
    • la police de caractères :
      • La police générale, utilisée dans tous les styles.
      • La police secondaire, utilisée pour quelques styles très spécifiques.
    • les couleurs de la police. Ces couleurs sont utilisées selon le type de texte :
      • Général : Utilisée pour les libellés des champs.
      • Lien : Utilisé notamment pour le style BTN_Lien du champ Bouton.
      • Titre : Utilisé notamment pour le style LIB_Titre du champ Libellé.
      • Zone de saisie : Utilisé pour la zone de texte des champs de saisie et des combos.
      • Léger : Utilisé dans certains cas comme une déclinaison de la couleur générale.
      • Sous-titre : Utilisé notamment pour le style LIB_Sous_Titre du champ Libellé.
      • Sélectionné : Utilisé pour montrer une sélection dans un champ.
      • Gris : Utilisé pour obtenir un texte "grisé".
      • Titre du sélecteur : Utilisé pour le titre des champs Sélecteur et Interrupteur.
      • Bouton/Barre de titre : Utilisée pour les libellés des boutons et les libellés des entêtes des champs Planning, Table, Agenda, ...
      • Négatif : Utilisé comme couleur négative de la couleur générale.
  8. L'étape "Fonds" permet de sélectionner les couleurs pour :
    • Fenêtre/Lignes paires : Couleur de fond des fenêtres et couleurs des lignes paires dans les champs Table, Zone répétée, Planning, Agenda, ...
    • Champs/Lignes impaires : Couleur de fond de certains champs et couleurs des lignes impaires dans les champs Table, Zone répétée, Planning, Agenda, ...
    • Zone de saisie : Couleur de fond des zones de saisie des champs de saisie et des combos.
    • Bouton/Barre de titre : Utilisée pour les fonds des boutons et les fonds d'entête des champs Planning, Table, Agenda, ...
    • Survol : Couleur de fond affiché lors du survol d'un champ. Utilisé pour tous les champs qui prennent en charge le survol (sauf pour les boutons).
    • Sélection : Couleur de fond utilisée pour montrer que le champ est sélectionné. Ne concerne pas les boutons.
    • Léger : Couleur de fond utilisée dans certains cas comme une déclinaison de la couleur de fond de la fenêtre.
  9. L'étape "Cadres" permet de sélectionner les couleurs pour :
    • Général : Couleur des cadres des champs.
    • Secondaire : Couleur des cadres des champs utilisée comme une déclinaison du cadre général.
    • Bouton : Utilisée pour le cadre des boutons.
    • Zone de saisie : Couleur utilisée pour le cadre de la zone de saisie (champ de saisie et combo).
    • Sélecteur/Interrupteur : Couleur utilisée pour le cadre de la coche.
  10. L'étape "Autres couleurs" permet de sélectionner les couleurs :
    • Couleurs Divers :
      • Note : Couleur de fond d'une note. La couleur du libellé sera la couleur de texte "Général".
      • Attention : Couleur de fond d'un avertissement. La couleur du libellé sera la couleur de texte "Général".
      • Dégradé début et dégradé fin : Utilisée pour certains fonds colorés de champs.
    • Couleurs Ascenseurs : Permet de définir les couleurs des différents éléments d'un champ Ascenseur. Il est possible de choisir si les ascenseurs affichent des flèches ou non.
    • Couleurs Jauges : Permet de définir les couleurs des différents éléments d'une Jauge.
    • Couleurs Potentiomètres : Permet de définir les couleurs des différents éléments d'un champ Potentiomètre.
  11. WINDEV L'étape "Menu et séries" permet de sélectionner les couleurs utilisées par les menus et par les séries et catégories des graphes. Si l'option "Personnaliser les couleurs de menus" n'est pas cochée, les couleurs système sont utilisées.
    • Barre principale : Couleurs utilisées pour la barre de menu.
    • Options de menu : Couleurs utilisées pour les options de menu.
    • Couleurs des séries/catégories : le bouton "Editer les couleurs des séries / catégories / rendez-vous" permet d'ouvrir la fenêtre d'édition des couleurs.
      Dans cette fenêtre, cochez l'option "Personnaliser les couleurs utilisées dans les séries (série de champ graphe, rendez-vous de planning, etc.)" pour modifier les couleurs utilisées.
      Les couleurs utilisées par défaut sont affichées. Il est possible de personnaliser les couleurs utilisées.
      Attention : Les couleurs utilisées ne doivent pas être des dégradés d'une même teinte.
    WINDEV Mobile L'étape "Action Bar" permet de sélectionner les couleurs utilisées par le champ Action Bar.
    • Si l'option "Appliquer la couleur de police aux icônes" est cochée, la couleur de texte sera utilisée pour le texte des images dans l'Action Bar.
    • iPhone/iPad Il est possible de spécifier les couleurs pour la barre système à fond transparent (iOS 7).
  12. L'étape "Etats" permet de sélectionner les couleurs utilisées pour les états générés avec l'éditeur d'états :
    • Couleurs de texte : Couleurs utilisées pour les libellés générés automatiquement.
    • Couleurs de fond : Couleurs de fond des différentes zones composant un état.
  13. Passez à l'étape suivante et terminez l'assistant.
  14. Le gabarit est généré. Il peut être utilisé dans vos projets WINDEV ou WINDEV Mobile.
Remarque : les fichiers du gabarit personnalisé se trouvent :
  • WINDEV En WINDEV : dans le sous-répertoire "Personal\Templates\WD".
  • WINDEV Mobile En WINDEV Mobile : dans le sous-répertoire "Personal\Templates\WM".
Pour utiliser votre gabarit :
  • Créez un nouveau projet utilisant votre gabarit,
  • Ouvrez un projet sous WINDEV ou WINDEV Mobile et appliquez le nouveau gabarit (sous le volet "Projet", dans le groupe "Autres actions", cliquez sur "Appliquer un gabarit au projet").
Version minimum requise
  • Version 21
Documentation également disponible pour…
Commentaires
Cliquez sur [Ajouter] pour publier un commentaire

Dernière modification : 18/09/2023

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