Skip to main content

Créer un groupe de layouts

Logo Pega Community

Note: The following content, referenced from Pega Community, is included here to help you better achieve the module learning objectives.

Optimisez la zone de l’écran en utilisant un groupe de layouts pour organiser les informations en segments ordonnés.

Par exemple, vous pouvez configurer un groupe de layouts pour afficher les informations connexes sous la forme d’une série d’onglets que l’utilisateur peut parcourir efficacement.

Après avoir créé un groupe de layouts, vous pouvez l’utiliser comme base pour une région dans un modèle de présentation.

  1. Dans le volet de navigation de Dev Studio, cliquez sur Case types, puis sur le type de dossier à ouvrir.

  2. Exécutez un nouveau dossier en cliquant sur Save and run.

  3. Dans le nouveau dossier, naviguez jusqu’à la mise en page que vous souhaitez modifier.

  4. Dans le pied de page de Dev Studio, cliquez sur l’icône Live UI.

    Note: l’outil Live UI est activé. Vous pouvez désormais inspecter les composants de l’interface utilisateur en temps réel.
  5. Cliquez sur la mise en page que vous souhaitez modifier, puis cliquez sur l’icône Open in Dev Studio.

  6. Si votre section est basée sur un modèle et qu’elle ne peut pas être modifiée, cliquez sur Convert to full section editor.

  7. Dans l’onglet Design, développez la liste Structural, puis faites glisser le Layout group sur la zone de travail.

  8. Dans la boîte de dialogue Choose layout-group format, sélectionnez l’un des formats suivants pour le groupe de layouts :

    • Pour afficher les mises en page sous forme de pages simples sans en-tête ni menu, sélectionnez Default.
    • Pour afficher les mises en page sous des en-têtes repliables, sélectionnez Accordion.
    • Pour afficher les mises en page une à la fois sous forme d’options d’un menu, sélectionnez Menu.
    • Pour afficher toutes les mises en page en même temps, de façon empilée, sélectionnez Stacked.
    • Pour afficher une mise en page une à la fois, avec un onglet pour chaque mise en page, sélectionnez Tab.
    • Pour afficher les mises en page dans un format personnalisé défini dans la skin, sélectionnez Other, puis sélectionnez le format.
  9. Pour inclure des mises en page ou des éléments de conteneur dans le groupe de layouts, développez la liste Structural et les éléments que vous souhaitez intégrer au groupe de layouts.

For example: la page d’accueil UI Gallery contient un exemple concret du groupe de layouts que vous pouvez utiliser comme référence ou copier directement vers l’application. Pour plus d’informations, consultez la rubrique Page d’accueil de l’UI Gallery.

  • Créer une région modèle basée sur un groupe de layouts

    Vous utilisez un groupe de layouts pour présenter des informations étroitement liées avec des mécanismes de navigation en accordéon, menu, empilées ou à onglets. Vous pouvez créer une région modèle basée sur un groupe de layouts. Ceci est particulièrement utile si les utilisateurs ont besoin d’ajouter, de réorganiser ou de supprimer des onglets sur les écrans lors de l’exécution d’App Studio.

  • Forumaire Skin - Onglet Composants - Layouts - Groupes de layouts

    Un groupe de layouts combine différents types de mises en page pour afficher un ensemble de contenu, comme une liste des comptes financiers et des transactions connexes. Les groupes de mises en page permettent de préciser la manière de parcourir des ensembles d’informations. On peut par exemple définir un onglet pour chaque compte, ou simplement changer le type afin de transformer la liste des comptes en liste déroulante, accordéon, onglet, ou liste classique.

  • Forumaire Skin - Onglet Composants - Layouts - Conteneurs

    Ces styles s’appliquent à l’en-tête du conteneur. Vous pouvez spécifier des styles pour le format de conteneur par défaut et créer des formats de conteneur personnalisés.


This Topic is available in the following Module:

If you are having problems with your training, please review the Pega Academy Support FAQs.

Did you find this content helpful?

Want to help us improve this content?

We'd prefer it if you saw us at our best.

Pega Academy has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice