|
|
|
|
|
|
|
|
|
|
- Présentation
- Galerie en lignes
- Présentation
- Création d'une galerie en lignes
- Caractéristiques de la galerie en lignes
- Galerie en colonnes
- Présentation
- Création d'une galerie en colonnes
- Caractéristiques de la galerie en colonnes
Champ Zone répétée 'Galerie d'images'
Le champ Zone répétée "Galerie d'images" permet de gérer sans programmation l'affichage d'un ensemble d'images. Les images peuvent être de taille et proportion différentes : le champ Galerie d'images se charge d'offrir un affichage harmonieux. La navigation entre les images est automatiquement gérée. Le champ affiche des images présentes dans un répertoire ou provenant d'une base de données ou encore fixées par programmation. Présentation Une galerie d'images en lignes propose une même hauteur pour chaque image de la même ligne. Les lignes n'ont pas forcément la même hauteur : cette hauteur est déterminée automatiquement en fonction des images de la ligne. La Galerie en lignes adapte automatiquement la largeur de chaque répétition pour respecter les proportions de l'image. Un champ Galerie en lignes est conseillé si vous devez afficher uniquement des images (sans texte en dessous par exemple). Création d'une galerie en lignes Caractéristiques de la galerie en lignes - Champ de référence : Une galerie en lignes est composée de répétitions. Chaque répétition contient au moins un champ de référence. Ce champ de référence correspond à un champ Image, un champ Image cliquable ou un champ Vignette. Ce champ de référence permet de définir une taille de référence (une taille minimale).
Ce champ de référence est défini dans l'onglet "Détail" de la fenêtre de description du champ Zone répétée. - Popup de défilement : Il est possible d'ouvrir automatiquement une popup de défilement lors du clic sur le champ de référence :
 Dans la fenêtre de description du champ Zone répétée, dans l'onglet "Détail", cochez l'option "Au clic, ouvrir une popup de défilement automatique".   Dans la fenêtre de description du champ Zone répétée, dans l'onglet "Détail", cochez l'option "Afficher une popup au clic".
- En exécution, la hauteur de chaque ligne s'adapte au contenu affiché dans les répétitions de la ligne.
Attention : le mode d'affichage du champ Image est très important. - Si l'image source est plus petite que le champ Image de référence, en exécution, le mode d'affichage de l'image s'applique.
- Si l'image source est plus haute que large par rapport au champ Image de référence, la hauteur de la ligne pourra être augmentée.
Présentation Une galerie d'images en colonnes propose une même largeur pour chaque répétition de la même colonne. Dans chaque colonne, la hauteur de la répétition peut être variable : cette hauteur est déterminée automatiquement en fonction des images affichées. Création d'une galerie en colonnes Caractéristiques de la galerie en colonnes - Paramétrage du nombre de colonnes (onglet "Détail" de la description du champ) : Il est possible de paramétrer le mode d'affichage des colonnes de la galerie :
- Nombre de colonnes fixe et largeur variable : Si la largeur de la zone répétée permet l'affichage d'une colonne supplémentaire, le nombre de colonnes n'est pas modifié. Seule la largeur des colonnes est modifiée.
- Nombre de colonnes variable et largeur fixe : Si la largeur de la zone répétée permet l'affichage d'une colonne supplémentaire, alors elle est ajoutée. Avant d'ajouter la colonne, les répétitions sont centrées horizontalement.
- Nombre de colonnes variable et largeur variable : Si la largeur de la zone répétée permet l'affichage d'une colonne supplémentaire, alors elle est ajoutée. Avant d'ajouter la colonne, les répétitions sont étirées horizontalement.
- Paramétrage du nombre de colonnes (onglet "Détail" de la description du champ) : Il est possible de paramétrer le mode d'affichage des colonnes de la galerie :
- Largeur de colonnes variable : Si la largeur de la zone répétée permet l'affichage d'une colonne supplémentaire, le nombre de colonnes n'est pas modifié. Seule la largeur des colonnes est modifiée.
- Largeur et nombre de colonnes variables : Si la largeur de la zone répétée permet l'affichage d'une colonne supplémentaire, alors elle est ajoutée. Avant d'ajouter la colonne, les répétitions sont étirées horizontalement.
- Nombre de colonnes variable (à gauche) : Si la largeur de la zone répétée permet l'affichage d'une colonne supplémentaire, alors elle est ajoutée. Les images sont alignées à gauche. Avant d'ajouter la colonne, une zone vide peut apparaître à droite.
- Nombre de colonnes variable (centrées) : Si la largeur de la zone répétée permet l'affichage d'une colonne supplémentaire, alors elle est ajoutée. Avant d'ajouter la colonne, les colonnes sont centrées et une zone vide peut apparaître de part et d'autre des colonnes centrées.
- Largeur et nombre de colonnes fixes (à gauche) : Le nombre de colonnes et la largeur des colonnes ne sont pas modifiés. Les colonnes sont alignées à gauche.
- Largeur et nombre de colonnes fixes (centrées) : Le nombre de colonnes et la largeur des colonnes ne sont pas modifiés. Les colonnes sont centrées.
- Champ de référence : Une galerie en colonnes est composée de répétitions. Chaque répétition contient au moins un champ Image. Le champ Zone répétée "Galerie en colonnes" est associé à ce champ Image (ou un champ Image cliquable ou un champ Vignette). Ce champ permet de définir une taille de référence.
Ce champ de référence est défini dans l'onglet "Détail" de la fenêtre de description du champ Zone répétée. - Popup de défilement : Il est possible d'ouvrir automatiquement une popup de défilement lors du clic sur le champ de référence :
- Dans la fenêtre de description du champ Zone répétée, dans l'onglet "Détail", cochez l'option "Au clic, ouvrir une popup de défilement automatique".
- Dans la fenêtre de description du champ Zone répétée, dans l'onglet "Détail", cochez l'option "Afficher une popup au clic".
- En exécution, la hauteur de chaque répétition s'adapte au contenu affiché.
Attention : le mode d'affichage et les options d'ancrage du champ Image sont très importantes. - Si l'image source est plus petite que le champ Image de référence, en exécution, les dimensions du champ de référence sont appliquées à l'image.
- Si l'image source est plus large que haute par rapport au champ Image de référence, la largeur de la colonne sera augmentée.
Liste des exemples associés :
|
Exemples complets (WEBDEV) : Galerie_Photos
[ + ] Cet exemple est un site de galerie photos et se compose de 2 parties principales : - la partie "visiteur", réalisée en mode AWP et référençable. - la partie administration réalisée en mode WEBDEV classique et sécurisée. Parmi les fonctionnalités proposées, vous y trouverez : - une organisation par albums de vos photos - un lien vers les réseaux sociaux - la possibilité pour les visiteurs de commenter vos publications - la connexion des utilisateurs est gérée via le GPU de WEBDEV - un formulaire de contact - au niveau de l’administration du site, vous pourrez bien évidemment uploader vos photos, les classer par album et aussi les décrire
|
|
Exemples didactiques (WINDEV) : WD Champ Galerie
[ + ] Cet exemple montre l'utilisation du Champ "Galerie d'images".
|
|
Exemples multiplateforme (WINDEV Mobile) : WM Champ Galerie
[ + ] Cet exemple montre l'utilisation du Champ "Galerie d'images".
|
Documentation également disponible pour…
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|