PC SOFT

DOCUMENTATION EN LIGNE
DE WINDEV, WEBDEV ET WINDEV MOBILE

  • Présentation
  • L'effet parallaxe dans l'éditeur de fenêtres
  • Présentation
  • Définir l'effet de parallaxe sous l'éditeur de fenêtres
  • Définir le parallaxe par programmation
  • L'effet parallaxe dans l'éditeur de pages
  • Présentation
  • Définir l'effet de parallaxe sous l'éditeur de pages
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
Les effets de type "Parallaxe" permettent de faire défiler les éléments constituant l'interface a des vitesses différentes lorsque l'ascenseur est utilisé.
Il est possible de définir :
  • un parallaxe de champs : Dans une fenêtre et dans une page, les animations de type parallaxe permettent de paramétrer la vitesse de déplacement et de réduction du champ par rapport au déplacement de l'ascenseur de la fenêtre (ou de la page).
  • un parallaxe d'image de fond : Dans une page, il est possible d'utiliser une animation de type parallaxe sur les images de fond. Lorsque l'utilisateur utilise l'ascenseur, l'image de fond pourra utiliser une vitesse de déplacement spécifique par rapport au déplacement de l'ascenseur de la page.
Les effets de type Parallaxe sont disponibles :
Versions 22 et supérieures
WEBDEV - Code ServeurWEBDEV - Code Navigateur Cette fonctionnalité est désormais disponible pour les sites WEBDEV.
Nouveauté 22
WEBDEV - Code ServeurWEBDEV - Code Navigateur Cette fonctionnalité est désormais disponible pour les sites WEBDEV.
WEBDEV - Code ServeurWEBDEV - Code Navigateur Cette fonctionnalité est désormais disponible pour les sites WEBDEV.
WINDEVWINDEV Mobile
L'effet parallaxe dans l'éditeur de fenêtres

Présentation

L'éditeur de fenêtres propose un effet de parallaxe de champ.
Quelques exemples :
  • Si aucun parallaxe n'est défini, le champ se déplace à la même vitesse que l'ascenseur de la fenêtre.
  • Si le champ est fixe, le champ ne changera pas de place même si l'ascenseur est utilisé.
  • Le parallaxe permet de réaliser des effets spécifiques, par exemple en faisant varier la vitesse de déplacement du champ (ou son taux de réduction) par rapport à la vitesse de déplacement de l'ascenseur de la fenêtre.

Définir l'effet de parallaxe sous l'éditeur de fenêtres

Pour définir l'effet de parallaxe d'un champ :
  1. Affichez la fenêtre de description du champ.
  2. Dans l'onglet "IHM", déroulez l'option "Parallaxe".
  3. Choisissez l'option voulue :
    • Aucun parallaxe : Le champ se déplace en hauteur selon le déplacement de l'ascenseur de la fenêtre.
    • Effet Material Design sans réduction : Le champ se déplace en hauteur proportionnellement au déplacement de l'ascenseur de la fenêtre. Dans ce cas, la vitesse de déplacement est de 50% et la vitesse de réduction est de 0%.
    • Effet matérial Design avec réduction : Le champ se réduit en hauteur proportionnellement au déplacement de l'ascenseur de la fenêtre. Dans ce cas, la vitesse de déplacement est de 50% et la vitesse de réduction est de 50%.
      Dans le cas d'un champ Image, l'image suit le mode d'affichage.
      • Si l'image est étirée, elle sera déformée pour apparaître en entier dans la hauteur du champ.
      • Si l'image est homothétique centrée, elle sera réduite proportionnellement à la hauteur du champ.
    • Champ fixe : Le champ est fixe. Il ne se déplace pas dans la fenêtre. Il est toujours visible lors du déplacement de l'ascenseur de la fenêtre. Dans ce cas, la vitesse de déplacement est de 0% et la vitesse de réduction est de 100%.
    • Personnaliser l'effet : Il est possible de saisir le taux de parallaxe Y (vitesse de déplacement du champ) et le taux de parallaxe Hauteur (vitesse de réduction du champ).
Remarque : L'effet parallaxe est disponible pour tous les types de champs.

Définir le parallaxe par programmation

Pour définir le parallaxe d'un champ par programmation, utilisez les propriétés suivantes :
Versions 21 et supérieures
TauxParallaxeHauteur
TauxParallaxeHauteur
La propriété ..TauxParallaxeHauteur permet de connaître et d'indiquer à quelle vitesse un champ est réduit lorsque l'ascenseur de la fenêtre, de la fenêtre interne ou de la page se déplace.
Versions 21 et supérieures
TauxParallaxeY
Nouveauté 21
TauxParallaxeY
TauxParallaxeY
La propriété ..TauxParallaxeY permet de connaître et d'indiquer à quelle vitesse un champ se déplace lorsque l'ascenseur de la fenêtre, de la fenêtre interne ou de la page se déplace.
WEBDEV - Code ServeurWEBDEV - Code Navigateur
L'effet parallaxe dans l'éditeur de pages

Présentation

L'éditeur de pages propose un effet de parallaxe de champ et un effet parallaxe d'image de fond.
Ces effets parallaxes sont disponibles pour les champs suivants :
  • Cellule.
  • Zone de mise en page.
  • Zone de texte riche.
  • Champ de type "Modèle de champs".

Définir l'effet de parallaxe sous l'éditeur de pages

Pour définir l'effet de parallaxe d'un champ :
  1. Affichez la fenêtre de description du champ.
  2. Dans l'onglet "Style", sélectionnez l'élément "Effets".
  3. Pour ajouter un effet parallaxe de champ :
    • Cliquez sur le bouton "Ajouter un effet" et sélectionnez "Parallaxe".
    • L'effet est ajouté au style. Cliquez sur le bouton "Détail" pour configurer l'effet.
    • Dans la fenêtre qui s'affiche, choisissez l'option voulue :
      Configuration effet parallaxe de champ
      • Effet déclenché par programmation. Dans ce cas :
        • les taux parallaxes Y et hauteur sont mis à zéro. L'effet est paramétré grâce aux propriétés :
          Versions 21 et supérieures
          TauxParallaxeHauteur
          TauxParallaxeHauteur
          La propriété ..TauxParallaxeHauteur permet de connaître et d'indiquer à quelle vitesse un champ est réduit lorsque l'ascenseur de la fenêtre, de la fenêtre interne ou de la page se déplace.
          Versions 21 et supérieures
          TauxParallaxeY
          Nouveauté 21
          TauxParallaxeY
          TauxParallaxeY
          La propriété ..TauxParallaxeY permet de connaître et d'indiquer à quelle vitesse un champ se déplace lorsque l'ascenseur de la fenêtre, de la fenêtre interne ou de la page se déplace.
      • Effet Material Design sans réduction : Le champ se déplace en hauteur proportionnellement au déplacement de l'ascenseur de la page. Dans ce cas, la vitesse de déplacement est de 50% et la vitesse de réduction est de 0%.
      • Effet matérial Design avec réduction : Le champ se réduit en hauteur proportionnellement au déplacement de l'ascenseur de la page. Dans ce cas, la vitesse de déplacement est de 50% et la vitesse de réduction est de 50%.
      • Champ fixe : Le champ est fixe. Il ne se déplace pas dans la page. Il est toujours visible lors du déplacement de l'ascenseur de la page. Dans ce cas, la vitesse de déplacement est de 0% et la vitesse de réduction est de 100%.
      • Personnaliser l'effet : Il est possible de saisir le taux de parallaxe Y (vitesse de déplacement du champ) et le taux de parallaxe Hauteur (vitesse de réduction du champ).
    • Validez.
  4. Pour ajouter un effet parallaxe d'image de fond :
    • Cliquez sur le bouton "Ajouter un effet" et sélectionnez "Parallaxe sur l'image de fond".
    • L'effet est ajouté au style. Cliquez sur le bouton "Détail" pour configurer l'effet.
      Configuration effet parallaxe d'image de fond
    • Dans la fenêtre qui s'affiche, choisissez l'option voulue :
      • Fond fixe dans le navigateur : L'image est est fixe. Elle ne se déplace pas dans la fenêtre. Elle est toujours visible lors du déplacement de l'ascenseur de la fenêtre. C'est le champ conteneur qui est déplacé en même temps que la page. Selon la taille du champ conteneur, la portion de l'image affiché en fond change. Dans ce cas, la vitesse de déplacement est de 0% et la vitesse de réduction est de 100%.
      • Personnaliser l'effet : Il est possible de saisir le taux de parallaxe Y (vitesse de déplacement du champ). Dans ce cas, l'image de fond se déplace plus ou moins vite par rapport au déplacement du champ associé.
    • Validez.
Remarques :
  • L'effet parallaxe sur l'image de fond est visualisable sous l'éditeur de pages (WYSIWYG). Il suffit de déplacer l'ascenseur vertical.
  • Si l'image de fond utilisée n'est pas assez grande pour obtenir l'effet escompté, l'image est agrandie homothétiquement.
  • L'effet parallaxe sur l'image de fond n'est pas modifiable par programmation.
  • Quelques soit les options de l'effet parallaxe de champ choisi, il est possible de le paramétrer par programmation avec les propriétés :
    Versions 21 et supérieures
    TauxParallaxeHauteur
    TauxParallaxeHauteur
    La propriété ..TauxParallaxeHauteur permet de connaître et d'indiquer à quelle vitesse un champ est réduit lorsque l'ascenseur de la fenêtre, de la fenêtre interne ou de la page se déplace.
    Versions 21 et supérieures
    TauxParallaxeY
    Nouveauté 21
    TauxParallaxeY
    TauxParallaxeY
    La propriété ..TauxParallaxeY permet de connaître et d'indiquer à quelle vitesse un champ se déplace lorsque l'ascenseur de la fenêtre, de la fenêtre interne ou de la page se déplace.
Version minimum requise
  • Version 21
Documentation également disponible pour…
Commentaires
Cliquez sur [Ajouter] pour publier un commentaire