Qt Quick Ultralite font_bindings 范例

Demonstrates how to write bindings on font properties in Qt Quick Ultralite.


This example demonstrates how to write bindings on font properties. The binding support is available only when the Spark Font engine is used. The example's UI uses a slider control to change the text size, and switch controls to toggle the text style.

此范例使用 fontmap file, which defines the following font class names:

  • "Roboto"
  • "Roboto Light"
  • "Roboto Italic"

It sets the QUL_DEFAULT_FONT_FAMILY CMake target property to "Roboto".

The font class name is updated whenever bindings are re-evaluated. See font class mapping 了解更多信息。

Text {
    text: "Hello world"
    // Depending on the 'italicSwitch.checked' value, the font class
    // name can be "Roboto" or "Roboto Italic".
    font.italic: italicSwitch.checked
    font.pixelSize: pixelSizeSlider.value
Text {
    text: "from Qt."
    // An alternativele way is to provide a full class name via font.family property.
    font.family: italicSwitch.checked ? "Roboto Italic" : "Roboto"
    font.pixelSize: pixelSizeSlider.value

The memory usage can be optimized by sharing the same font configuration (Text.font) across text items that use the same style.

Text {
    id: lightText
    text: "This text is displayed"
    font.pixelSize: pixelSizeSlider.value
    // Depending on the 'lightSwitch.checked' value, the font class
    // name can be "Roboto" or "Roboto Light".
    font.weight: lightSwitch.checked ? Font.Light : Font.Normal
Text {
    // To save the memory resources, the font configurations can be shared
    // between elements. This happens automatically in the emitted cpp code
    // when font configuration uses only constant values in font.* bindings.
    font: lightText.font
    text: "using the Monotype Spark font engine."

另请参阅 font properties 文档编制。