向OpenUI5添加新图标？

Question

我们需要向OpenUI5添加新图标.图标已被定义为基于矢量的字体.

我知道可以通过https://icomoon.io/等服务将图标添加到SAP标准字体.但是,我希望能够将它们保存在一个单独的文件中(这样我们就不需要在新的OpenUI5版本出现时重做任务).

是否可以定义用于图标的其他字体？

Answer 1

正如您已经提到的,为了将来的兼容性原因,扩展UI5字体并不是一个好主意.如果您已经拥有自己的字体,可以使用UI5轻松注册,并使用类似的url-schema引用它.而不是sap-icon://funny-icon你可以说sap-icon://dparnas-icon/funny-icon.

这是一个示例实现:

jQuery.sap.require("sap.ui.core.IconPool");
jQuery.sap.require("sap.ui.thirdparty.URI");

(function() {
  var aIconNames = [ "funny-icon", "another-icon" ], // the icon names
    sCollectionName = "dparnas-icon", // the collection name used in the url-schema
    sFontFamily = "DarnasIcons", // the icon font family like defined in your css
    aIconContents = [ "E003", "E004" ]; // the unicode characters to find aIconNames under, same order

  // add the icons the your icon pool
  for (var i = 0; i < aIconNames.length && i < aIconContents.length; i++) {
    sap.ui.core.IconPool.addIcon(
      aIconNames[i], 
      sCollectionName, 
      sFontFamily, 
      aIconContents[i]
    );
  }
}());

此外,您必须在CSS中定义font-family.而已!它很容易但很难找到;)