Qt使用FontAwesome图标字体库

Qt使用FontAwesome图标字体库_第1张图片

官网: http://fontawesome.io/
中文网: http://www.fontawesome.com.cn/
GitHub: https://github.com/FortAwesome/Font-Awesome

4.70旧版本使用方法:


在解压目录中找到 fonts\fontawesome-webfont.ttf 拷贝出来
这个是我们Qt程序使用FontAwesome图标字体库时需要加载的
然后在css目录下找到font-awesome.css这个是我们开发时需要对字体编码进行查找用的

在官网的 http://fontawesome.io/icons/ 页面可以查看所有的图标, 挑选我们需要的

使用时比如我们需要用这个心形的图标

其名称为heart, 那么在font-awesome.css中我们通过查找就可以得到它对应的字体编码

Qt使用FontAwesome图标字体库_第2张图片

也有更方便的方式: 官网直接查看字体编码 http://fontawesome.io/cheatsheet/

    // 添加字体文件
    int fontId = QFontDatabase::addApplicationFont(":/Font/fontawesome-webfont.ttf");
    QStringList fontFamilies = QFontDatabase::applicationFontFamilies(fontId);
    qDebug() << "fontFamilies.size() " << fontFamilies.size();

    // 创建字体
    QFont font;
    font.setFamily(fontFamilies.at(0));
    font.setPointSize(20);

    // 设置字体及样式、大小
    ui->ZoomInLabel->setFont(font);
    ui->ZoomInLabel->setText(QChar(0xf00e));
    ui->ZoomInLabel->setStyleSheet("color: rgb(0, 160, 230);");

    font.setPointSize(30);
    ui->ZoomOutLabel->setFont(font);
    ui->ZoomOutLabel->setText(QChar(0xf004));
    ui->ZoomOutLabel->setStyleSheet("color: green;");

QML工程中使用:

FontLoader{
        id:icomoonFont;
        source: "qrc:/Font/Font Awesome 5 Free-Solid-900.otf";
    }
font{
            family: icomoonFont.name;
            pixelSize: 12;
        }
        text: "\uf410";


效果显示:



4.70之后版本的使用方法:

新版本将ttf拆分成了3个ttf文件(fa-solid-900.ttf、fa-brands-400.ttf、fa-regular-400.ttf)

不同类型的图标使用不同的ttf文件,使用方法相同

Solid Icons


Regular Icons


Brand Icons





你可能感兴趣的:(qt,qt,fonta,wesome)