Création du champ

1. Sous le volet "Création", dans le groupe "Conteneurs", déroulez "Disposition" et choisissez l'orientation : horizontale ou verticale.
2. Cliquez dans la fenêtre ou la page à la position où le champ doit être créé. Le champ apparaît en création.
   Remarque : Les dimensions du champ créé sont optimisées pour occuper l'espace disponible à la position indiquée. Si la taille du champ ne vous convient pas, redimensionnez le champ grâce à ses poignées.
3. Ajoutez les cellules dans le champ Disposition. Ces cellules peuvent être ajoutées :
   • soit via le menu contextuel du champ (option "Insérer une cellule").
   • soit via l'onglet "Général" de la description du champ (bouton "Ajouter").
4. Ajoutez les champs dans les différentes cellules du champ Disposition.
5. Paramétrez l'ancrage des champs présents dans le champ Disposition, notamment l'adaptation au contenu. Pour plus de détails, consultez :
   • Ancrage des champs dans une fenêtre.
   • Ancrage dans une page.

Création du champ Disposition par refactoring

1. Sélectionnez les différents champs à intégrer dans le champ Disposition.
2. Sous l'onglet "Modification", dans le groupe "Transformations", déroulez "Refactoring et permutations" et sélectionnez "Créer une disposition avec la sélection".
3. Le champ Disposition est automatiquement créé et une cellule est créé pour chaque champ situé sur une ligne différente.

Champ Disposition dans un champ Zone répétée

Dans une fenêtre, un champ Disposition peut être utilisé dans un champ Zone répétée :

• Créez un champ Zone répétée.
• Dans la fenêtre de description du champ, sélectionnez l'onglet "Contenu" et cochez l'option "Utiliser une Fenêtre interne par ligne (fonction ZoneRépétéeAjouteFI)".
• Créez une fenêtre interne. Cette fenêtre interne contiendra le champ Disposition avec les champs nécessaires.

Pour plus de détails, consultez Afficher un contenu différent à chaque répétition.

Dans une page, le champ Disposition peut être utilisé dans un champ d'un champ Zone répété. Si vous voulez par exemple, créer un champ Zone répétée permettant d'obtenir une interface optimisée  :

• Créez un champ Zone répétée (par exemple, de type Ajax et rempli par programmation).
• Dans l'onglet "Général" de la fenêtre de description du champ Zone répétée, indiquez le nombre maximum de répétitions visibles. Dans cet exemple, il est conseillé d'utiliser l'option "Pas de limite - Pas d'ascenseur".
• Créez un champ Disposition avec les champs nécessaires et positionnez-le dans une ligne du champ Zone répétée.

Onglet Général

• ajouter, dupliquer ou supprimer une cellule grâce à différents boutons.
• modifier l'ordre des cellules grâce aux boutons fléchés.
• modifier les paramètres de la cellule en cours. Il est possible de :
  • Rendre la cellule visible ou non (état initial).
  • Définir la hauteur et la hauteur maximale de la cellule :
    • La hauteur correspond à la taille minimale de la cellule.
    • La hauteur maximale de la cellule si elle est précisée ne pourra pas être dépassée.
  • Occuper tout l'espace disponible. Cette option est disponible si l'option "En cas de débordement : Agrandir le champ, pousse les champs autour" n'a pas été sélectionnée (onglet "Détail" de la fenêtre de description du champ).

L'onglet "Général" permet également de définir le style CSS de la cellule en cours.

Onglet Détail

• Disposition : Permet de spécifier si le champ Disposition gère la disposition des champs verticalement ou horizontalement.
  • Horizontal : Les cellules s'affichent sur une seule ligne et occupent toute la hauteur du champ. Seule leur largeur est modifiable.
  • Vertical : Les cellules s'affichent sur une seule colonne et occupent toute la largeur du champ. Seule leur hauteur est modifiable.
• Caler les cellules : Permet de spécifier l'alignement des cellules dans le champ en fonction de la disposition choisie.
  • Si la disposition est verticale, les cellules peuvent être calées en haut ou en bas.
  • Si la disposition est horizontale, les cellules peuvent être calées à gauche ou à droite.
• Gestion du débordement :
  • Agrandir le champ, pousse les champs autour : le champ est agrandi pour permettre l'affichage de toutes les cellules.
    • Si des champs sont situés en dessous ou à droite du champ, ils sont "poussés".
    • Si la taille d'une ou plusieurs cellules est réduite, la taille du champ Disposition s'adapte sans descendre en dessous de sa taille initiale.
    • Les champs situés en dessous ou à droite sont déplacés en fonction du changement de taille appliqué.
    • La taille de la fenêtre n'est jamais réduite.
  • Afficher un ascenseur automatiquement : la zone cliente du champ est agrandie et des ascenseurs sont affichés pour pouvoir scroller dans le champ.
  • Tronquer le contenu : Aucune adaptation n'est effectuée, l'affichage des cellules est tronqué.
  • L'option "Réduire le parent" permet de réduire si nécessaire le parent. Si le parent est la fenêtre, la réduction sera appliquée uniquement lors de l'ouverture de la fenêtre.
    Remarque : Lorsque cette option est activée, il faut masquer les cellules ou les champs des cellules soit dans l'événement "Déclarations globales" de la fenêtre, soit dans l'événement "Initialisation" des champs.
• Marge entre les cellules : Espacement entre les cellules du champ Disposition. Cet espacement est exprimé en pixels. Il peut être modifié par programmation via la propriété MargeInterCellules.

Remarques :

• Attention : un champ Disposition ne peut pas s'agrandir si la fenêtre est maximisée sans ascenseur (car la fenêtre ne peut pas s'agrandir également).
• Pour réduire une fenêtre après son ouverture (par exemple après le masquage de champs), utilisez la fonction DispositionAdapteTaille.
• Cas particulier : Champ Libellé RTF : Sous Windows 7 (et antérieur), la largeur d'un libellé RTF ne peut pas être calculée. L'adaptation du champ en largeur n'est donc pas possible.

Exemple des différents types de débordement

• Plusieurs cellules permettant d'afficher les différents champs d'un formulaire.
• Un champ Disposition Horizontal contenant 2 boutons, affichés ou non suivant la présence du numéro de téléphone et/ou de l'adresse email.

• Au Go, la fenêtre affiche tous les champs.
  
• En supprimant le numéro de téléphone et l'adresse email, le champ Disposition se réduit mais la fenêtre garde la même taille.
• En ajoutant le numéro de téléphone, l'adresse email et un commentaire, le champ Disposition s'agrandit ainsi que la fenêtre.
  

• Au Go, la fenêtre affiche tous les champs.
• En ajoutant un commentaire, un ascenseur apparaît automatiquement dans le champ Disposition pour faire défiler les différents éléments affichés.
  

• Au Go, la fenêtre affiche tous les champs.
• En ajoutant un commentaire, le contenu qui dépasse du champ Disposition n'est pas affiché.

Exemple 4 : Option Agrandir le champ pousse les champs autour avec gestion de la réduction de la fenêtre par programmation

• Au Go, la fenêtre affiche tous les champs.
  
• En supprimant le numéro de téléphone et l'adresse email, le champ Disposition se réduit, ainsi que la fenêtre.
  
  En effet, lors de la suppression des champs (Téléphone et Email), la fonction DispositionAdapteTaille modifie la taille du champ Disposition pour ne pas avoir de zone vide et modifie également la taille de la fenêtre, lui permettant de revenir à sa taille initiale.
• En ajoutant le numéro de téléphone, l'adresse email et un commentaire, le champ Disposition s'agrandit, ainsi que la fenêtre.
  

Attention : Cette fonctionnalité est à utiliser avec attention : en effet, selon le contenu de la fenêtre (hors champ Disposition) des effets inattendus peuvent apparaître (diminution de la fenêtre alors que des champs doivent être affichés sur un autre plan, ...).