Skip to main content
Use External Font Icons in SAPUI5
- Download font files. Those files have extensions like eot, svg, ttf, woff and woff2. Except the font files, normally there is corresponding CSS file in which icon classes are defined.
- Create a new JSON file and give it a same name as the downloaded font file.
- From the CSS file, find icon information. In CSS file, find code like
"icon-abc:before{content:"\f0b4"}"
If this icon is what you want to use in the UI5 app, then add an entry to the newly created JSON file:
{
"icon-abc": 0xf0b4
} - Register it as a new font family by UI5 code:
sap.ui.require(["sap/ui/core/IconPool"], function(IconPool){
IconPool.registerFont({fontFamily: "NewIcons",fontURI: "/fonts"});
}
- Use the icon in UI5 view.
<core: Icon src="sap-icon://NewIcons/icon-abc" />
Comments
Post a Comment