qt - Qt Quick QML 中的位图字体

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 元素、一个关于它的外观的视频，甚至还有一个示例项目。

希望对大家有所帮助!