Custom Fonts in HaxeUI v2 css?

Hello all!

I’m trying to add a custom font to an xml-defined HaxeUI label element via CSS. So far I’ve found that the system uses the “font-name” property, but I’m not too sure how to translate that into actually using the file I have at “resources/fonts/x.otf” as none of the CSS samples I’ve found use that property. I’ve tried quite a few variations (eg “x”, “fonts/x” “fonts/x.otf” etc…) and they don’t seem to work.

tl;dr- How do I use font files via CSS in HaxeUI v2?

Hey… which backend are you using?

Cheers,
Ian

Ian

I’m using HTML5 and OpenFL.

Hi,

If you add

<assets path="assets/fonts" rename="fonts" />

to application/project.xml, then openfl should have access to those fonts. If openfl knows about them, HaxeUI will too, so it should be just as simple as:

<button text="Spirax Font Test" style="font-size: 64px;font-name: 'fonts/Spirax-Regular.ttf'" />

(Im using inline css, but you could equally set it up in a css rule, etc)

image

2 Likes