Question

我有一个png位图，一个接一个地绘制了许多“字形”，还有一个文本文件，它将ascii编号与此位图中的位置和大小相关联。字形是使用不同的颜色和透明度水平手绘的。

不知怎的，我需要在QML上打开并使用这个字体。不幸的是，似乎QML“不支持位图字体”。

有没有解决方案？

Answer 1

我在发布这个问题几天后就已经解决了这个问题。从那时起，似乎有很多人仍在尝试在Qt Quick中使用“老派”位图字体。我找到的解决方案非常优雅，性能非常出色。

import QtQuick 1.1

Row {
    property string text: ""
    Repeater {
        model: text.length
        Image {
            source: "bitmapfont/" + text.charCodeAt(index) + ".png"
        }
    }
}

在与其他qml代码相同的目录中另存为“TextBitmap.qml”，然后创建一个名为字体名称的子目录（本例中为“bitmapfont”）。您需要单独绘制或剪切每个位图字体字形，并将它们作为单独的.png存储在该子文件夹中，其名称是该字形的Unicode;例如，字符'A'的bitmapfont / 65.png，字符'B'的bitmapfont / 66.png等等。

当第一次呈现此自定义TextBitmap元素时 - 或者任何时候文本属性被更改 - Repeater将自动为文本中的每个字符创建一个图像元素，每个字符都显示“bitmapfont”中相应的.png。

像这样使用：

import QtQuick 1.1

Rectangle {
    width: 800
    height: 500

    TextBitmap {
        text: "Hello Bitmap Fonts!"
    }
}

在http://www.royconejo.com/bitmap-fonts-in-qt-quick-qml/中，您会找到一个更详细的TextBitmap元素，一个视频，甚至是一个示例项目。

我希望它有所帮助！

Answer 2

使用Qt的字体基础结构无法直接实现这一点：不支持位图字体。您可以使用QFontDatabase::addApplicationFronFromData，但您的字体必须可用作TrueType字体或TrueType字体集。

解决方法是。

使用这样的字体将“文本”渲染到QImage中并使用QML显示。如果文本是静态的并且不经常更改，则这是可以的。
使用QQuickPaintedItem渲染“文字”。

Qt Quick QML中的位图字体

2 个答案: