このページでは

C

Qt Quick Ultralite フォント品質の例

アプリケーション内でフォントの品質を制御する方法を示します。

概要

このサンプルでは、CMake および QML API を使用してアプリケーション内のフォント品質を制御する方法を示します。また、これらの API が、メモリ使用量を最適化しながらテキストのレンダリングにどのような影響を与えるかを示します。

autoGenerateGlyphs を有効にした Font_quality の例。低品質のラテン文字、高品質の数字、およびバインドされたテキスト項目が表示されています。

この例のUIには、異なるフォント品質設定でレンダリングされた複数のText アイテムが含まれています。

対象プラットフォーム

プロジェクト構造

CMake プロジェクトファイル

このサンプルには、同じ QML コードを共有する 2 つの実行可能ターゲットが含まれています。これらのターゲットは、MCU.Config.autoGenerateGlyphsターゲットプロパティに対して異なる設定を使用しています。

この設定は、各フォントに対して生成されるグリフのセットに影響を与えます。

どちらの場合も、MCU.Config.defaultFontQualityターゲットプロパティが "VeryLow" に設定されています。これにより、QML API を使用して明示的に設定されていない場合、デフォルトで低品質のフォントが使用されます。autoGenerateGlyphs が有効な場合:

...
    MCU.Config {
        autoGenerateGlyphs: false
        defaultFontQuality: "VeryLow"
    }
...

autoGenerateGlyphsが無効な場合:

...
        MCU.Config {
                autoGenerateGlyphs: true
                defaultFontQuality: "VeryLow"
        }
...
アプリケーションの UI

アプリケーションの UI は、font_quality.qml ファイルで定義されています。ここでは、デフォルトの品質(「VeryLow」に設定)の「lowQualityLatinFont 」フォントと、より高品質な「highQualityDigits 」フォントの 2 種類のフォントが使用されています。

低品質のフォントでは、font.unicodeCoverageBasicLatin のUnicodeブロックに設定されています。

readonly property font lowQualityLatinFont: Qt.font({
    pixelSize: 30,
    unicodeCoverage: [Font.UnicodeBlock_BasicLatin]
    // quality set Font.QualityVeryLow by defualy
    // using \l MCU.Config.defaultFontQuality QmlProject property
})

一方、高品質のフォントでは、font.unicodeCoverage0 から9 までの数字と、: のコロン文字を含むように設定されています。

readonly property font highQualityDigits: Qt.font({
    pixelSize: 60,
    unicodeCoverage: [[0x30,0x3A]], // 0-9:
    quality: Font.QualityVeryHigh
})

次に、テキスト項目を作成します。1つは、任意の低品質なラテン文字テキストをレンダリングするためのものです:

Text {
    anchors.horizontalCenter: parent.horizontalCenter
    id: lowQualityText
    font: lowQualityLatinFont
    text: "VeryLow 123"
}

もう1つは、高品質な数字をレンダリングするためのものです:

Text {
    anchors.centerIn: parent
    font: highQualityDigits
    text: "13:59"
}

最後に、これら2つのText 項目のtext プロパティを、異なるフォント品質でバインドした結果を表示するテキストを作成します:

Text {
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.bottom: parent.bottom
    font: highQualityDigits
    // Glyps may be missing if \l MCU.Config.autoGenerateGlyphs is set to \c false
    text: lowQualityText.text
}

MCU.Config.autoGenerateGlyphsプロパティの値によっては、このテキストアイテムでグリフが欠落する場合があることに注意してください。詳細については、「グリフの欠落」を参照してください。

メモリ使用量

フォントファミリーは、ウェイト、サイズ、イタリック、品質などの他のフォントプロパティと組み合わさることで、いわゆる「フォント構成」を一意に定義します。

font.unicodeCoverage を使用すると、MCU.Config.autoGenerateGlyphsプロパティと組み合わせて使用した場合、メモリ使用量およびレンダリング出力に影響を与えます。

デフォルトでは、このプロパティは `ON ` に設定されており、アプリケーションで使用されるすべてのフォント構成に対して、qml ファイル内の使用されるすべての文字のグリフが生成されます。これにより、異なるフォント構成を持つ `Text ` アイテムのプロパティ間でバインディングを作成する前に、すべてのグリフが存在するかどうかを確認する必要がなくなるため、便利です。 しかし、この利便性には代償が伴います。バイナリサイズと実行時のメモリ使用量が増加するからです。

バイナリサイズとメモリ使用量を最適化するには、MCU.Config.autoGenerateGlyphs を OFF に設定します。これにより、すべてのグリフの自動生成が無効化され、font.unicodeCoverage の設定に基づいて必要なグリフのみが生成されるようになります。 これにより、各フォント構成がfont.unicodeCoverage プロパティに基づいてグリフを取得するようになり、メモリ使用量が最適化されます。単純そうに聞こえますが、すべてのフォント構成に必要なグリフがすべて含まれるようにするには、アプリケーションを慎重に設計する必要があります。

注: MCU.Config.autoGenerateGlyphsが OFF に設定されている場合、font.unicodeCoverage が適切な値に設定されていないと、欠落しているグリフの代わりにテキスト項目プレースホルダーボックスでレンダリングされます。

欠落しているグリフ

MCU.Config.autoGenerateGlyphs を OFF に設定し、各フォント構成でfont.unicodeCoverage を指定すると、バイナリサイズが最適化され、メモリ使用量も削減されますが、アプリケーションの設計には細心の注意を払う必要があります。

低品質のテキストが高品質のテキストに割り当てられているQMLコードを見てみましょう:

Text {
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.bottom: parent.bottom
    font: highQualityDigits
    // Glyps may be missing if \l MCU.Config.autoGenerateGlyphs is set to \c false
    text: lowQualityText.text
}

MCU.Config.autoGenerateGlyphsを ON に設定している場合は全く問題ありませんが、自動生成をOFF に設定してテキストをレンダリングすると、グリフが欠落してしまいます。

autoGenerateGlyphs を無効にした Font_quality の例。highQualityDigits フォント設定に含まれていないグリフの代わりにプレースホルダーボックスが表示されています。

前の画像からわかるように、highQualityDigits フォントには、font.unicodeCoverage が指定された文字(0-9 および: )のグリフしか含まれていません。lowQualityText をレンダリングするために必要なグリフは、このフォント設定では生成されません。

ファイル:

関連項目: font.qualityMCU.Config.autoGenerateGlyphs、およびMCU.config.defaultFontQuality

特定の Qt ライセンスの下で利用可能です。
詳細はこちらをご覧ください。