DOCUMENTATION EN LIGNE
DE WINDEVWEBDEV ET WINDEV MOBILE

Aide / WLangage / Fonctions WLangage / Champs, pages et fenêtres / Fonctions Fenêtres manipulables par l'utilisateur final
  • Présentation
  • Principe
  • Personnaliser l'interface
  • Mise en place et configuration
  • Mise en place
  • Paramétrage pour le projet et les fenêtres
  • Options disponibles
  • Programmation et fonctionnalités avancées
  • Présentation
  • Configurer les options de la modification d'UI par programmation
  • Fonctions WLangage permettant de gérer la modification d'UI
  • Comment connaître le type de modification effectuée par l'utilisateur ?
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
Les applications WINDEV permettent par défaut à l'utilisateur final de modifier l'interface de son application.
L'utilisateur final peut ainsi décider de la présence de certains éléments dans son application, modifier et adapter les fenêtres à son usage personnel.
Aujourd'hui, tout le monde personnalise l'écran de son smartphone, pourquoi ne pas faire de même avec ses applications ?
Principe
Lorsque la modification de l'interface par l'utilisateur final est activée, plusieurs nouvelles options apparaissent en exécution pour l'utilisateur final :
  • Personnaliser l'interface (option du menu contextuel de la fenêtre) : Permet à l'utilisateur final de personnaliser l'interface de la fenêtre (voir ci-dessous).
  • Notes repositionnables (option du menu contextuel de la fenêtre) : Permet à l'utilisateur final d'ajouter des notes repositionnables dans la fenêtre.
    Pour plus de détails, consultez Note repositionnable (FAA).
Pour certains types de champs, une option du menu contextuel permet directement de modifier la bulle d'aide du champ (option "Editer la bulle d'aide").
Remarques :
  • Les options de menu apparaissent uniquement si le menu des FAA est activé sur la fenêtre.
    Rappel : Pour activer le menu des FAA :
    • Affichez l'onglet "UI" de la fenêtre de description de la fenêtre.
    • Déroulez l'option "Menu contextuel" et cochez l'option "Afficher le menu des FAA (Système)".
  • Lors du test d'une fenêtre ou du projet ( et ), les options de modification d'interface sont également disponibles. Si ces options sont utilisées, en fin de test, WINDEV propose automatiquement d'intégrer les modifications effectuées dans la fenêtre en cours. Pour plus de détails, consultez Utilisation de la modification d'IHM lors d'un test de projet ou de fenêtre.

Personnaliser l'interface

Si l'option "Personnaliser l'interface" est sélectionnée, il est possible de passer en mode modification (sous-option "Passer en mode modification").
Dans ce mode, l'utilisateur peut réaliser toutes les manipulations autorisées par le développeur :
  • Sélectionner un ou plusieurs champs,
  • Déplacer un ou plusieurs champs,
  • Créer un fil entre plusieurs champs,
  • Editer la bulle d'aide des champs.
Il est également possible de gérer les modifications en cours :
  • Importer une personnalisation : Importe une personnalisation précédemment exportée (fichier *.wdmodif).
  • Exporter la personnalisation de cette fenêtre : Exporte la personnalisation de la fenêtre en cours sous forme d'un fichier au format ".wdmodif".
  • Exporter toutes les personnalisations de l'application : Exporte la personnalisation de l'application sous forme d'un fichier au format ".wdmodif".
  • Restaurer la configuration initiale : Restaure la configuration initiale voulue par le développeur.
Remarque : Le fichier d'export "*.wdmodif" peut être directement ouvert dans l'éditeur de WINDEV. Dans ce cas, l'éditeur propose d'appliquer les modifications enregistrées directement dans la ou les fenêtres correspondantes dans le projet en cours.
Mise en place et configuration

Mise en place

Par défaut, toutes les applications WINDEV créées ou compilées à partir de la version 21 permettent la modification de l'UI par l'utilisateur final.
Ces options sont configurables :
  • au niveau du projet. Les options seront prises en compte pour toutes les fenêtres du projet.
    Pour configurer la modification de l'interface par l'utilisateur final :
    1. Affichez la fenêtre de description du projet : sous le volet "Projet", dans le groupe "Projet", cliquez sur "Description".
    2. Dans l'onglet "Avancé", cochez l'option "Modification de l'UI par l'utilisateur final".
    3. Le bouton "Options" permet de définir les différentes options autorisées.
  • au niveau de chaque fenêtre. Les options seront prises en compte uniquement pour la fenêtre sélectionnée.
    1. Affichez la fenêtre de description de la fenêtre (option "Description" du menu contextuel de la fenêtre).
    2. Dans l'onglet "Détail", cochez l'option "Modification de l'UI par l'utilisateur final".
    3. Le bouton "Options" permet de définir les différentes options autorisées.
Remarque : Par défaut, le paramétrage des fenêtres correspond au paramétrage du projet.

Paramétrage pour le projet et les fenêtres

Les options de paramétrage de l'UI par l'utilisateur final sont les suivantes :
  • Aucune modification. Décoche automatiquement l'option "Modification de l'UI par l'utilisateur final". L'utilisateur final ne pourra pas modifier l'interface de son application.
    Remarques :
    • Les notes repositionnables ne seront plus utilisables par l'utilisateur final.
    • Les options de modification d'interface ne sont plus disponibles lors du lancement de l'exécutable. Ces options restent disponibles en GO.
  • Par défaut. Affiche et permet d'utiliser les options par défaut. Le bouton "Voir" permet d'afficher les options par défaut. Ces options ne sont pas modifiables.
  • Paramétrage spécifique : Permet de définir les options pour le projet ou pour la fenêtre. Si un paramétrage spécifique est réalisé pour le projet, ces options sont automatiquement reportées sur les fenêtres.

Options disponibles

Les options disponibles pour la modification de l'UI par l'utilisateur final sont les suivantes :
  • Options concernant les champs :
    • Sélection : L'utilisateur peut sélectionner un champ.
    • Sélection multiple : L'utilisateur peut sélectionner plusieurs champs à l'aide de la touche Ctrl ou via la souris.
    • Déplacement : L'utilisateur final peut déplacer les champs dans la fenêtre.
    • Redimensionnement : L'utilisateur final peut redimensionner les champs présent dans la fenêtre.
    • Rendre visible/invisible : L'utilisateur peut rendre visibles ou invisibles des champs (cette option n'est pas disponible dans cette version).
    • Modifier la bulle : L'utilisateur final peut modifier la bulle d'aide du champ.
      Remarque : Une nouvelle option "Editer la bulle d'aide" est disponible. Cette option peut être disponible directement dans le menu contextuel du champ ou uniquement en passant en mode modification de la fenêtre.
  • Options concernant le champ Fil :
    • Ajouter un fil : L'utilisateur final peut créer un champ Fil entre deux champs.
    • Modifier les liaisons d'un fil : L'utilisateur final peut modifier les liaisons d'un champ Fil avec deux champs.
  • Options concernant les notes repositionnables (pour plus de détails sur les notes repositionnables, consultez Note repositionnable (FAA)).
    • Ajouter une note repositionnable : L'utilisateur final aura la possibilité d'ajouter une note repositionnable dans les fenêtres de l'application (ou dans la fenêtre en cours). La fenêtre contiendra l'option de menu "Notes repositionnables .. Créer une note repositionnable".
    • Modifier le texte : L'utilisateur final aura la possibilité de modifier le texte de la note repositionnable.
    • Enroulé ou déroulé : L'utilisateur final pourra enrouler ou dérouler la note repositionnable.
    • Enroulé automatique : L'utilisateur final pourra utiliser le mode "Enroulé automatique" : la note repositionnable se réduira automatiquement après 5 secondes.
Programmation et fonctionnalités avancées

Présentation

Le WLangage propose plusieurs propriétés et fonctions permettant de mettre en place et de gérer la modification de l'UI par l'utilisateur.
Grâce à ces fonctions, il est notamment possible de décrire un éditeur en WLangage, avec gestion du undo/redo.

Configurer les options de la modification d'UI par programmation

Pour configurer les options de la modification d'UI par programmation :
  1. Utilisez la propriété FenEditionMode pour configurer les actions autorisées sur la fenêtre et ses champs lorsque la fenêtre passe en mode "Modification de l'UI par l'utilisateur final".
  2. Utilisez la propriété FenEditionAutorisée pour configurer les manipulations autorisées sur un champ lorsque la fenêtre passe en mode "Modification de l'UI par l'utilisateur final".
Remarque : Pour ne pas permettre la configuration d'UI sur une fenêtre, il est possible d'utiliser la fonction FAADésactive avec la constante faaPersonnaliserUI. Dans ce cas, le menu contextuel "Personnaliser l'interface" ne sera plus disponible.

Fonctions WLangage permettant de gérer la modification d'UI

Ces fonctions peuvent être regroupées par thèmes :
  • Fonctions d'activation et de sauvegarde :
    FenEdActivePermet :
    • de savoir si le mode "Modification de l'UI par l'utilisateur final" est activé dans une fenêtre (ou une fenêtre interne).
    • d'activer ou non le mode "Modification de l'UI par l'utilisateur final" dans une fenêtre (ou une fenêtre interne).
    FenEdChargeCharge les modifications faites par l'utilisateur final dans une fenêtre.
    FenEdRestaureAnnule toutes les modifications effectuées par l'utilisateur final (mode "Modification de l'UI par l'utilisateur final" activé).
    FenEdSauveSauve les modifications réalisées en mode "Modification de l'UI par l'utilisateur final".
    FenEdSauveNoteExporte les notes repositionnables créées par l'utilisateur dans un fichier.
  • Fonctions de gestion de la sélection de champs :
    FenEdDésélectionneToutDésélectionne tous les champs lors de la modification de l'interface par l'utilisateur final (mode "Modification de l'UI par l'utilisateur final" activé).
    FenEdSelectRenvoie l'un des champs sélectionnés lors de la modification de l'interface par l'utilisateur final (mode "Modification de l'UI par l'utilisateur final" activé).
    FenEdSelectMoinsDé-sélectionne un champ lors de la modification de l'interface par l'utilisateur final (mode "Modification de l'UI par l'utilisateur final" activé).
    FenEdSelectOccurrenceIndique le nombre de champs sélectionnés lors de la modification de l'interface par l'utilisateur final (mode "Modification de l'UI par l'utilisateur final" activé).
    FenEdSelectPlusSélectionne un champ lors de la modification de l'interface par l'utilisateur final (mode "Modification de l'UI par l'utilisateur final" activé).
  • Fonctions de gestion du Undo/Redo :
    FenEdDéclareUndoDéclare comment annuler une action ajoutée avec la fonction FenEdDo.
    FenEdDoExécute une action (définie par programmation) avec support du Undo/Redo.
    FenEdRedoExécute la dernière action annulée lors de la modification de l'interface par l'utilisateur final (mode "Modification de l'UI par l'utilisateur final" activé).
    FenEdUndoAnnule la dernière action effectuée lors de la modification de l'interface par l'utilisateur final (mode "Modification de l'UI par l'utilisateur final" activé).

Comment connaître le type de modification effectuée par l'utilisateur ?

Lorsque l'utilisateur effectue une modification d'interface (sélection, déplacement ou redimensionnement), un événement spécifique est exécuté.
Pour connaître le type de modification, il suffit d'associer un événement à la modification d'interface. Cette opération peut être effectuée grâce à la propriété Traitement et aux constantes suivantes :
trtFenEdChangeTailleEvénement exécuté lors du changement de taille des champs.
trtFenEdDéplacementEvénement exécuté lors du déplacement des champs.
trtFenEdSélectionEvénement exécuté lors de la sélection des champs.

Remarque : Dans la procédure appelée par la propriété Traitement, il est également possible d'effectuer un traitement spécifique selon les modifications effectuées par l'utilisateur.
Liste des exemples associés :
WD Objets Graphiques Exemples didactiques (WINDEV) : WD Objets Graphiques
[ + ] Cet exemple didactique illustre la puissance du WLangage en matière de programmation orientée objet.
Cet exemple est un éditeur d'objets graphiques.

Il est possible de :
- déplacer, redimensionner les objets
- effectuer des sélections au lasso ou à la souris
- couper/copier/coller des objets
- supprimer/dupliquer des objets
- enregistrer les documents créés et de les imprimer.

Les principales fonctionnalités techniques présentées et documentées sont les suivantes :
- gestion d'un presse-papiers d'objets
- gestion du UNDO/REDO
- sérialisation et désérialisation d'objets
- algorithmes de gestion d'objets graphiques (redimensionnements proportionnels, gestion de règles de déplacement, etc...)
WD Application Interactive Exemples didactiques (WINDEV) : WD Application Interactive
[ + ] Cet exemple montre l'utilisation des fonctions FenEdXXX dans une application interactive.
Cette application permet de gérer une maison connectée (allumer les lumières, connaître la température).

Les fonctions FenEdXXX permettent de déplacer les champs sur le plan de la maison, tout en bénéficiant de fonctionnalités avancées comme la sauvegarde des modifications, l'annulation,...
Version minimum requise
  • Version 21
Commentaires
Cliquez sur [Ajouter] pour publier un commentaire

Dernière modification : 07/06/2023

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