PC SOFT

DOCUMENTATION EN LIGNE
DE WINDEV, WEBDEV ET WINDEV MOBILE

  • Présentation du champ Vignette
  • Créer un champ Vignette
  • Créer un champ Vignette
  • Description d'un champ Vignette
  • Assistant de génération d'images
Produits
WINDEVWEBDEV - Code ServeurWEBDEV - Code NavigateurWINDEV MobileEtats et Requêtes
Plateformes
WindowsLinuxWindows MobileUniversal Windows 10 AppAndroidWidget AndroidiPhone/iPadApple Watch
Langages
JavaPHPAjaxCode Utilisateur (MCU)Langage Externe
Bases de données
HFSQLHFSQL Client/ServeurProcédures stockéesOLE DBODBCAccès Natifs
Présentation du champ Vignette
Le champ Vignette permet de gérer automatiquement l'affichage des images sous forme de vignettes.
Lors d'un clic sur la vignette, l'image originale sera automatiquement affichée :
  • soit dans une nouvelle fenêtre du navigateur soit dans un nouvel onglet du navigateur (selon la configuration du navigateur).
  • Versions 16 et supérieures
    soit sous forme de popup (automatique ou dans un champ Image d'une cellule).
    Nouveauté 16
    soit sous forme de popup (automatique ou dans un champ Image d'une cellule).
    soit sous forme de popup (automatique ou dans un champ Image d'une cellule).
Aucune ligne de code n'est nécessaire.
Ce type de champ simplifie beaucoup la création de pages "Catalogue".
Versions 15 et supérieures
PHP Le champ Vignette est disponible en PHP.
Nouveauté 15
PHP Le champ Vignette est disponible en PHP.
PHP Le champ Vignette est disponible en PHP.
Créer un champ Vignette

Créer un champ Vignette

Pour créer un champ Vignette :
  1. Sous l'éditeur de pages, cliquez sur l'icône (ou sélectionnez l'option "Insertion .. Champ .. Vignette").Sous le volet "Création", dans le groupe "Champs usuels", déroulez "Image" et sélectionnez "Vignette".
  2. Cliquez dans la page à la position où le champ doit être créé. Le champ est automatiquement créé.
Pour afficher les caractéristiques du champ, sélectionnez l'option "Description" dans le menu contextuel du champ.

Description d'un champ Vignette

Voici les caractéristiques importantes de la description d'un champ Vignette. Ces caractéristiques sont présentes dans les différents onglets de la fenêtre description du champ :
  • Type de l'image originale (onglet "Général"). Pour plus de détails sur le type d'image à choisir (statique, dynamique, ...), consultez Choisir le type d'image.
  • Image originale (onglet "Général") : Le champ "Image" permet d'indiquer le chemin de l'image grand format associée au champ Vignette. Cette image sera automatiquement affichée lors du clic sur la vignette.
  • Image de la vignette (onglet "Général"). Ce champ permet d'indiquer le chemin de l'image qui sera utilisée comme vignette. Il est ainsi possible d'afficher dans le champ Vignette une image différente de l'image originale. Si ce champ n'est pas renseigné, l'image de la vignette est automatiquement générée par WEBDEV à partir de l'image originale.
  • Mode d'affichage et transparence (onglet "Général"). Pour plus de détails, consultez Choisir le mode d'affichage de l'image. Seuls les modes "Homothétique centré" et "Etiré" sont disponibles.
  • Protection des images (onglet "Général") : Si cette option est cochée, le menu contextuel de la vignette ne pourra pas être affiché dans le navigateur. Toutes les manipulations de la vignette disponibles au niveau du navigateur (enregistrement, impression, ...) ne pourront pas être réalisées.
    Attention : seule l'image affichée en vignette est protégée. L'image ouverte dans le nouveau navigateur n'est pas protégée. Le menu contextuel de cette image sera affiché.
    Protection des images (onglet "Détail") : Si cette option est cochée, le menu contextuel de la vignette ne pourra pas être affiché dans le navigateur. Toutes les manipulations de la vignette disponibles au niveau du navigateur (enregistrement, impression, ...) ne pourront pas être réalisées.
    Attention : seule l'image affichée en vignette est protégée. L'image ouverte dans le nouveau navigateur n'est pas protégée. Le menu contextuel de cette image sera affiché.
  • Versions 15 et supérieures
    Transition (onglet "Général") : Lorsque la valeur du champ vignette est modifiée, une transition peut être sélectionné comme par exemple Fondu, Recouvrement ou Balayage pour rendre le changement d'image plus harmonieux. Pour plus de détails, consultez Animer une image.
    Nouveauté 15
    Transition (onglet "Général") : Lorsque la valeur du champ vignette est modifiée, une transition peut être sélectionné comme par exemple Fondu, Recouvrement ou Balayage pour rendre le changement d'image plus harmonieux. Pour plus de détails, consultez Animer une image.
    Transition (onglet "Général") : Lorsque la valeur du champ vignette est modifiée, une transition peut être sélectionné comme par exemple Fondu, Recouvrement ou Balayage pour rendre le changement d'image plus harmonieux. Pour plus de détails, consultez Animer une image.
  • Versions 16 et supérieures
    Défilement automatique (onglet "Général") : Cette option est accessible uniquement pour les images de type "dynamiques" ou de type "depuis une base de données : chemin". Pour plus de détails, consultez Image avec défilement automatique.
    Nouveauté 16
    Défilement automatique (onglet "Général") : Cette option est accessible uniquement pour les images de type "dynamiques" ou de type "depuis une base de données : chemin". Pour plus de détails, consultez Image avec défilement automatique.
    Défilement automatique (onglet "Général") : Cette option est accessible uniquement pour les images de type "dynamiques" ou de type "depuis une base de données : chemin". Pour plus de détails, consultez Image avec défilement automatique.
  • Destination (onglet "Général"): Cette option permet de choisir l'endroit où l'image originale doit être affichée lors du clic sur la vignette (nouveau navigateur par défaut).
    Versions 16 et supérieures
    Plusieurs destinations permettent un affichage spécifique de l'image de la vignette :
    • Popup Automatique : l'image de la vignette est affichée sous forme de popup dans la page (le fond de la page est grisé). Le style de la popup automatique peut être défini dans l'onglet "Style" du champ Vignette (élément "Popup automatique").
    • Popup personnalisée :
      • si votre page contient une cellule et un champ Image dans la cellule, il est possible d'afficher l'image dans cette cellule. Il suffit de sélectionner le nom de la cellule et du champ Image. L'image de la vignette est affichée dans la cellule sous forme de popup dans la page (le fond de la page est grisé).
      • Versions 17 et supérieures
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.
        Nouveauté 17
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.
    Nouveauté 16
    Plusieurs destinations permettent un affichage spécifique de l'image de la vignette :
    • Popup Automatique : l'image de la vignette est affichée sous forme de popup dans la page (le fond de la page est grisé). Le style de la popup automatique peut être défini dans l'onglet "Style" du champ Vignette (élément "Popup automatique").
    • Popup personnalisée :
      • si votre page contient une cellule et un champ Image dans la cellule, il est possible d'afficher l'image dans cette cellule. Il suffit de sélectionner le nom de la cellule et du champ Image. L'image de la vignette est affichée dans la cellule sous forme de popup dans la page (le fond de la page est grisé).
      • Versions 17 et supérieures
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.
        Nouveauté 17
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.
    Plusieurs destinations permettent un affichage spécifique de l'image de la vignette :
    • Popup Automatique : l'image de la vignette est affichée sous forme de popup dans la page (le fond de la page est grisé). Le style de la popup automatique peut être défini dans l'onglet "Style" du champ Vignette (élément "Popup automatique").
    • Popup personnalisée :
      • si votre page contient une cellule et un champ Image dans la cellule, il est possible d'afficher l'image dans cette cellule. Il suffit de sélectionner le nom de la cellule et du champ Image. L'image de la vignette est affichée dans la cellule sous forme de popup dans la page (le fond de la page est grisé).
      • Versions 17 et supérieures
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.
        Nouveauté 17
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.
        si votre page contient une popup et un champ Image dans la popup, il est possible d'afficher l'image dans cette popup. Il suffit de sélectionner le nom de la popup et du champ Image. L'image de la vignette est affichée dans le champ Image de la popup.

Assistant de génération d'images

Lors de la sélection d'un fichier image (pour l'image originale ou pour la vignette), en fonction de l'image sélectionnée, un assistant apparaît. Cet assistant permet de :
  • compresser automatiquement l'image (cas des images dont la taille dépasse les 20 Ko). Cette option permet également de convertir l'image à un des formats adapté aux pages Internet. Si cette option n'est pas choisie :
    • Si l'image utilise un format non adapté aux pages internet, l'image sera convertie à chaque génération de la page, ce qui peut ralentir cette génération.
    • Si l'image utilise un format adapté aux pages mais est de taille trop élevée, le temps d'affichage de la page pourra être ralenti.
      Si vous choisissez de réaliser la conversion immédiatement, il est possible de sélectionner le format de l'image et sa qualité. Il est également possible d'utiliser le format JPEG progressif. Ce format affiche une image progressivement, pendant que le navigateur charge la page.
  • convertir automatiquement l'image à un des formats adapté aux pages Internet. Si cette option n'est pas choisie, l'image sera convertie à chaque génération de la page, ce qui peut ralentir cette génération. Si vous choisissez de réaliser la conversion immédiatement, il est possible de sélectionner le format de l'image et sa qualité.
  • définir l'emplacement de l'image : il est possible :
    • de copier l'image dans le répertoire du site (répertoire _WEB ou un de ses sous-répertoires) ce qui optimise le temps de génération de la page,
    • de laisser l'image à son emplacement (option conseillée lors du partage du fichier entre plusieurs intervenants).
Version minimum requise
  • Version 10
Commentaires
Cliquez sur [Ajouter] pour publier un commentaire