SAPUI5/OpenUI5：自定义控件的 CSS？答案

【问题标题】：SAPUI5/OpenUI5: CSS for custom control?SAPUI5/OpenUI5：自定义控件的 CSS？
【发布时间】：2020-05-22 16:58:13
【问题描述】：

我目前正在处理 SAPUI5/OpenUI5 中的自定义控件，我想知道如何将所需的 CSS 放入应用程序中。我将把特定于我的控件的 CSS 代码放在哪里？然后如何从控件加载它？我在文档中找不到任何内容....

感谢和最好的问候，丹尼尔

【问题讨论】：

标签： sapui5

【解决方案1】：

在this教程中，描述了如何在自定义控件的渲染器中使用CSS。

如果您不使用自定义渲染器，您可以像here 中描述的那样将 CSS 附加到任何其他控件。

始终确保加载 CSS 文件，例如在你的 html 文件中。

编辑：

根据cmetsjQuery.sap.includeStyleSheet()解决了。

【讨论】：

并非如此。第一个链接（我之前已经遇到过）演示了如何提供 CSS 内联 - 为对象的每个实例生成相同的 CSS。第二个链接也没有回答如何加载 CSS 的问题。在 HTML 文件中放置或加载 CSS 似乎也不是理想的解决方案，因为那时控件的正确执行将取决于环境。 SAPUI5 库似乎也动态加载所需的 CSS 文件 - 但我还不知道如何......
好的，我想我现在明白你的意思了。您可以尝试从您的控件中调用 jQuery.sap.includeStyleSheet() 。功能描述here:
这正是我想要的！谢谢！
此外，如果您将自定义控件声明为库，则可以将 CSS 推送到主题。
真的！能否请您发布文档的链接，我找不到了。

【解决方案2】：

在撰写本文时，您需要 sap/ui/dom/includeStylesheet 并在您的 init 函数中调用它。

例子：

sap.ui.define(
    [
        'sap/ui/core/Control',
        'sap/ui/dom/includeStylesheet'
    ],
    function (Control, includeStylesheet) {
        'use strict';

        return Control.extend('Example.control.MyControl', {
            // some more boilerplate code

            init: function () {
                includeStylesheet('../css/mycontrol.css');
            }
        });
    }
);

【讨论】：

【解决方案3】：

您应该在具有主题的控件库中创建所有自定义控件。 https://github.com/SAP/openui5/blob/master/docs/controllibraries.md

在 sapui5 引导程序中加载主题会导致在您的控件库中加载具有相同主题名称（例如“sap_bluecrystal”）的 library.css 文件。

【讨论】：