How to use FontAwesome in Qt

Question

FontAwesome makes adding editable icons into HTML fairly easy:

<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">

<i class="fa fa-camera-retro"></i>

I have tried adding a FontAwesome icon to a Qt widget, but it doesn't show:

QPushButton *qB = new QPushButton("TXT");
qB -> setProperty("class", "fa fa-camera-retro");

How can I go about it to make it work with Qt widgets?

Answer 1

Qt doesn't work like that. You need to create a qrc file and bundle FontAwesome to your project, like this:

<RCC>
  <qresource prefix="/">
    <file alias="FontAwesome.otf">FontAwesome.otf</file>
  </qresource>
</RCC>

Then include it in the .pro file:

RESOURCES += resources.qrc

Then load it and use it, like this, providing the unicode character of the icon you intend to display:

if (QFontDatabase::addApplicationFont(":/FontAwesome.otf") < 0)
    qWarning() << "FontAwesome cannot be loaded !";

QFont font;
font.setFamily("FontAwesome");
font.setPixelSize(32);

ui->pushButton->setFont(font);
ui->pushButton->setText("\uf083");

In your case, the camera icon code is indicated here

Result:

Answer 2

I'm looking to do the same with Qt5 and the last version of FontAwesome 5.x. After some research, I found a very simple class in GitHub for using Font Icon in Qt 5 and Qt 6 projects with QWidget. This class provides helpers to use Font awesome (v4.7, v5.15 and v6.0) and Google Material Icon (v4).

The code is very small and provides all the functions needed to display icons in QPushButton, QToolButton, etc.

Here, the GitHub link : https://github.com/philvl/ZFontIcon.