Guide du développeur pour les API de style et de couleur ONLYOFFICE

Développer des plugins ONLYOFFICE signifie souvent améliorer la manière dont les utilisateurs interagissent avec les documents, que ce soit en ajoutant des surligneurs, des nettoyeurs de format ou des éléments d’interface utilisateur thématiques.

Pour vous aider à travailler plus efficacement, nous avons compilé les principales méthodes API de style et de couleur qui permettent aux développeurs de contrôler facilement l’apparence et la convivialité de leurs plugins.

Cet article propose des explications claires, des exemples pratiques et des conseils pour une expérience de développement plus fluide.

Comprendre le contexte stylistique

Les API du plugin ONLYOFFICE offrent des moyens flexibles de personnaliser l’apparence des documents à l’aide d’objets tels que ApiRange, ApiParagraph, et ApiTextPr.

Ces interfaces permettent aux développeurs de modifier les attributs de police, l’alignement des paragraphes, les couleurs et d’autres propriétés visuelles directement à partir des scripts du plugin.

Exemple simple d’application de styles de texte :

const oDocument = Api.GetDocument();

const oRange = oDocument.GetRangeBySelect();

const oTextPr = oRange.GetTextPr();

oTextPr.Bold(true);

oTextPr.Italic(true);

oTextPr.SetColor(255, 0, 0); // RGB red

Cet extrait montre comment combiner plusieurs styles pour obtenir une mise en forme dynamique.

Méthodes couramment utilisées pour le style et les couleurs

Lorsqu’ils développent des plugins ONLYOFFICE qui fonctionnent avec la mise en forme de documents, tels que les surligneurs, les nettoyeurs de format ou les éléments d’interface utilisateur basés sur des thèmes, les développeurs ont souvent besoin de méthodes claires et prêtes à l’emploi pour gérer les couleurs, les polices et les attributs de texte.

Pour simplifier ce processus, nous avons rassemblé ici les API de style et de couleur les plus pratiques, ainsi que des conseils et des exemples pour une intégration fluide.

Méthode	Description	Exemple
SetColor(r, g, b)	Définit la couleur du texte à l’aide des valeurs RVB.	oTextPr.SetColor(0, 102, 204)
SetHighlight(sColor)	Applique une couleur de surbrillance ou d’arrière-plan au texte.	oRange.SetHighlight("lightGray")
SetBackgroundColor(r, g, b)	Applique une couleur d’arrière-plan à un paragraphe.	oParagraph.SetBackColor(230, 230, 230)
SetBold(true/false)	Active/désactive le style gras.	oTextPr.SetBold(true)
SetItalic(true/false)	Active ou désactive le style italique.	oTextPr.SetItalic(true)
SetUnderline(true/false)	Ajoute ou supprime le soulignement.	oTextPr.SetUnderline(true)
SetFontSize(nSize)	Modifie la taille de la police en points.	oTextPr.SetFontSize(14)
SetFontName(name)	Définit la famille de polices.	oTextPr.SetFontName("Calibri")
ApiCell	Représente une cellule de feuille de calcul pour la mise en forme.	const cell = sheet.GetRange("A1");
SetCellColor(r, g, b)	Définit la couleur d’arrière-plan d’une cellule d’une feuille de calcul.	cell.SetCellColor(255, 230, 191)

Pour la mise en forme des paragraphes, vous pouvez utiliser des méthodes analogues via l’interface ApiParagraph :

const oParagraph = oRange.GetParagraph(0);

oParagraph.SetBackColor(230, 230, 230); // Light gray background

oParagraph.SetAlign("center");

Ces méthodes constituent la base de la mise en forme du texte et des paragraphes dans les plugins ONLYOFFICE. Les cellules des feuilles de calcul utilisent des API conceptuellement similaires, telles que ApiCell et SetCellColor, qui suivent la même logique de mise en forme.

Travailler avec des objets couleur

ONLYOFFICE utilise des définitions de couleurs basées sur le modèle RVB pour ses méthodes de style. Si votre projet utilise des codes de couleurs HEX (courants dans les systèmes de conception ou les thèmes de marque), vous pouvez facilement les convertir à l’aide d’une petite fonction d’aide :

function hexToRGB(hex) {

const bigint = parseInt(hex.replace("#", ""), 16);

const r = (bigint >> 16) & 255;

const g = (bigint >> 8) & 255;

const b = bigint & 255;

return [r, g, b];

}

// Example use:

const [r, g, b] = hexToRGB("#3498db");

oTextPr.SetColor(r, g, b);
This allows seamless integration between design resources and plugin functionality.

Conseils et astuces pour un style fiable

• Sélectionner à nouveau la plage de documents avant d’appliquer les modifications afin de garantir l’exactitude après les actions de l’interface utilisateur.
• Utiliser des appels de fonction distincts pour chaque opération de style plutôt que d’enchaîner trop de méthodes à la fois.
• Toujours effectuer des contrôles de validation, par exemple, confirmer que GetRangeBySelect() renvoie un objet valide.
• Prendre en charge les modes de thème en ajustant dynamiquement les valeurs de couleur avec Asc.plugin.getTheme().

Ces petits ajustements contribuent à rendre le comportement du plugin plus stable et plus cohérent avec le thème.

Conclusion

Les API de mise en forme d’ONLYOFFICE garantissent une approche cohérente entre les différents éditeurs, que vous travailliez sur des documents, des présentations ou des feuilles de calcul.

En réutilisant les mêmes concepts (application des couleurs, ajustements de police, alignement des paragraphes), les développeurs peuvent adapter leur code à tous les éditeurs tout en conservant une logique de mise en forme unifiée.

En rassemblant ces informations en un seul endroit, nous souhaitons rendre le développement de plugins plus rapide, plus fluide et plus intuitif pour tous ceux qui créent avec ONLYOFFICE.

Si vous avez des questions ou des suggestions, n’hésitez pas à nous contacter. Ensemble, nous pouvons continuer à améliorer la documentation ONLYOFFICE.