使用 cairo 和 freetype 进行字体布局和渲染

Question

我的系统只有 freetype2 和 cairo 库可用。我想要实现的是：

获取 UTF-8 文本的字形
排版文字，存储位置信息（自己）
获取每个字形的 cairo 路径以进行渲染

不幸的是，文档并没有真正解释应该如何完成，因为他们希望人们使用像 Pango 这样的更高级别的库。

我认为可能是正确的：使用 cairo_scaled_font_create 创建缩放字体，然后使用 cairo_scaled_font_text_to_glyphs 检索文本的字形。 cairo_glyph_extents 然后给出每个字形的范围。但是我怎样才能得到像字距调整和进步这样的东西呢？另外，我怎样才能获得每种字体的路径？

是否有关于此主题的更多资源？这些功能是预期的方式吗？

Answer 1

考虑到开罗的文本系统，这些函数似乎是最好的方法。它只是更多地表明开罗并不是真正适合文本。它实际上无法进行字距调整或路径调整。我相信，Pango 会有自己的复杂代码来完成这些事情。

为了 Ghost 的最佳发展，我建议移植 Pango，因为无论如何您（或其他人）最终可能都会想要它。

Answer 2

好的，所以我找到了需要的东西。

您首先需要创建一个 cairo_scaled_font_t 代表特定大小的字体。为此，可以在设置字体后简单地使用 cairo_get_scaled_font，它会为上下文中的当前设置创建缩放字体。

接下来，您使用 cairo_scaled_font_text_to_glyphs 转换输入文本，这给出了一个字形数组和簇作为输出。簇映射表示 UTF-8 字符串的哪一部分属于字形数组中的相应字形。

要获取字形的范围，使用 cairo_scaled_font_glyph_extents。它给出了每个 glyph/set 字形的尺寸、进度和方位。

最后，可以使用 cairo_glyph_path 将字形的路径放入上下文中。然后可以根据需要绘制这些路径。

以下示例将输入字符串转换为字形，检索其范围并呈现它们：

const char* text = "Hello world";
int fontSize = 14;
cairo_font_face_t* fontFace = ...;

// get the scaled font object
cairo_set_font_face(cr, fontFace);
cairo_set_font_size(cr, fontSize);
auto scaled_face = cairo_get_scaled_font(cr);

// get glyphs for the text
cairo_glyph_t* glyphs = NULL;
int glyph_count;
cairo_text_cluster_t* clusters = NULL;
int cluster_count;
cairo_text_cluster_flags_t clusterflags;

auto stat = cairo_scaled_font_text_to_glyphs(scaled_face, 0, 0, text, strlen(text), &glyphs, &glyph_count, &clusters, &cluster_count,
        &clusterflags);

// check if conversion was successful
if (stat == CAIRO_STATUS_SUCCESS) {

    // text paints on bottom line
    cairo_translate(cr, 0, fontSize);

    // draw each cluster
    int glyph_index = 0;
    int byte_index = 0;

    for (int i = 0; i < cluster_count; i++) {
        cairo_text_cluster_t* cluster = &clusters[i];
        cairo_glyph_t* clusterglyphs = &glyphs[glyph_index];

        // get extents for the glyphs in the cluster
        cairo_text_extents_t extents;
        cairo_scaled_font_glyph_extents(scaled_face, clusterglyphs, cluster->num_glyphs, &extents);
        // ... for later use

        // put paths for current cluster to context
        cairo_glyph_path(cr, clusterglyphs, cluster->num_glyphs);

        // draw black text with green stroke
        cairo_set_source_rgba(cr, 0.2, 0.2, 0.2, 1.0);
        cairo_fill_preserve(cr);
        cairo_set_source_rgba(cr, 0, 1, 0, 1.0);
        cairo_set_line_width(cr, 0.5);
        cairo_stroke(cr);

        // glyph/byte position
        glyph_index += cluster->num_glyphs;
        byte_index += cluster->num_bytes;
    }
}

使用 cairo 和 freetype 进行字体布局和渲染

Font layouting & rendering with cairo and freetype

c

fonts

freetype

text-rendering

cairo