PC SOFT

DOCUMENTATION EN LIGNE
DE WINDEV, WEBDEV ET WINDEV MOBILE

  • Présentation
  • Image associée au libellé du volet d'onglet
  • Image du volet d'onglet
  • Associer une image au volet d'onglet
  • Associer une image au volet d'onglet
  • Couleur de fond / Image de fond des onglets
  • Formats d'images
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaEtats et RequêtesCode Utilisateur (MCU)
WEBDEV
WindowsLinuxPHPWEBDEV - Code Navigateur
WINDEV Mobile
AndroidWidget AndroidiPhone/iPadApple WatchUniversal Windows 10 AppWindows Mobile
Autres
Procédures stockées
Présentation
Pour optimiser le look de vos écrans, WINDEV, WEBDEV et WINDEV Mobile proposent d'utiliser des images ou des couleurs dans vos champs Onglet. Quelques exemples :
  • Image associée au libellé du volet d'onglet. Cette image est intégrée à côté du libellé de l'onglet. Exemple :
  • Image du volet d'onglet : Cette image permet de re-définir la forme et la couleur du volet d'onglet. Exemple :
  • Couleur du cadre des onglets. Exemple :
Remarques :
  • WINDEVWINDEV Mobile Pour utiliser un onglet "Transparent", il suffit de choisir la couleur "Transparent" pour la couleur de fond du cadre extérieur (onglet "Style" de la description du champ, élément "Cadre extérieur").
  • Il est également possible de modifier le look des onglets en modifiant le mode d'affichage des onglets.
Image associée au libellé du volet d'onglet
L'image associée au libellé du volet d'onglet vient s'intégrer à côté du libellé de l'onglet.
Pour associer une image au libellé du volet d'onglet :
  1. Affichez la description de l'onglet.
  2. Dans l'onglet "Général", sélectionnez l'option "Détails (volet)".
  3. Sélectionnez l'image à intégrer à côté du libellé :
    • WINDEVWINDEV Mobile L'image est sélectionnée grâce au bouton [...] présent à côté du champ "Image". Il est également possible de spécifier le nombre d'états de l'image.
    • WEBDEV - Code Serveur L'image est sélectionnée grâce au bouton [...] présent à côté du champ "Icône du volet".
  4. Validez.
WINDEVWINDEV Mobile Pour associer une image au libellé du volet d'onglet :
  1. Affichez la description de l'onglet.
  2. Dans l'onglet "Général", sélectionnez le volet voulu dans la liste des volets à gauche.
  3. La description du volet sélectionné apparaît dans la zone à droite.
  4. Sélectionnez l'image à intégrer à côté du libellé :
    • L'image est sélectionnée grâce au bouton [...] présent à côté du champ "Image". Il est également possible de spécifier le nombre d'états de l'image.
    • Utilisez si nécessaire le bouton "Catalogue" pour sélectionner une image dans le catalogue d'images.
    Sélectionnez l'image à intégrer à côté du libellé via le bouton Bouton déroulant :
    • L'option "Parcourir" permet de sélectionner un fichier accessible depuis votre poste. Il est également possible de spécifier le nombre d'états de l'image.
    • L'option "Catalogue" permet de sélectionner une image dans le catalogue d'images.
  5. Validez.
WEBDEV - Code Serveur Pour associer une image au libellé du volet d'onglet :
  1. Affichez la description de l'onglet.
  2. Dans l'onglet "Général", sélectionnez l'option "Détails (volet)".
  3. Sélectionnez l'image à intégrer à côté du libellé :
    • L'image est sélectionnée grâce au bouton [...] présent à côté du champ "Icône du volet".
    • Utilisez si nécessaire le bouton "Catalogue" pour sélectionner une image dans le catalogue d'images.
    Sélectionnez l'image à intégrer à côté du libellé via le bouton Bouton déroulant présent à côté du champ "Icône du volet" :
    • L'option "Parcourir" permet de sélectionner un fichier accessible depuis votre poste.
    • L'option "Catalogue" permet de sélectionner une image dans le catalogue d'images.
  4. Validez.
Image du volet d'onglet
L'image associée au volet d'onglet remplace le volet d'onglet existant. Il est ainsi possible de redéfinir la forme et la couleur du volet d'onglet.
L'image associée au volet d'onglet doit contenir deux dessins :
  • le dessin correspondant à l'état normal du volet
  • le dessin correspondant à l'état enfoncé du volet
L'ordre des dessins doit être le suivant :
  • WINDEVWINDEV Mobile Dessin état enfoncé puis dessin état normal.
  • WEBDEV - Code Serveur Dessin état normal puis dessin état enfoncé.
Attention : Si le volet est affiché verticalement, l'image du volet devra être verticale.
Cas particulier : image des volets à trois images
Dans ce cas, l'image des volets sera découpée en 3 images automatiquement par WINDEV/WEBDEV.
La règle de découpage est la suivante :
  • l'image est découpée en trois parties
  • la partie 1 correspond à la zone de gauche
  • la partie 3 correspond à la zone de droite
  • la partie 2 correspond à la zone du milieu. La taille de cette partie est égale à 16 pixels. Si le volet d'onglet est proportionnel au libellé, cette partie sera répétée autant de fois que nécessaire pour contenir le libellé.
Remarque : Si la partie 2 de votre image est inférieure à 16 pixels, il est conseillé de ne pas utiliser un volet d'onglet proportionnel au libellé et d'intégrer si nécessaire les images supplémentaires ainsi que le libellé à l'image.
WINDEVWINDEV Mobile

Associer une image au volet d'onglet

Pour associer une image au volet d'onglet :
  1. Affichez la description de l'onglet.
  2. Dans l'onglet "Détail", sélectionnez le chemin de l'image à utiliser pour les volets d'onglets (option "Image des volets"). Plusieurs images peuvent être nécessaires selon la position du volet d'onglet et son mode d'affichage.
  3. Si nécessaire :
    • Cochez l'option "Image des volets avec trois images".
    • WINDEV Indiquez le nombre d'étapes de l'animation.
      Linux Ces options ne sont pas disponibles en Linux.
  4. Validez.
Pour associer une image au volet d'onglet :
  1. Affichez la description de l'onglet.
  2. Dans l'onglet "Style", sélectionnez l'élément "Images des volets". Déroulez le bouton "Images des volets" et sélectionnez les chemins correspondant aux chemins des images à utiliser pour les volets d'onglets. Plusieurs images peuvent être nécessaires selon la position du volet d'onglet et son mode d'affichage.
  3. Si nécessaire :
    • Cochez l'option "Image des volets avec trois images".
    • WINDEV Indiquez le nombre d'étapes de l'animation.
      Linux Ces options ne sont pas disponibles en Linux.
  4. Validez.
WEBDEV - Code ServeurPHP

Associer une image au volet d'onglet

Pour associer une image au volet d'onglet :
  1. Affichez la description de l'onglet.
  2. Dans l'onglet "Style", sélectionnez l'élément "Image des boutons de l'onglet".
  3. Indiquez le chemin de l'image à utiliser pour les volets d'onglets.
  4. Cochez si nécessaire l'option "mode 3 images".
  5. Validez.
Couleur de fond / Image de fond des onglets
WINDEVWINDEV Mobile Pour modifier la couleur du fond des onglets (appelé aussi cadre extérieur), il suffit de modifier le style des onglets (onglet "Style" de la fenêtre de description). L'élément dont le style doit être modifié est "Cadre Extérieur".
  • L'option "Couleur de fond" permet de définir la couleur de fond de tous les volets d'onglet. Il est possible de choisir une couleur "Transparent".
  • L'option "Cadre" permet de définir l'image de fond de tous les volets d'onglet.
Remarque : De nombreux paramètres des onglets peuvent être personnalisés grâce au style.
WEBDEV - Code Serveur WEBDEV permet de modifier la couleur de fond et l'image de fond utilisée pour chaque volet d'onglet. Pour cela :
  1. Affichez la description de l'onglet.
  2. Dans l'onglet "Général", sélectionnez l'option "Bord, Fond (volet)".
  3. Modifiez l'élément voulu :
    • le champ "Couleur de fond" permet de définir la couleur de fond du volet d'onglet sélectionné.
    • le champ "Image de fond" permet de définir l'image de fond utilisée pour le volet d'onglet sélectionné.
Remarques :
  • Il est possible de modifier la couleur du cadre des onglets dans l'onglet "Style". Cet élément est nommé "Séparateur", car il permet de séparer les différents volets.
  • De nombreux paramètres des onglets peuvent être personnalisés grâce au style.
Remarques :
  • Il est possible de modifier la couleur du cadre des onglets dans l'onglet "Style", élément "Boutons des volets d'onglet". Cet élément est nommé "Séparateur", car il permet de séparer les différents volets.
  • De nombreux paramètres des onglets peuvent être personnalisés grâce au style.
Formats d'images
WINDEV Les formats d'images supportés sous Windows sont :
  • Bitmap (*.BMP)
  • Graphics Interchange Format (*.gif)
  • Joint Picture Experts Group (*.jpg ; *.jpeg)
  • Kodak Photo CD (*.pcd)
  • PaintBrush (*.pcx)
  • Adobe Photoshop Format (*.psd)
  • TrueVision TARGA (*.tga)
  • Tagged Image File Format (*.tif ; *.tiff)
    Remarque : l'option "tiff mosaïque" de la norme tiff 6.0 n'est pas supportée. Dans ce cas, il est conseillé d'enregistrer l'image à la norme tiff 5.0.
  • Portable Network Graphics (*.png)
  • Windows MetaFiles (*.emf ; *.wmf)
  • Icônes (*.ico ; *.icw)
    Versions 22 et supérieures
    Remarques :
    • Affichage HQ (Haute Qualité) disponible.
    • Gestion des planches au format BMP transparent (32 bits).
    Nouveauté 22
    Remarques :
    • Affichage HQ (Haute Qualité) disponible.
    • Gestion des planches au format BMP transparent (32 bits).
    Remarques :
    • Affichage HQ (Haute Qualité) disponible.
    • Gestion des planches au format BMP transparent (32 bits).
  • Curseurs (*.cur)
  • Portable Document Format (*.pdf)
  • Versions 15 et supérieures
    Scalable Vector Graphics (*.svg)
    Nouveauté 15
    Scalable Vector Graphics (*.svg)
    Scalable Vector Graphics (*.svg)
  • Versions 22 et supérieures
    Images WINDEV (générées par l'éditeur d'images, *.WDPIC).
    Nouveauté 22
    Images WINDEV (générées par l'éditeur d'images, *.WDPIC).
    Images WINDEV (générées par l'éditeur d'images, *.WDPIC).
Remarque : Pour gérer les formats pdf et svg, vous devez installer la DLL GDIPLUS.DLL pour les postes sous Windows 2000 et inférieur. Pour les versions supérieures, cette DLL est livrée par défaut avec Windows. Pour plus de détails, consultez Framework GDI+.
Windows Mobile Les formats d'images pouvant être affichés sont les suivants :
  • Bitmap (*.BMP)
  • Graphics Interchange Format (*.gif)
  • Joint Picture Experts Group (*.jpg ; *.jpeg)
  • Icônes (*.ico ; *.icw)
Android Les formats d'images pouvant être affichés sont les suivants :
  • Bitmap (*.BMP)
  • Graphics Interchange Format (*.gif)
  • Joint Picture Experts Group (*.jpeg)
  • Portable Network Graphics (*.png)
iPhone/iPad Les formats d'images pouvant être affichés sont les suivants :
  • Bitmap (*.BMP)
  • Graphics Interchange Format (*.gif)
  • Joint Picture Experts Group (*.jpeg)
  • Portable Network Graphics (*.png)
  • Icônes (*.ico ; *.icw)
Version minimum requise
  • Version 9
Documentation également disponible pour…
Commentaires
Cliquez sur [Ajouter] pour publier un commentaire