cairo简单使用指南

 

1. 画圆弧
cairo_public void
cairo_arc (cairo_t *cr,
           double xc, double yc,
           double radius,
           double angle1, double angle2);
    
2. 填充颜色
cairo_public void
cairo_set_source_rgb (cairo_t *cr, double red, double green, double blue);
cairo_public void
cairo_fill (cairo_t *cr);
EX： 填充红色矩阵
cairo_set_source_rgb (cr, 1, 0, 0);
cairo_rectangle(20, 20, 100, 100);
cairo_fill(cr);

3. 填充图案
cairo_surface_t *surface = cairo_image_surface_create_from_png("maple.png");
cairo_pattern_t *pattern = cairo_pattern_create_for_surface(surface);
cairo_set_source(cr, pattern);
cairo_pattern_set_extend(cairo_get_source(cr), CAIRO_EXTEND_REPEAT); //让图案如瓦片那样填充于形状内部
cairo_arc(cr, 200, 70, 50, 0.2*M_PI, 0.8*M_PI);
cairo_fill(cr);

4. 颜色渐变
cairo_pattern_t *pattern = cairo_pattern_create_linear(20.0, 260.0, 20.0, 360.0);
cairo_pattern_add_color_stop_rgb(pattern, 0.1, 0, 0, 0); //线段从0到1/10是黑色
cairo_pattern_add_color_stop_rgb(pattern, 0.5, 1, 1, 0); //从1/10到0.5由黑色渐变到黄色
cairo_pattern_add_color_stop_rgb(pattern, 0.9, 0, 0, 0); //从0.5到0.9由黄色渐变到黑色，剩下都是黑色
cairo_rectangle(cr, 20, 260, 300, 100);
cairo_set_source(cr, pattern); //将竖线pattern对应到矩形中
cairo_fill(cr);

5. 设置透明度
cairo_public void
cairo_set_source_rgba (cairo_t *cr,
                       double red, double green, double blue,
                       double alpha); //alpha为0时全透明，为1时不透明
       
6. 图片的淡出
cairo_surface_t *surface = cairo_image_surface_create_from_png("maple.png");
// 一下放在一个timer回调里，不断方便alpha的值达到图片的淡出效果
timer_cb
{
 cairo_set_source_surface(cr, surface, 10, 10); //将载入的图片设置为源
 cairo_paint_with_alpha(cr, alpha);
}

7. 图片的合成
/* Modify state */

/**
 * cairo_operator_t:
 * @CAIRO_OPERATOR_CLEAR: clear destination layer (bounded) (Since 1.0)
 * @CAIRO_OPERATOR_SOURCE: replace destination layer (bounded) (Since 1.0)
 * @CAIRO_OPERATOR_OVER: draw source layer on top of destination layer
 * (bounded) (Since 1.0)
 * @CAIRO_OPERATOR_IN: draw source where there was destination content
 * (unbounded) (Since 1.0)
 * @CAIRO_OPERATOR_OUT: draw source where there was no destination
 * content (unbounded) (Since 1.0)
 * @CAIRO_OPERATOR_ATOP: draw source on top of destination content and
 * only there (Since 1.0)
 * @CAIRO_OPERATOR_DEST: ignore the source (Since 1.0)
 * @CAIRO_OPERATOR_DEST_OVER: draw destination on top of source (Since 1.0)
 * @CAIRO_OPERATOR_DEST_IN: leave destination only where there was
 * source content (unbounded) (Since 1.0)
 * @CAIRO_OPERATOR_DEST_OUT: leave destination only where there was no
 * source content (Since 1.0)
 * @CAIRO_OPERATOR_DEST_ATOP: leave destination on top of source content
 * and only there (unbounded) (Since 1.0)
 * @CAIRO_OPERATOR_XOR: source and destination are shown where there is only
 * one of them (Since 1.0)
 * @CAIRO_OPERATOR_ADD: source and destination layers are accumulated (Since 1.0)
 * @CAIRO_OPERATOR_SATURATE: like over, but assuming source and dest are
 * disjoint geometries (Since 1.0)
 * @CAIRO_OPERATOR_MULTIPLY: source and destination layers are multiplied.
 * This causes the result to be at least as dark as the darker inputs. (Since 1.10)
 * @CAIRO_OPERATOR_SCREEN: source and destination are complemented and
 * multiplied. This causes the result to be at least as light as the lighter
 * inputs. (Since 1.10)
 * @CAIRO_OPERATOR_OVERLAY: multiplies or screens, depending on the
 * lightness of the destination color. (Since 1.10)
 * @CAIRO_OPERATOR_DARKEN: replaces the destination with the source if it
 * is darker, otherwise keeps the source. (Since 1.10)
 * @CAIRO_OPERATOR_LIGHTEN: replaces the destination with the source if it
 * is lighter, otherwise keeps the source. (Since 1.10)
 * @CAIRO_OPERATOR_COLOR_DODGE: brightens the destination color to reflect
 * the source color. (Since 1.10)
 * @CAIRO_OPERATOR_COLOR_BURN: darkens the destination color to reflect
 * the source color. (Since 1.10)
 * @CAIRO_OPERATOR_HARD_LIGHT: Multiplies or screens, dependent on source
 * color. (Since 1.10)
 * @CAIRO_OPERATOR_SOFT_LIGHT: Darkens or lightens, dependent on source
 * color. (Since 1.10)
 * @CAIRO_OPERATOR_DIFFERENCE: Takes the difference of the source and
 * destination color. (Since 1.10)
 * @CAIRO_OPERATOR_EXCLUSION: Produces an effect similar to difference, but
 * with lower contrast. (Since 1.10)
 * @CAIRO_OPERATOR_HSL_HUE: Creates a color with the hue of the source
 * and the saturation and luminosity of the target. (Since 1.10)
 * @CAIRO_OPERATOR_HSL_SATURATION: Creates a color with the saturation
 * of the source and the hue and luminosity of the target. Painting with
 * this mode onto a gray area produces no change. (Since 1.10)
 * @CAIRO_OPERATOR_HSL_COLOR: Creates a color with the hue and saturation
 * of the source and the luminosity of the target. This preserves the gray
 * levels of the target and is useful for coloring monochrome images or
 * tinting color images. (Since 1.10)
 * @CAIRO_OPERATOR_HSL_LUMINOSITY: Creates a color with the luminosity of
 * the source and the hue and saturation of the target. This produces an
 * inverse effect to @CAIRO_OPERATOR_HSL_COLOR. (Since 1.10)
 *
 * #cairo_operator_t is used to set the compositing operator for all cairo
 * drawing operations.
 *
 * The default operator is %CAIRO_OPERATOR_OVER.
 *
 * The operators marked as <firstterm>unbounded</firstterm> modify their
 * destination even outside of the mask layer (that is, their effect is not
 * bound by the mask layer).  However, their effect can still be limited by
 * way of clipping.
 *
 * To keep things simple, the operator descriptions here
 * document the behavior for when both source and destination are either fully
 * transparent or fully opaque.  The actual implementation works for
 * translucent layers too.
 * For a more detailed explanation of the effects of each operator, including
 * the mathematical definitions, see
 * <ulink url="http://cairographics.org/operators/">http://cairographics.org/operators/</ulink>.
 *
 * Since: 1.0
 **/
typedef enum _cairo_operator {
    CAIRO_OPERATOR_CLEAR,

    CAIRO_OPERATOR_SOURCE,
    CAIRO_OPERATOR_OVER,
    CAIRO_OPERATOR_IN,
    CAIRO_OPERATOR_OUT,
    CAIRO_OPERATOR_ATOP,

    CAIRO_OPERATOR_DEST,
    CAIRO_OPERATOR_DEST_OVER,
    CAIRO_OPERATOR_DEST_IN,
    CAIRO_OPERATOR_DEST_OUT,
    CAIRO_OPERATOR_DEST_ATOP,

    CAIRO_OPERATOR_XOR,
    CAIRO_OPERATOR_ADD,
    CAIRO_OPERATOR_SATURATE,

    CAIRO_OPERATOR_MULTIPLY,
    CAIRO_OPERATOR_SCREEN,
    CAIRO_OPERATOR_OVERLAY,
    CAIRO_OPERATOR_DARKEN,
    CAIRO_OPERATOR_LIGHTEN,
    CAIRO_OPERATOR_COLOR_DODGE,
    CAIRO_OPERATOR_COLOR_BURN,
    CAIRO_OPERATOR_HARD_LIGHT,
    CAIRO_OPERATOR_SOFT_LIGHT,
    CAIRO_OPERATOR_DIFFERENCE,
    CAIRO_OPERATOR_EXCLUSION,
    CAIRO_OPERATOR_HSL_HUE,
    CAIRO_OPERATOR_HSL_SATURATION,
    CAIRO_OPERATOR_HSL_COLOR,
    CAIRO_OPERATOR_HSL_LUMINOSITY
} cairo_operator_t;
cairo_public void
cairo_set_operator (cairo_t *cr, cairo_operator_t op);

8. 裁剪和遮蔽
（1） 裁剪
//绘制一幅图画和一个圆，此时图形尚未绘制到窗口里，他们还在内存里
cairo_surface_t *surface = cairo_image_surface_create_from_png("maple.png");
cairo_set_source_surface(cr, surface, 1, 1);
cairo_arc(cr, pos_x, pos_y, radius, 0, 2*M_PI);
cairo_clip(cr); //裁剪当前所使用的路径，即上述cairo_arc所画的圆弧
cairo_paint(cr); //绘制到前落入裁剪域中的源
（2）遮蔽
cairo_set_source_rgb(cr, 0, 0, 0);
cairo_surface_t *surface = cairo_image_surface_create_from_png("maple.png");
cairo_mask_surface(cr, surface, 0, 0);
cairo_fill(cr);

9. 变换
（1）平移
cairo_translate(cr, 100, 100); //将cr指定的cairo区域原点沿水平方向和竖直方向分别平移100个像素
（2）旋转
cairo_rotate(cr, M_PI/2); //绕原点旋转180度
（3）缩放
cairo_scale(cr, 0.7, 0.7);
(4)错切
cairo_matrix_t matrix;
cairo_matrix_init(&matrix,
 1.0, 0.5,
 0.0, 1.0,
 0.0, 0.0);
cairo_transfrom(cr, &matrix);

10. 文本
cairo_select_font_face(cr, "Pruisa", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_BOLD); //设置字体，传入字体名称，样式与轻重
cairo_set_font_size(cr, 13); //指定字体大小
cairo_move_to(cr, 20, 30);
cairo_show_text(cr, "text"); //显示指定文本到窗口