Préallouer de l’espace pour les espaces réservés d’extension SharePoint Framework

Les personnalisateurs d’application peuvent être utilisés pour ajouter des structures et du contenu sur les pages modernes. Pour ce faire, utilisez des espaces réservés spécifiques dans la page, dans lesquels l’extensibilité personnalisée sera alors chargée. Étant donné que les extensions seront chargées assez tard dans le cycle de vie de chargement de la page, il peut y avoir un déplacement de page supplémentaire lorsque les extensions sont ajoutées.

Remarque

Cette fonctionnalité est uniquement prise en charge dans SharePoint Online.

Pour réduire le déplacement de la page, vous pouvez préallouer la zone d’extension déjà côté serveur lors de la création de la structure de page. Cette configuration peut être appliquée à l’aide de la nouvelle HostProperties propriété au niveau de la UserCustomAction collection pour indiquer côté serveur quels personnalisateurs d’application sont chargés sur la page.

Il existe deux propriétés spécifiques différentes, qui peuvent être utilisées avec la HostProperties configuration :

• preAllocatedApplicationCustomizerTopHeight: hauteur pré-allouée pour l’espace réservé supérieur
• preAllocatedApplicationCustomizerBottomHeight: hauteur pré-allouée pour l’espace réservé inférieur

La hauteur est définie en pixels.

Définition de l’allocation HostProperties dans SharePoint Framework solution

Vous pouvez définir la pré-allocation côté serveur directement dans le code de solution SharePoint Framework, ce qui garantit ensuite que la pré-allocation est appliquée lors de l’utilisation de la solution. La pré-allocation peut être définie dans le elements.xml ou dans les fichiers ClientSideInstance.xml , en fonction de la conception de votre solution.

La valeur des propriétés de l’hôte doit être correctement encodée dans les fichiers xml pour garantir la réussite de l’empaquetage de la solution.

Définition de la pré-allocation sur un déploiement étendu au site

Si votre extension est conçue pour être installée sur une étendue de site, vous pouvez configurer la pré-allocation à l’aide du fichier ./sharepoint/assets/elements.xml . La configuration incluse dans ce fichier est appliquée par défaut au site, quand SharePoint Framework solution est installée sur une étendue de site.

Le fragment xml suivant a été mis à jour avec l’entrée supplémentaire HostProperties et a défini la hauteur par défaut sur 50 pixels.

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <CustomAction
      Title="HeaderDemo"
      Location="ClientSideExtension.ApplicationCustomizer"
      ClientSideComponentId="03dd08c7-2575-4336-899e-68cfce663c4d"
      ClientSideComponentProperties="{&quot;testMessage&quot;:&quot;Test message&quot;}"
      HostProperties="{&quot;preAllocatedApplicationCustomizerTopHeight&quot;:&quot;50&quot;,&quot;preAllocatedApplicationCustomizerBottomHeight&quot;:&quot;50&quot;}">
  </CustomAction>
</Elements>

Définir la pré-allocation à l’aide de l’option de déploiement à l’échelle du locataire

Les extensions destinées à être activées à l’aide des options de déploiement à l’échelle du locataire peuvent être configurées pour utiliser l’espace pré-alloué en ajoutant HostProperties la propriété pour l’élément ClientSideComponentInstance dans le fichier ./sharepoint/assets/ClientSideInstance.xml .

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <ClientSideComponentInstance
      Title="HeaderDemo"
      Location="ClientSideExtension.ApplicationCustomizer"
      ComponentId="03dd08c7-2575-4336-899e-68cfce663c4d"
      Properties="{&quot;testMessage&quot;:&quot;Test message&quot;}"
      HostProperties="{&quot;preAllocatedApplicationCustomizerTopHeight&quot;:&quot;50&quot;,&quot;preAllocatedApplicationCustomizerBottomHeight&quot;:&quot;50&quot;}">
  </ClientSideComponentInstance>
</Elements>

HostProperties l’entrée de cette configuration sera ajoutée à l’entrée de liste Extensions à l’échelle du locataire dans la collection de sites du catalogue d’applications, qui a une colonne Propriétés de l’hôte pour chaque élément.

Considérations

Il existe quelques considérations à prendre en compte, en fonction de votre implémentation :

• Lorsque la hauteur donnée est trop importante, la div dispose d’un espace supplémentaire sur la position désignée. Si la hauteur est inférieure aux personnalisateurs d’application, les personnalisateurs d’application sont compressés dans l’espace réservé.
• Si vous avez défini une pré-allocation, mais que le personnalisateur d’application ne crée pas d’espace réservé dans le code ou n’est pas associé à la page, l’espace alloué côté serveur reste sur la page.

Remarque

HostProperties peut également être défini pour les personnalisateurs d’application existants en modifiant l’objet CustomAction au niveau du site ou en utilisant la colonne Propriétés de l’hôte dans la liste Extensions à l’échelle du locataire sur le site du catalogue d’applications. Comme il s’agit d’un paramètre côté serveur, il peut également être appliqué aux extensions qui ont été créées à l’aide d’anciennes versions SharePoint Framework.