在sap ui5 RTF编辑器中设置默认字体系列和字体大小

Question

我可以通过以下代码来构建用于ap ui5的Richtext编辑器

sap.ui.require(["sap/ui/richtexteditor/RichTextEditor", "sap/ui/richtexteditor/EditorType"],
                function (RTE, EditorType) {
            var oRichTextEditor = new RTE("myRTE", {
                editorType: EditorType.TinyMCE4,
                width: "100%",
                height: "200px",
                customToolbar: true,
                showGroupFont: true,
                showGroupLink: true,
                showGroupInsert: true,
                value: sHtmlValue,
                ready: function () {
                    this.addButtonGroup("styleselect").addButtonGroup("table");
                }
            });

            that.getView().byId("textarea").addContent(oRichTextEditor);
        });

现在，客户希望将默认字体系列和字体大小设置为Ariel，将默认设置为11。任何想法如何设置默认值。

Answer 1

开箱即用，RTE不支持11磅。您必须增强有效字体大小的可用列表。

然后在beforeEditorInit事件中，您可以应用设置

sap.ui.require([
    "sap/ui/richtexteditor/RichTextEditor",
    "sap/ui/richtexteditor/EditorType",
    "sap/ui/richtexteditor/library"
], (RTE, EditorType, RTELibrary) => {
    // RTE only supports a few FontSizes out of the box. Add your additional FontSize here
    const aFontSizes = RTELibrary.EditorCommands.FontSize;
    aFontSizes.push(11);
    aFontSizes.sort((a, b) => a - b);

    const oRichTextEditor = new RTE("myRTE", {
        editorType: EditorType.TinyMCE4,
        customToolbar: true,
        showGroupFont: true,
        beforeEditorInit: function (oEvent) {
            const oConfig = oEvent.getParameter("configuration");
            const fnSuperSetup = oConfig.setup;
            oConfig.setup = (oEditor) => {
                // if you want you can call the original setup method here
                fnSuperSetup(oEditor);
                oEditor.on("init", function () {
                    oEditor.execCommand("FontName", false, "arial, helvetica, sans-serif");
                    oEditor.execCommand("FontSize", false, "11pt");
                });
            };
        }
    });

    this.getView().byId("mainPage").addContent(oRichTextEditor);
});

小缺点：下拉菜单未选择正确的值（11 pt）。但是您可以在源代码中看到它实际上是11点：

也许有人知道为什么调用execCommand时下拉列表无法正确更新（它仅适用于小于插入的元素）。>>