Restez organisé à l'aide des collections
Enregistrez et classez les contenus selon vos préférences.
Un module complémentaire basé sur des fiches s'affiche sous la forme d'un volet dans la barre latérale (ou, sur mobile, sous la forme d'une autre fenêtre d'activité accessible depuis le menu). Le module complémentaire comporte une barre d'outils supérieure qui l'identifie et affiche une fiche, qui correspond à une "page" de l'UI du module complémentaire. Apps Script représente les cartes dans le code du projet à l'aide d'objets Card.
Anatomie d'une fiche
Une fiche est un groupe d'éléments d'interface utilisateur que vous concevez. Une fiche se compose des sections suivantes :
En-tête de fiche Cela permet d'identifier les cartes. Il comporte un texte de titre et peut éventuellement comporter un sous-titre et une icône.
Une ou plusieurs sections de fiche. Il s'agit de sous-divisions de la zone d'UI de la fiche.
Une section peut éventuellement comporter un en-tête de section de texte.
Les sections de la fiche sont séparées par une règle horizontale.
Si une section de carte est particulièrement grande, elle est automatiquement affichée sous forme de section réductible que les utilisateurs peuvent développer ou réduire selon leurs besoins.
Une fiche ne peut pas comporter plus de 100 sections. Pour de meilleures performances, elle ne doit en comporter que quelques-unes.
Chaque section de fiche contient un ou plusieurs widgets d'UI. Les widgets fournissent à l'utilisateur des informations ou des commandes interactives. Les fiches et les sections de fiches sont des widgets structurels. Vous ne pouvez donc pas les ajouter à une section de fiches. Une section de cartes ne peut pas contenir plus de 100 widgets et doit être aussi simple que possible pour des performances optimales.
Vous devez concevoir vos fiches en fonction d'activités utilisateur ou d'ensembles de données spécifiques. Par exemple, un module complémentaire Google Workspace qui affiche des données extraites de Google Sheets peut avoir une fiche distincte pour chaque feuille à partir de laquelle il extrait des données.
Utiliser plusieurs cartes
Les modules complémentaires se composent généralement de plusieurs cartes. Vous pouvez configurer ces cartes sous forme de liste simple pour une navigation de base avec plusieurs cartes, ou configurer des méthodes de navigation plus complexes pour contrôler la façon dont l'utilisateur se déplace entre les cartes.
Si le module complémentaire utilise la navigation de base, lorsque le module complémentaire est ouvert pour la première fois, l'application Google Workspace qu'il étend construit une liste des en-têtes de carte et les présente à l'utilisateur. Cliquez sur l'en-tête de la fiche pour l'ouvrir. Une flèche de retour est également fournie pour revenir à la liste des en-têtes de carte. Vous n'avez pas besoin de coder la fonctionnalité d'en-tête et de flèche de retour. Elle est effectuée automatiquement lorsque vous définissez les fiches dans votre module complémentaire.
Sauf indication contraire, le contenu de cette page est régi par une licence Creative Commons Attribution 4.0, et les échantillons de code sont régis par une licence Apache 2.0. Pour en savoir plus, consultez les Règles du site Google Developers. Java est une marque déposée d'Oracle et/ou de ses sociétés affiliées.
Dernière mise à jour le 2025/08/04 (UTC).
[null,null,["Dernière mise à jour le 2025/08/04 (UTC)."],[[["\u003cp\u003eGoogle Workspace add-ons utilize cards, essentially UI pages, displayed in a sidebar or activity window, to present information and interactive elements.\u003c/p\u003e\n"],["\u003cp\u003eEach card is structured with a header, sections containing widgets (like buttons or text fields), and is designed around specific user tasks or data sets.\u003c/p\u003e\n"],["\u003cp\u003eAdd-ons often employ multiple cards for navigation; basic navigation provides an automatic card header list and back arrow functionality.\u003c/p\u003e\n"],["\u003cp\u003eFor optimal performance and user experience, it's recommended to keep the number of cards, sections, and widgets to a minimum, prioritizing simplicity in card design.\u003c/p\u003e\n"],["\u003cp\u003eCards have technical limitations, restricting them to a maximum of 100 card sections and 100 widgets per section to maintain performance.\u003c/p\u003e\n"]]],["Add-on cards, displayed in a sidebar or activity window, are UI pages built with `Card` objects. Cards have a header, optional subtitle/icon, and sections. Sections, separated by horizontal rules, contain UI widgets, and large sections collapse. Add-ons use multiple cards for navigation, presented as a list of headers. Basic navigation provides automatic back arrow functionality. Each card section can hold a maximum of 100 widgets, and a card can hold no more than 100 card sections.\n"],null,["# Cards\n\nA card-based add-on appears as a pane in the sidebar (or, on mobile, as another\nactivity window reached through the menu). The add-on has a top toolbar that\nidentifies the add-on and displays a *card* ---essentially a \"page\" of the\nadd-on's UI. Apps Script represents cards in project code using\n[`Card`](/apps-script/reference/card-service/card) objects.\n\nCard anatomy\n------------\n\nA card is a group of UI elements you design. A card consists of the\nfollowing sections:\n\n- **A card header**. This identifies the cards. It has title text, and may optionally have a subtitle and an icon.\n- **One or more card sections** . These are sub-divisions of the card's UI area.\n A section may optionally have a text section header.\n Card sections are separated from each other on the card by a horizontal rule.\n If a card section is particularly large, it is automatically rendered as a\n collapsible section that users can expand or collapse as needed.\n A card can have [no more than 100 card sections](/workspace/add-ons/guides/workspace-restrictions#have_more_than_100_widgets),\n and should have only a few for better performance.\n\n- **Each card section contains one or more UI\n [widgets](/workspace/add-ons/concepts/widgets)** . Widgets provide the user with\n information or interactive controls. Cards and card sections are\n *structural* widgets, so you cannot add those to a card section. A card\n section can have [no more than 100 widgets](/workspace/add-ons/guides/workspace-restrictions#have_more_than_100_widgets),\n and should be as simple as possible for best performance.\n\nYou should design cards around particular user activities or data sets. For\nexample, a Google Workspace add-on that displays data\ntaken from Google Sheets might have a separate card for each sheet it pulls\ndata from.\n\nUsing multiple cards\n--------------------\n\nAdd-ons usually consist of more than one card. You can either configure these\ncards as a simple list for\n[basic navigation with multiple cards](/workspace/add-ons/how-tos/navigation#returning_multiple_cards),\nor configure more complex\n[navigation methods](/workspace/add-ons/how-tos/navigation#navigation_methods)\nto control how the user moves between the cards.\n\nIf the add-on uses basic navigation, when the\nadd-on is first opened the\nGoogle Workspace application it extends constructs a\nlist of the card headers and presents those to the user. Clicking on the card\nheader opens that card. A back arrow is also provided to get back to the card\nheader list. You do not have to code the header and back arrow\nfunctionality---this is done automatically when you define the cards in your\nadd-on.\n\nWhen designing add-ons, it's best to\n[limit the number of cards](/workspace/add-ons/guides/workspace-best-practices#_use_just_a_few_cards)\nyou display at once, since cards must share a limited amount of screen space.\nIt's also best to [avoid unnecessary complexity in cards](/workspace/add-ons/guides/workspace-best-practices#_keep_cards_simple).\n| **Note:** For performance reasons, you can't add more than 100 widgets or 100 card sections to a card."]]
