[Jimmy]

Hi.
I have been trying to find documentation about changing the icon font in a v-play project. Can you help me, please?
For example I want to replace Font Awesome for another font.

[GüntherFelgo Team]

Hi Jimmy,

To use custom fonts, you can use a FontLoader item with custom Text as shown here: https://felgo.com/doc/apps-getting-started/#fonts
This also works to import icon fonts. FontAwesome is already included and does not require to be loaded with a FontLoader.

For more details about developing Felgo apps, you can have a look at our open-source demos and examples. We also provide some tutorials to learn different aspects of the engine. They are definitely worth a look!

Best,
Günther

[Jimmy]

Ok, I understand that. In the Icon QML Type doc it says “Alternatively, a different icon font can be used by setting the Theme::iconFont property“. How can I set that property if I have my custom-font.otf file?

Thanks

[GüntherFelgo Team]

You can change it in the same way, as the code example from font doc posted above changes the Theme.normalFont.

However, please note that changing the Theme.iconFont in turn then requires you to use your own unicode text values to draw the desired font icons. The IconType configurations are only valid for FontAwesome.

 

[Jimmy]

Thanks, that really helped me so much!

[Victor Manuel]

How to update font awesome to 6.5.1 pro into Felgo 3

[GüntherFelgo Team]

Hi Victor,

you can use a FontLoader to include and use custom fonts in your application. The Felgo controls use the Theme.iconFont, which you can also replace with your custom font like this:

App {
  onInitTheme: {
    Theme.iconFont = iconFont
  }

  FontLoader{
    id: iconFont
    source: "../path/to/your/font/fa-light-300.ttf"
  }
}