Créer des composants UX dans SharePointCreate UX components in SharePoint

Le modèle de complément SharePoint propose de nombreux composants et mécanismes UX pour vous aider à créer une expérience utilisateur enrichissante dans les compléments SharePoint. L’expérience utilisateur dans le modèle de complément est également suffisamment flexible pour vous permettre d’utiliser les techniques et les plateformes les mieux adaptées aux besoins des utilisateurs finaux.The model for SharePoint Add-ins offers many UX components and mechanisms that help you build a great user experience in SharePoint Add-ins. The user experience in the add-in model is also flexible enough to let you use the techniques and platforms that best adapt to the needs of end users.

Le tableau suivant répertorie les ressources vous permettant d’apprendre à créer et à utiliser les composants UX dans les compléments.The following table lists resources to help you learn about creating and using UX components in add-ins.

Ressources et conseils pour la création de composants UX dans des compléments SharePointResources and guidance for creating UX components in SharePoint Add-ins

ArticleArticle DescriptionDescription
Utilisation d'une feuille de style de site web SharePoint dans les compléments pour SharePointUse a SharePoint website's style sheet in SharePoint Add-ins Vous pouvez référencer la feuille de style d'un site web SharePoint dans votre Complément SharePoint et l'utiliser pour donner un style à vos pages web en utilisant la feuille de style dans SharePoint. En outre, si quelqu'un modifie la feuille de style ou le thème du site web SharePoint, vous pouvez adopter le nouvel ensemble de styles dans votre complément sans modifier la référence de la feuille de style dans celui-ci.You can reference the style sheet of a SharePoint website in your SharePoint Add-in and use it to style your webpages by using the style sheet in SharePoint. In addition, if someone changes the SharePoint website's style sheet or theme, you can adopt the new set of styles in your add-in without modifying the style sheet reference in your add-in.
Utiliser le contrôle de chrome client dans les compléments pour SharePointUse the client chrome control in SharePoint Add-ins Le contrôle Chrome dans SharePoint vous permet d'utiliser les styles d'en-tête d'un site SharePoint spécifique dans votre complément sans avoir à inscrire dans le Registre une bibliothèque de serveur ou utiliser une technologie ou un outil spécifique. Pour utiliser cette fonctionnalité, vous devez inscrire dans le Registre une bibliothèque JavaScript SharePoint par le biais d'une balise <script> standard. Vous pouvez fournir un espace réservé au moyen d'un élément HTML div et personnaliser davantage le contrôle au moyen des options disponibles. Le contrôle hérite de son aspect à partir du site web SharePoint spécifié. The chrome control in SharePoint enables you to use the header styling of a specific SharePoint site in your add-in without needing to register a server library or use a specific technology or tool. To use this functionality, you must register a SharePoint JavaScript library through a standard <script> tag. You can provide a placeholder by using an HTML div element and further customize the control by using the available options. The control inherits its appearance from the specified SharePoint website.
Créer des composants de complément à installer avec votre complément SharePointCreate add-in parts to install with your SharePoint Add-in Les composants de complément vous permettent de montrer votre expérience d'utilisateur de complément dans le site web hôte. Un composant de complément affiche le contenu de votre complément à l'aide d'un IFrame. Les utilisateurs finaux peuvent personnaliser l'expérience en utilisant les propriétés personnalisées que vous pouvez fournir pour votre composant de complément. La page web du complément reçoit les valeurs de propriété personnalisée par l'intermédiaire de paramètres dans la chaîne de requête.With add-in parts, you can show your add-in user experience right in the host web. An add-in part displays your add-in content using an IFrame. End users can customize the experience using the custom properties that you can provide for your add-in part. The add-in webpage receives the custom property values through parameters in the query string.
Créer des actions personnalisées à déployer avec les compléments pour SharePointCreate custom actions to deploy with SharePoint Add-ins Quand vous créez un complément SharePoint, les actions personnalisées vous permettent d’interagir avec les listes et le ruban dans le site web hôte.When you are creating a SharePoint Add-in, custom actions let you interact with the lists and the ribbon in the host web. Une action personnalisée se déploie sur le site web hôte quand les utilisateurs finaux installent votre complément.A custom action deploys to the host web when end users install your add-in. Les actions personnalisées peuvent ouvrir une page web distante et transmettre des informations via la chaîne de requête.Custom actions can open a remote webpage and pass information through the query string. Deux types d’actions personnalisées sont disponibles pour les compléments : le ruban et l’élément de menu Modifier le bloc de contrôle.Two types of custom actions are available for add-ins: Ribbon and Edit Control Block.
Personnaliser l’affichage de liste dans les compléments SharePoint à l’aide du rendu côté clientCustomize a list view in SharePoint Add-ins using client-side rendering Le rendu côté client fournit un mécanisme qui vous permet de produire votre propre sortie pour un jeu de contrôles hébergés sur une page SharePoint.Client-side rendering provides a mechanism that you can use to produce your own output for a set of controls that are hosted on a SharePoint page. Vous pouvez également utiliser des technologies connues, telles que le HTML et JavaScript, pour définir la logique de rendu des affichages de liste SharePoint.This mechanism enables you to use well-known technologies, such as HTML and JavaScript, to define the rendering logic of SharePoint list views. Avec le rendu côté client, vous pouvez spécifier vos propres ressources JavaScript et les héberger dans les options de stockage de données disponibles pour vos compléments, par exemple dans une bibliothèque de documents.In client-side rendering, you can specify your own JavaScript resources and host them in the data storage options available to your add-ins, such as a document library.
Utiliser le contrôle Sélecteur de personnes côté client dans les compléments SharePoint hébergés par SharePointUse the client-side People Picker control in SharePoint-hosted SharePoint Add-ins Le contrôle Sélecteur de personnes côté client permet aux utilisateurs de rechercher et sélectionner rapidement les comptes d’utilisateurs valides pour trouver des personnes, des groupes et des revendications dans leur organisation.The client-side People Picker control lets users quickly search for and select valid user accounts for people, groups, and claims in their organization. Le sélecteur est un contrôle HTML et JavaScript pris en charge par plusieurs navigateurs.The picker is an HTML and JavaScript control that provides cross-browser support.
Surligner les contenus et améliorer les fonctionnalités des compléments SharePoint hébergés par SharePoint avec le contrôle de légendeHighlight content and enhance the functionality of SharePoint-hosted SharePoint Add-ins with the callout control Le contrôle de légende SharePoint vous permet d’interagir avec souplesse avec vos utilisateurs et de présenter les fonctionnalités de votre application hébergée sur SharePoint.The SharePoint callout control provides a flexible way to engage your user and showcase your SharePoint-hosted app's functionality. Cet article vous explique comment construire ce contrôle, l’ajouter à votre page et personnaliser son apparence et son comportement.This article shows you how to construct this control, add it to your page, and customize its appearance and behavior.
Inclure un composant WebPart dans une page web sur le site web de complémentInclude a web part in a webpage on the add-in web Comment inclure un composant WebPart sur une page dans un complément SharePoint.How to include a web part on a page in a SharePoint Add-in.

Étapes suivantes : utilisation de données dans les compléments SharePointNext steps: Working with data in SharePoint Add-ins

Vous venez de créer une expérience utilisateur performante pour votre complément ?Have you finished designing a great UX for your add-in? Incorporez les données avec les mécanismes disponibles dans le modèle de complément SharePoint. Pour en savoir plus, consultez l’article Utiliser des données externes dans SharePoint.Incorporate data with the mechanisms available to you in the model for SharePoint Add-ins. For more information, see Work with external data in SharePoint.

Voir aussiSee also