Back to Qt.io
Contact Us Blog Download Qt
このページでは

C

Qt Quick Ultralite font_bindings の例

Qt Quick Ultraliteでフォントプロパティにバインディングを記述する方法を示します。

概要

この例では、フォントプロパティにバインディングを記述する方法を示します。バインディングのサポートは、Spark Font エンジンが使用されている場合にのみ利用可能です。この例の UI では、スライダーコントロールを使用してテキストサイズを変更し、スイッチコントロールを使用してテキストスタイルとグリフのレンダリング品質を切り替えます。

この例では、以下のフォントクラス名を定義したfontmapファイルを使用しています：

  • "Roboto"
  • "ロボトライト"
  • "ロボト・イタリック"

これは、MCU.Config.defaultFontFamilyQmlProjectプロパティを "Roboto "に設定します。

フォントクラス名は、バインディングが再評価されるたびに更新されます。詳しくはフォントクラスのマッピングを参照してください。

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
}

メモリ使用量は、同じスタイルを使用するテキストアイテム間で同じフォント設定（Text.font）を共有することによって最適化できます。

Text {
    id: lightText
    text: "Hello again world"
    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: "from Qt."
}

フ ォ ン ト のレ ン ダ リ ング品質を下げ る こ と に よ っ て、 メ モ リ 使用量を さ ら に最適化す る こ と も で き ます。低品質のグ リ フ を使用す る と 、 実行時の メ モ リ 使用量は少なくて済みます。Font.QualityVeryHighフ ォ ン ト のquality プ ロ パテ ィ をFont.QualityVeryLow に設定す る と 、 1 ピ ク セルあ た り 8 ビ ッ ト のビ ッ ト 深度のアルフ ァ マ ッ プが生成 ・ レ ン ダ リ さ れます。

Text {
    id: qualityText
    text: "Variable glyph quality"
    font: Qt.font({
        pixelSize: pixelSizeSlider.value,
        // Depending on the 'qualitySwitch.checked' value, the font
        // rendering quality changes.
        quality: qualitySwitch.checked ? Font.QualityVeryHigh : Font.QualityVeryLow
    })
}

font properties ドキュメントも参照してください。

対象プラットフォーム

ファイル


詳細はこちら。