DOCUMENTATION EN LIGNE
DE WINDEVWEBDEV ET WINDEV MOBILE

Aide / Développer une application ou un site / Champs, fenêtres et pages / Fenêtre
  • Présentation
  • Image de fond d'une fenêtre
  • Champ Image
  • Champ Bouton
  • Configurer le mode 9 Images
  • Optimiser le mode 9 images
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
Le mode 9 images permet de redimensionner harmonieusement des images. Le mode 9 images peut être utilisé aussi bien sur des images présentes dans un champ Image que sur l'image de fond d'une fenêtre.
Le principe du mode 9 images est simple : l'image utilisée est découpée en 9 zones. Il est ensuite possible de définir le comportement de chaque zone lors du redimensionnement du champ Image ou de la fenêtre.
Image de fond d'une fenêtre
Pour définir le mode 9 images de l'image de fond d'une fenêtre :
  1. Affichez la fenêtre de description de la fenêtre.
  2. Dans l'onglet "Image", sélectionnez l'option "Utiliser le mode 9 images" et configurez ce mode grâce au bouton Paramétrage.
  3. La fenêtre suivante apparaît :
    Options d'affichage du mode 9 images
  4. Configurez le mode 9 images selon vos souhaits. Le bouton "Aperçu" permet à tout moment de voir comment sera affichée l'image en exécution.
Remarque : Voici quelques conseils pour optimiser la vitesse d'affichage des fenêtres utilisant le mode 9 images :
  • ne pas utiliser une image de type "Gif transparent" avec le mode 9 images.
  • utiliser un fond uni pour l'image, et pour la couleur de fond de la fenêtre.
  • tenter d'avoir des marges multiples de 4.
Champ Image
Pour définir le mode 9 images d'un champ Image :
  1. Affichez la fenêtre de description du champ.
  2. Dans l'onglet "Général", sélectionnez l'option "Utiliser le mode 9 images" et configurez ce mode grâce au bouton Paramétrage.
Remarque : il est déconseillé d'utiliser une image de type "Gif transparent" avec le mode 9 images car l'affichage peut être ralenti.
Champ Bouton
Pour définir le mode 9 images d'un champ Bouton :
  1. Affichez la fenêtre de description du champ.
  2. Dans l'onglet "Général", sélectionnez l'option "Etirement : Mode 9 image personnalisé" et configurez ce mode grâce au bouton Paramétrage.
Remarque : il est déconseillé d'utiliser une image de type "Gif transparent" avec le mode 9 images car l'affichage peut être ralenti.
Configurer le mode 9 Images
Le mode 9 images consiste à découper l'image de fond en 9 zones.
Découpage du mode 9 images
Pour chaque zone, il est possible de définir si la partie de l'image correspondant à la zone doit être affichée ou non : il suffit de cliquer dans la zone pour la rendre visible ou invisible. Si la partie de l'image n'est pas affichée, elle sera remplacée par la couleur de fond de la fenêtre ou du champ.
Les marges permettent de définir la taille de chaque zone. Il est possible de saisir directement les valeurs des différentes zones ou de déplacer directement la ligne correspondant à la marge.
Lors du redimensionnement de la fenêtre, seules les zones 2, 4, 6, 8 et 5 changent de taille pour occuper tout l'espace :
Redimensionnement en mode 9 images
Le mode 9 images permet de gérer le fonctionnement de chaque zone lors du redimensionnement de la fenêtre. Pour chaque zone, l'image sera agrandie :
  • soit en répétant l'image qui compose la zone
  • soit en étirant l'image qui compose la zone
Dans la fenêtre de configuration du mode 9 images :
  • L'option "Mode largeur" paramètre la gestion de l'agrandissement pour les zones 2 et 8 (zone Haut et zone Bas)
  • L'option "Mode hauteur" paramètre la gestion de l'agrandissement pour les zones 4 et 6 (zone Gauche et zone Droite)
  • L'option "Mode centre" paramètre la gestion de l'agrandissement pour la zone 5 (zone Centre)
Optimiser le mode 9 images
Voici quelques conseils pour optimiser le mode 9 images :
  • Utilisez des multiples de 8 dans les marges en largeur.
  • La largeur de la zone centrale doit être au moins égale à 32 pixels.
Version minimum requise
  • Version 9
Documentation également disponible pour…
Commentaires
Cliquez sur [Ajouter] pour publier un commentaire

Dernière modification : 25/05/2022

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