Ajouter du contenu à onglets aux pages du générateur d'IU

Utilisez le composant Onglets pour ajouter du contenu à onglets aux pages au format Générateur d'IU.

Créez une navigation supplémentaire sur votre Générateur d'IU page en ajoutant un composant Onglets à votre page. Utilisez le composant Onglets pour imbriquer des composants dans des onglets de votre page. Les onglets peuvent être configurés en tant qu’onglets horizontaux en haut du contenu ou en tant qu’onglets verticaux sur le côté gauche ou droit du contenu.

Figure 1. Exemple de composant d’onglet

Les onglets peuvent être organisés dans le panneau de configuration pour réorganiser leur affichage sur la Générateur d'IU page. Ajoutez des étiquettes et des icônes personnalisées aux onglets pour fournir des identificateurs visuels uniques permettant de naviguer entre les onglets. Ces changements peuvent être visualisés en temps réel lorsque vous modifiez le composant Onglets.

Vous pouvez ajouter l’un des types d’onglets suivants à votre Générateur d'IU page :

• Onglet du conteneur vide
• Onglet Répéteur
• Onglet de liste connexe
• Onglets Collection de pages

Le composant d’onglets prend en charge n’importe quelle combinaison d’onglets statiques, d’onglets répétés, d’onglets de liste connexe et d’onglets de collection de pages. Vous pouvez également utiliser le mode d’onglet Fenêtre d’affichage pour ajouter une série de fenêtres.

Ajouter des onglets de conteneur vides

Utilisez un onglet de conteneur vide pour créer manuellement un ensemble statique d’onglets sur votre page.

Avant de commencer

Rôle requis : administrateur

Procédure

1. Accédez à la Tout > Cadre de travail Now Experience > Générateur d'IU.
2. Ouvrez une expérience dans laquelle travailler ou créez une expérience en sélectionnant Créer > Expérience.
   Consultez la rubrique Configurer la façon dont les utilisateurs interagissent avec vos applications dans Générateur d'IU pour plus d’informations sur la création d’expériences.
3. Créez ou ouvrez une page ou une variante de page.
   Pour plus d’informations sur la création d’une page dans Générateur d'IU, voir Créer une page dans le générateur d’IU.
4. Sélectionnez le bouton + Ajouter du contenu de l’étape pour ouvrir la boîte à outils.
   
5. Sélectionnez une mise en page à colonne unique .
6. Ensuite, sélectionnez l’icône + dans la colonne pour ouvrir la boîte à outils.
7. Ajoutez un composant Onglets à votre page.
   

   Pour en savoir plus sur l’ajout d’un composant à une page, reportez-vous à la section Ajouter et configurer des composants.

8. Sélectionnez + Ajouter un onglet sur l’étape.
   
9. Sélectionnez Commencer à partir d’un conteneur vide.
   
10. Sélectionnez Suivant.
11. Renseignez les champs du formulaire.

    Tableau 1. Formulaire Paramètres d’onglet

    Champ	Description
    Étiquette de l'onglet	Étiquette de l’onglet à afficher sur votre page.
    Icône	Icône à afficher à côté de l’étiquette de l’onglet. Les icônes ne sont pas obligatoires.
    Masquer l'onglet	Indique s’il faut masquer ou afficher l’onglet.

12. Sélectionnez Créer.
    Le nouvel onglet s’affiche dans le composant Onglets .
13. Sélectionnez le nouvel onglet.
14. Sélectionnez l’icône + .
    
15. Sélectionnez le composant que vous souhaitez ajouter à l’onglet.
    Les composants s’affichent sous l’onglet dans lequel ils sont imbriqués dans l’arborescence de contenu. Pour plus d'informations, consultez Ajouter et configurer des composants.

Résultats

Votre page affiche les deux onglets que vous avez créés. Sélectionnez chaque onglet pour les configurer davantage, ajouter un style ou ajouter un gestionnaire d’événements. Pour en savoir plus sur l’application d’un style, reportez-vous à la section Modifier l’apparence par défaut des composants. Pour plus d’informations sur l’ajout d’un gestionnaire d’événements, reportez-vous à la section Gérer les actions dans les pages du générateur d’IU (fonctionnalité avancée).

Ajouter des onglets de répéteur

Utilisez le composant Tabs pour créer un ensemble d’onglets répéteurs en liant des onglets à un tableau de données.

Avant de commencer

Rôle requis : administrateur

Pourquoi et quand exécuter cette tâche

Vous pouvez utiliser des onglets répéteurs pour créer plusieurs onglets en fonction du tableau de données que vous fournissez. Vous pouvez transmettre l’icône, l’étiquette, le nombre et les champs comme clé dans l’objet. Utilisez la touche étiquette pour ajouter des noms aux onglets. Utilisez la touche de champ pour transmettre des informations aux onglets du répéteur. Vous pouvez lier un courtier en données, un état client ou un script client au fournisseur de tableau de données pour renvoyer le tableau d’objets avec le schéma approprié.

Procédure

1. Accédez à la Tout > Cadre de travail Now Experience > Générateur d'IU.
2. Ouvrez une expérience dans laquelle travailler ou créez une expérience en sélectionnant Créer > Expérience.
   Consultez la rubrique Configurer la façon dont les utilisateurs interagissent avec vos applications dans Générateur d'IU pour plus d’informations sur la création d’expériences.
3. Créez ou ouvrez une page ou une variante de page.
   Pour plus d’informations sur la création d’une page dans Générateur d'IU, voir Créer une page dans le générateur d’IU.
4. Sélectionnez le bouton + Ajouter du contenu de l’étape pour ouvrir la boîte à outils.
   
5. Sélectionnez une mise en page à colonne unique .
6. Ensuite, sélectionnez l’icône + dans la colonne pour ouvrir la boîte à outils.
7. Ajoutez un composant Onglets à votre page.
   

   Pour en savoir plus sur l’ajout d’un composant à une page, reportez-vous à la section Ajouter et configurer des composants.

8. Sélectionnez + Ajouter un onglet sur l’étape.
   
9. Sélectionnez Utiliser un répéteur.
   
10. Sélectionnez Suivant.
11. Saisissez une étiquette pour l’onglet répéteur dans le champ Étiquette de l’onglet Espace réservé .
    Cette étiquette est affectée au premier onglet de répéteur et est le seul onglet affiché dans l’aperçu de la page.
12. Sélectionnez Modifier dans le champ Tableau de données .
    
13. Configurez le tableau de données dans l’éditeur JSON.

    Clé	Type de données	Description
    icône	Chaîne	Nom de l’icône qui s’affiche dans Générateur d'IU.
    étiquette	Chaîne	Obligatoire. Afficher le nom de l’onglet dans Générateur d'IU.
    compter	Numéro	Valeur à fournir sur l’étiquette de l’onglet. Lier dynamiquement à un courtier en données ou à un script client qui sera affiché sur l’étiquette.
    champs	Objet	Objet qui peut être utilisé pour stocker des informations et les transmettre aux composants dans les onglets.

14. Sélectionnez Appliquer.
    Le champ tableau de données affiche la configuration du tableau de données.

    

15. Sélectionnez Créer.
    Le nouvel onglet répéteur apparaît sur la page et dans l’arborescence de contenu.

    

16. Sélectionnez Enregistrer.
17. Ajoutez des composants à l’onglet Répéteur.
18. Sélectionnez pour vérifier que les onglets de répéteur s’affichent correctement sur votre page.

Ajouter des onglets de liste connexe

Créez un ensemble d’onglets sur une page en créant un lien vers une liste connexe.

Avant de commencer

Rôle requis : administrateur

Pourquoi et quand exécuter cette tâche

L’onglet de liste connexe remplit automatiquement les onglets en fonction de l’enregistrement que votre page affiche. Par exemple, par défaut, les listes connexes de la table utilisateur sont les domaines Rôles, Groupes, Délégués et Visibilité. Si votre page affiche un enregistrement d’utilisateur, la création d’un onglet de liste connexe ajoute ces quatre listes connexes en tant qu’onglets sur votre page. Vous pouvez prévisualiser la page pour voir les listes connexes qui ont été ajoutées. Un contrôleur d’enregistrement est nécessaire pour créer des onglets de liste connexe. Pour ajouter un contrôleur à votre page, consultez la rubrique Lier des données à des pages à Générateur d'IU l’aide de contrôleurs (fonctionnalité avancée) pour plus d’informations.

Procédure

1. Accédez à la Tout > Cadre de travail Now Experience > Générateur d'IU.
2. Ouvrez une expérience dans laquelle travailler ou créez une expérience en sélectionnant Créer > Expérience.
   Consultez la rubrique Configurer la façon dont les utilisateurs interagissent avec vos applications dans Générateur d'IU pour plus d’informations sur la création d’expériences.
3. Créez ou ouvrez une page ou une variante de page.
   Pour plus d’informations sur la création d’une page dans Générateur d'IU, voir Créer une page dans le générateur d’IU.
4. Sélectionnez le bouton + Ajouter du contenu de l’étape pour ouvrir la boîte à outils.
   
5. Sélectionnez une mise en page à colonne unique .
6. Ensuite, sélectionnez l’icône + dans la colonne pour ouvrir la boîte à outils.
7. Ajoutez un composant Onglets à votre page.
   

   Pour en savoir plus sur l’ajout d’un composant à une page, reportez-vous à la section Ajouter et configurer des composants.

8. Sélectionnez + Ajouter un onglet sur l’étape.
   
9. Sélectionnez Afficher les listes connexes d’un enregistrement.
   
10. Sélectionnez Suivant.
11. Renseignez les champs du formulaire.

    Tableau 2. Formulaire Paramètres d’onglet

    Champ	Description
    Étiquette de l’onglet espace réservé	Étiquette d’espace réservé à afficher dans l’onglet d’aperçu de votre page.
    Masquer l'onglet	Indique si vous souhaitez masquer ou afficher l’onglet.
    Contrôleur d’enregistrement	Contrôleur d’enregistrement avec la liste connexe.

12. Sélectionnez Créer.
    Le nouvel onglet de liste connexe s’affiche dans la section Onglets du panneau de configuration. Un seul onglet d’espace réservé apparaît dans l’aperçu de la page. L’icône verte à côté de l’onglet de liste connexe dans l’arborescence de contenu indique le nombre d’onglets apparaissant sur votre page.

    

13. Sélectionnez Enregistrer.
14. Affichez et testez votre page en sélectionnant

Ajouter des onglets de collection de pages

Utilisez les onglets de collection de pages pour recréer les mêmes onglets sur plusieurs pages dans Générateur d'IU.

Avant de commencer

Rôle requis : administrateur

Pourquoi et quand exécuter cette tâche

Une collection de pages est un groupe de pages prédéfinies disponibles de manière globale. Utilisez les onglets de collection de pages pour afficher chaque page d’une collection de pages sous forme d’onglet. Vous pouvez sélectionner une collection de pages existante ou créer la vôtre. Un contrôleur est nécessaire pour ajouter une collection de pages. Pour en savoir plus sur les collections de pages, reportez-vous à Collections de pages.

Procédure

1. Accédez à la Tout > Cadre de travail Now Experience > Générateur d'IU.
2. Ouvrez une expérience dans laquelle travailler ou créez une expérience en sélectionnant Créer > Expérience.
   Consultez la rubrique Configurer la façon dont les utilisateurs interagissent avec vos applications dans Générateur d'IU pour plus d’informations sur la création d’expériences.
3. Créez ou ouvrez une page ou une variante de page.
   Pour plus d’informations sur la création d’une page dans Générateur d'IU, voir Créer une page dans le générateur d’IU.
4. Sélectionnez le bouton + Ajouter du contenu de l’étape pour ouvrir la boîte à outils.
   
5. Sélectionnez une mise en page à colonne unique .
6. Ensuite, sélectionnez l’icône + dans la colonne pour ouvrir la boîte à outils.
7. Ajoutez un composant Onglets à votre page.
   

   Pour en savoir plus sur l’ajout d’un composant à une page, reportez-vous à la section Ajouter et configurer des composants.

8. Sélectionnez + Ajouter un onglet sur l’étape.
   
9. Sélectionnez Ajouter une collection de pages.
   
10. Sélectionnez Suivant.
11. Sélectionnez une collection de pages dans la liste ou créez une collection en sélectionnant + Créer une collection.
    Pour créer votre propre collection de pages, reportez-vous à la section Créer une collection de pages sur plusieurs pages de l’interface utilisateur.

    

12. Sélectionnez Ajouter.
    Le nouvel onglet Collection de pages s’affiche dans la section Onglets du panneau de configuration. Un seul onglet d’espace réservé s’affiche dans l’aperçu de la page.

    

13. Sélectionnez Enregistrer.
14. Affichez et testez votre page en sélectionnant