ruby - 潘戈+开罗;是否有处理文本中 <img> 样式标签的现有方法?

标签 ruby cairo pango

Pango 语法支持一些纯文本标记。据我所知,这也没有扩展到嵌入图像。

环顾四周,我找不到太多现有实现方式,但我之前没有做过 pango+cairo 工作,所以我可能会错过明显的社区。

据我所知,一个合理的方法是只分析一个字符串,提取任何标签,创建 cairo 图像,然后相应地修改它们周围的 pango 布局。

这看起来也像是以前有人做过的事情。

我专门寻找这些问题的答案:

  1. pango+cairo 是否已经解决了这个问题,我只是误读了文档?
  2. 以前有没有做过这样的事情,引用在哪里?
  3. 这是一种合理的方法,还是我应该尝试其他方法,什么?

(还要注意我使用的是 ruby​​,所以这可能会影响我的选择)

最佳答案

我查看了标记解析器的源代码,它不允许“形状”属性(Pango 几乎包含图形的方式),但可以“手动”完成。

由于网络上绝对没有示例代码,这里是 Pango/Cairo/Images 101。

为了一个简单的演示,我创建了一个 800x400 的窗口,添加了一个 GtkDrawingArea 并连接了“draw”信号。在进入主程序循环之前,我用以下代码对其进行了初始化:

PangoLayout     *Pango;
void init_drawingArea (GtkWidget *pWidget)
{
  cairo_surface_t *pImg = cairo_image_surface_create_from_png ("linux.png");
  PangoRectangle   r = {0, 0, PANGO_SCALE * cairo_image_surface_get_width (pImg),
                              PANGO_SCALE * cairo_image_surface_get_height(pImg)};
  PangoContext    *ctxt = gtk_widget_get_pango_context (pWidget);
  PangoAttrList   *attList = pango_attr_list_new();
  PangoAttribute  *attr;

  Pango = pango_layout_new (ctxt);

  pango_cairo_context_set_shape_renderer (ctxt, render, NULL, NULL);
  pango_layout_set_text (Pango, pszLorem, -1);
  pango_layout_set_width(Pango, PANGO_SCALE * 800);
  attr = pango_attr_shape_new_with_data(&r, &r, pImg, NULL, NULL);
  attr->start_index = 0; attr->end_index = 1;
  pango_attr_list_insert (attList, attr);

  attr = pango_attr_shape_new_with_data(&r, &r, pImg, NULL, NULL);
  attr->start_index = 152; attr->end_index = 153;
  pango_attr_list_insert (attList, attr);

  pango_layout_set_attributes (Pango, attList);
}

上下文的形状渲染器被设置为 render() 并且一个 PangoLayout 被创建和初始化。然后它创建 2 个形状属性,将用户数据设置为我们从 png 文件填充的 cairo 表面,并将属性应用于文本的字符 0 和 152。

“绘制”信号处理很简单。

gboolean onDraw (GtkWidget *pWidget, cairo_t *cr, gpointer user_data)
{
  pango_cairo_show_layout (cr, Pango);
  return 1;
}

并根据需要调用render()PangoCairoShapeRenderFunc函数:

void render (cairo_t *cr, PangoAttrShape *pShape, gboolean do_path, gpointer data)
{
  cairo_surface_t *img = (cairo_surface_t *)pShape->data;
  double  dx, dy;

  cairo_get_current_point(cr, &dx, &dy);
  cairo_set_source_surface(cr, img, dx, dy);
  cairo_rectangle (cr, dx, dy, pShape->ink_rect.width/PANGO_SCALE,
                               pShape->ink_rect.height/PANGO_SCALE);
  cairo_fill(cr);
}

从 cairo 获取当前点,它绘制一个矩形并用图像填充它。 This really sucks!

这就是它所做的一切。图片是事后添加的,它显示了。它们遵循与任何其他字形相同的规则,因此它们仅限于相当于 CSS 的显示:内联。

我已将代码放在 http://immortalsofar.com/PangoDemo/如果有人想玩它。我,我来到这里试图绕过 GtkTextBuffer 的限制。我想我只需要更深入一点。

关于ruby - 潘戈+开罗;是否有处理文本中 <img> 样式标签的现有方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28017155/

相关文章:

python - Python 中布局文本的最佳模块

python-3.x - 在带有 gi.repository 的 python 中使用开罗地区

cairo - Pango 无法使用 librsvg 找到字体

javascript - 如何使用我的 javascript 函数摆脱周末约会?

ruby - 根据之前的分组结果对正则表达式进行分组

ruby - 如何排除无效日期 ruby

gcc - 编译/链接到开罗图书馆

c - 为什么 pango_cairo_show_layout 在稍微错误的位置绘制文本?

php - 在 PHP Imagick API 中使用 Pango

ruby-on-rails - Ruby 字符串到时间的转换