首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >C++ Cairo + RSVG -绘图时设置SVG颜色

C++ Cairo + RSVG -绘图时设置SVG颜色
EN

Stack Overflow用户
提问于 2019-02-01 20:22:23
回答 1查看 766关注 0票数 1

我试图在Cairo表面上绘制一个单色SVG,但它是用白色渲染的,而我希望它是黑色的。Cairo表面是一个8位的alpha表面(CAIRO_FORMAT_A8),所以我只处理灰度。

我正在测试的镜像如下:https://commons.wikimedia.org/wiki/File:Octicons-flame.svg

这是我用来渲染的代码:

代码语言:javascript
复制
//Display buffer and Canvas
int stride;
Byte *displayBuffer;
cairo_surface_t *surface;

stride = cairo_format_stride_for_width (CAIRO_FORMAT_A8, gulPanelW);
displayBuffer = malloc (stride * gulPanelH);
surface = cairo_image_surface_create_for_data (displayBuffer, CAIRO_FORMAT_A8, gulPanelW, gulPanelH, stride);
cairo_t *cr = cairo_create (surface);

cairo_set_operator (cr, CAIRO_OPERATOR_SOURCE);

//Flame Surface and SVG Handle
RsvgHandle* flame_handle;
flame_handle = rsvg_handle_new_from_file("flame.svg", 0);

//Set canvas background to grey
cairo_set_source_rgba (cr, 1.0, 1.0, 1.0, 0.5);
cairo_paint (cr);

//Add initial data and output
cairo_select_font_face (cr, "serif", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_BOLD);
cairo_set_font_size (cr, 48.0);
cairo_set_source_rgba (cr, 1.0, 1.0, 1.0, 0.0);
cairo_move_to (cr, 700.0, 105.0);
cairo_rotate(cr, (M_PI/2.0));
cairo_show_text (cr, "Temperature");
cairo_rotate(cr, -(M_PI/2.0));

cairo_select_font_face (cr, "serif", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_BOLD);
cairo_set_font_size (cr, 200.0);
cairo_set_source_rgba (cr, 1.0, 1.0, 1.0, 0.0);
cairo_move_to (cr, 540.0, 34.0);
cairo_rotate(cr, (M_PI/2.0));
cairo_show_text (cr, "19.4");
cairo_rotate(cr, -(M_PI/2.0));

cairo_translate (cr, 476.0, 200.0);
cairo_scale (cr, 0.07, 0.07);
cairo_rotate(cr, (M_PI/2.0));
rsvg_handle_render_cairo (flame_handle, cr);
cairo_rotate (cr, -(M_PI/2.0));
cairo_scale (cr, 1.0, 1.0);

cairo_surface_write_to_png (surface, "output.png");

这将输出以下内容:

Cairo Output

但是正如你所看到的,火焰渲染为白色,我希望它是黑色的-或者是一个特定的alpha值。

任何帮助都将不胜感激,我在开罗找不到太多关于SVG颜色的信息。

非常感谢。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-02-03 17:48:21

cairo_maskcairo_mask_surface可以使用另一个曲面的alpha通道作为绘制操作的遮罩。下面的示例使用它来“绘制具有特定alpha级别的东西”。

我还添加了一些必要的东西,使其成为一个自包含的示例,并去掉了不必要的cairo_image_surface_create_for_data

代码语言:javascript
复制
#include <cairo.h>
#include <librsvg/rsvg.h>
#include <math.h>

#define gulPanelW 800
#define gulPanelH 480

int main()
{
    //Display buffer and Canvas
    cairo_surface_t *surface;

    surface = cairo_image_surface_create (CAIRO_FORMAT_A8, gulPanelW, gulPanelH);
    cairo_t *cr = cairo_create (surface);

    cairo_set_operator (cr, CAIRO_OPERATOR_SOURCE);

    //Flame Surface and SVG Handle
    RsvgHandle* flame_handle;
    flame_handle = rsvg_handle_new_from_file("flame.svg", 0);

    //Set canvas background to grey
    cairo_set_source_rgba (cr, 1.0, 1.0, 1.0, 0.5);
    cairo_paint (cr);

    //Add initial data and output
    cairo_select_font_face (cr, "serif", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_BOLD);
    cairo_set_font_size (cr, 48.0);
    cairo_set_source_rgba (cr, 1.0, 1.0, 1.0, 0.0);
    cairo_move_to (cr, 700.0, 105.0);
    cairo_rotate(cr, (M_PI/2.0));
    cairo_show_text (cr, "Temperature");
    cairo_rotate(cr, -(M_PI/2.0));

    cairo_select_font_face (cr, "serif", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_BOLD);
    cairo_set_font_size (cr, 200.0);
    cairo_set_source_rgba (cr, 1.0, 1.0, 1.0, 0.0);
    cairo_move_to (cr, 540.0, 34.0);
    cairo_rotate(cr, (M_PI/2.0));
    cairo_show_text (cr, "19.4");
    cairo_rotate(cr, -(M_PI/2.0));

    // Draw the flame icon to a temporary surface
    cairo_save (cr);
    cairo_translate (cr, 476.0, 200.0);
    cairo_scale (cr, 0.07, 0.07);
    cairo_rotate(cr, (M_PI/2.0));
    cairo_push_group (cr);
    rsvg_handle_render_cairo (flame_handle, cr);
    cairo_pattern_t *p = cairo_pop_group (cr);

    // Use the temporary surface as a mask for drawing this color
    cairo_set_source_rgba (cr, 1.0, 1.0, 1.0, 0.0);
    cairo_mask(cr, p);
    cairo_restore (cr);

    // Clean up
    cairo_surface_write_to_png (surface, "output.png");
    cairo_pattern_destroy (p);
    cairo_destroy (cr);
    cairo_surface_destroy (surface);
    return 0;
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/54479442

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档