Ein Entwicklerleitfaden zu den Stil- und Farb-APIs in ONLYOFFICE

Die Entwicklung von ONLYOFFICE-Plugins bedeutet oft, die Interaktion der Nutzer mit Dokumenten zu verbessern – sei es durch Hervorhebungsfunktionen, Formatbereinigung oder thematisch angepasste UI-Elemente.

Um Ihnen ein effizienteres Arbeiten zu ermöglichen, haben wir die wichtigsten Methoden der Style- und Farb-API zusammengestellt, mit denen Entwickler das Erscheinungsbild ihrer Plugins einfach anpassen können.

Dieser Blogbeitrag bietet klare Erklärungen, praktische Beispiele und Tipps für eine reibungslosere Entwicklung.

Den Stilkontext verstehen

Die ONLYOFFICE-Plugin-APIs bieten flexible Möglichkeiten zur Anpassung des Dokumentbildes mithilfe von Objekten wie ApiRange, ApiParagraph und ApiTextPr.

Diese Schnittstellen ermöglichen es Entwicklern, Schriftattribute, Absatzausrichtung, Farben und andere visuelle Eigenschaften direkt in den Plugin-Skripten zu ändern.

Ein einfaches Beispiel für die Anwendung von Textstilen:

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

Dieser Codeausschnitt zeigt, wie mehrere Stile kombiniert werden können, um eine dynamische Formatierung zu erzielen.

Gängige Methoden für Stil und Farbe

Bei der Entwicklung von ONLYOFFICE-Plugins, die Dokumentformatierungen wie Textmarker, Formatbereinigungsfunktionen oder themenbasierte UI-Elemente verwenden, benötigen Entwickler häufig klare und sofort einsatzbereite Methoden zur Handhabung von Farben, Schriftarten und Textattributen.

Um diesen Prozess zu vereinfachen, haben wir hier die praktischsten APIs für Stil und Farbe sowie Tipps und Beispiele für eine reibungslose Integration zusammengestellt.

Für die Absatzformatierung können Sie analoge Methoden über die ApiParagraph-Schnittstelle verwenden:

const oParagraph = oRange.GetParagraph(0);

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

oParagraph.SetAlign("center");

Diese Methoden bilden die Grundlage für die Text- und Absatzformatierung in ONLYOFFICE-Plugins. Tabellenzellen verwenden konzeptionell ähnliche APIs wie ApiCell und SetCellColor und folgen derselben Formatierungslogik.

Arbeiten mit Farbobjekten

ONLYOFFICE verwendet RGB-basierte Farbdefinitionen für seine Stilmethoden. Wenn Ihr Projekt HEX-Farbcodes verwendet (üblich in Designsystemen oder Markenthemen), können Sie diese mithilfe einer kleinen Hilfsfunktion einfach konvertieren:

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.

Tipps und Tricks für zuverlässiges Styling

• Wählen Sie den Dokumentbereich erneut aus, bevor Sie Änderungen anwenden, um die Genauigkeit nach UI-Aktionen zu gewährleisten.
• Verwenden Sie für jede Stiloperation separate Funktionsaufrufe, anstatt zu viele Methoden gleichzeitig zu verketten.
• Führen Sie stets Validierungsprüfungen durch, z. B. um sicherzustellen, dass `GetRangeBySelect()` ein gültiges Objekt zurückgibt.
• Unterstützen Sie Designmodi, indem Sie Farbwerte dynamisch mit `Asc.plugin.getTheme()` anpassen.

Diese kleinen Anpassungen tragen zu einem stabileren und designkonsistenten Plugin-Verhalten bei.

Fazit

Die Styling-APIs von ONLYOFFICE gewährleisten ein einheitliches Erscheinungsbild in allen Editoren, egal ob Sie mit Dokumenten, Präsentationen oder Tabellen arbeiten.

Durch die Wiederverwendung derselben Konzepte (Farbanwendung, Schriftanpassungen, Absatzausrichtung) können Entwickler ihren Code editübergreifend anpassen und gleichzeitig die Styling-Logik vereinheitlichen.

Indem wir diese Informationen an einem Ort zusammenfassen, möchten wir die Plugin-Entwicklung für alle ONLYOFFICE-Nutzer schneller, reibungsloser und intuitiver gestalten.

Bei Fragen oder Anregungen können Sie sich jederzeit an uns wenden. Gemeinsam können wir die ONLYOFFICE-Dokumentation weiter verbessern.