Font Awesome in QML (Qt Quick)
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
controls
resource
view
.gitignore
CHANGELOG.md
FontAwesome.qml
Info.plist
LICENSE
README.md
deployment.pri
font-awesome-qml.pri
font-awesome-qml.pro
font-awesome-qml.rc
font-awesome.qrc
main.cpp
main.qml
main.qrc
qml.qrc

README.md

font-awesome-qml

font-awesome-qml provides the Font Awesome web fonts to Qt Quick/QML engine.

How to use

  1. Add the file FontAwesome.qml and controls folder to your project.

  2. If necessary import FontAwesome types

import "controls" as Awesome
  1. Using Font Awesome:
// main.qml

import "controls" as Awesome

Window {

  FontAwesome {
    id: awesome
    // resource: "qrc:///resource/fontawesome-webfont.ttf"
    resource: "http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/fonts/fontawesome-webfont.ttf"
  }

  Text {
      id: text
      font.pointSize: 180
      font.family: awesome.family
      text: awesome.loaded ? awesome.icons.fa_money : ""
  }

  Awesome.Text {
    icon: awesome.icons.fa_money
    text: "fa_money"
  }

  Awesome.Button {
    icon: awesome.icons.fa_money
    text: "fa_money"
  }
}

Avaliable Properties

// Alias to acess individual font-awesome variables (icons)
property alias icons:

// Property to chech if the Font Loader it is ready, if it is using the remote
// font-awesome CDN it is necessary to check and wait for to be true.
property alias loaded: false

// Set font-awesome Font Loader source
property alias resource

// Return font family name
readonly property string family: "FontAwesome"

Considerations

I needed to replace the "-" character, from Font Awesome icons name, to "_", because QML/JS doesn't accept minus character at variables name.

You can see all availables icons at controls/Variables.qml file.

Versions Tested

Qt Version   : 5.3
Font Awesome : 4.1.0

Screenshot

screenshot

Thanks

Font Awesome - The iconic font and CSS toolkit.

Qt Project - True cross-platform framework.

"Using Fonts Awesome in QML" by markg85.

Credits

Created by Ricardo do Valle.

Contributing

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Added some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request