2010年11月16日 星期二

[轉貼]Cairo 圖形指南 (12) —— 裁剪與遮蔽

在這一篇中講述裁剪（Clipping）與遮蔽（Masking）。

裁剪

在下面的示例中，對一幅圖像進行裁剪。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
#include
#include
#include
cairo_surface_t *image;
static gboolean
on_expose_event(GtkWidget *widget,
GdkEventExpose *event,
gpointer data)
{
cairo_t *cr;
static gint pos_x = 128;
static gint pos_y = 128;
gint radius = 40;
static gint delta[] = { 3, 3 };
cr = gdk_cairo_create(widget->window);
gint width, height;
gtk_window_get_size(GTK_WINDOW(widget), &width, &height);
if (pos_x <>
delta[0] = rand() % 4 + 5;
} else if (pos_x > width - radius) {
delta[0] = -(rand() % 4 + 5);
}
if (pos_y <>
delta[1] = rand() % 4 + 5;
} else if (pos_y > height - radius) {
delta[1] = -(rand() % 4 + 5);
}
pos_x += delta[0];
pos_y += delta[1];
cairo_set_source_surface(cr, image, 1, 1);
cairo_arc(cr, pos_x, pos_y, radius, 0, 2*M_PI);
cairo_clip(cr);
cairo_paint(cr);
cairo_destroy(cr);
return FALSE;
}
static gboolean
time_handler (GtkWidget *widget)
{
if (widget->window == NULL) return FALSE;
gtk_widget_queue_draw(widget);
return TRUE;
}
int main(int argc, char *argv[])
{
GtkWidget *window;
gint width, height;
image = cairo_image_surface_create_from_png("turnacastle.png");
width = cairo_image_surface_get_width(image);
height = cairo_image_surface_get_height(image);
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
g_signal_connect(G_OBJECT(window), "expose-event",
G_CALLBACK(on_expose_event), NULL);
g_signal_connect(G_OBJECT(window), "destroy",
G_CALLBACK(gtk_main_quit), NULL);
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
gtk_window_set_default_size(GTK_WINDOW(window), width+2, height+2);
gtk_widget_set_app_paintable(window, TRUE);
gtk_widget_show_all(window);
g_timeout_add(100, (GSourceFunc) time_handler, (gpointer) window);
gtk_main();
cairo_surface_destroy(image);
return 0;
}

在這一示例中，在窗口中會有一個圓形區域不斷移動，並且在該區域顯示位於其下的圖像，彷彿是通過一個孔洞觀看圖像。

?
1
2
3
4
5
if (pos_x <>
delta[0] = rand() % 4 + 5;
} else if (pos_x > width - radius) {
delta[0] = -(rand() % 4 + 5);
}

當這個圓形區域碰到窗口邊界，它的移動方向就會隨機改變。

?
1
2
cairo_set_source_surface(cr, image, 1, 1);
cairo_arc(cr, pos_x, pos_y, radius, 0, 2*M_PI);

這裡是繪製一幅圖像和一個圓。注意：這時，圖形尚未繪製到窗口中，它們還在內存裡。

?
1
cairo_clip(cr);

cairo_clip() 函數設定裁剪域——當前所用的路徑，即 cairo_arc() 函數所創建的路徑。

?
1
cairo_paint(cr);

cairo_paint() 函數繪製當前落入裁剪域中的源。

裁剪矩形

下面這個示例是對一個 Java 2D 示例的模擬。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
#include
#include
#include
static gboolean
on_expose_event(GtkWidget *widget,
GdkEventExpose *event,
gpointer data)
{
cairo_t *cr;
cr = gdk_cairo_create(widget->window);
static gboolean xdirection = TRUE;
static gint counter = 0;
int width, height;
gtk_window_get_size(GTK_WINDOW(widget), &width, &height);
static gdouble rotate = 0;
static gint bigx = 20;
static gint bigy = 200;
static gint delta = 1;
counter += 1;
if (bigx > width) {
xdirection = FALSE;
delta = -delta;
bigx = width;
}
if (bigx <>
bigx = 1;
delta = -delta;
}
if (bigy > height) {
xdirection = TRUE;
delta = -delta;
bigy = height;
}
if (bigy <>
delta = -delta;
bigy = 1;
}
if (xdirection) {
bigx += delta;
} else {
bigy += delta;
}
cairo_translate(cr, width / 2, height /2);
cairo_rectangle(cr, -bigx/2, -bigy/2, bigx-2, bigy-2);
cairo_set_source_rgb(cr, 0, 0, 0);
cairo_set_line_width(cr, 1);
cairo_stroke(cr);
cairo_rotate(cr, rotate);
rotate += 0.01;
cairo_rectangle(cr, -50, -25, 100, 50);
cairo_stroke(cr);
GdkRectangle bigrect;
GdkRectangle rect;
GdkRectangle intersect;
bigrect.x = -bigx/2;
bigrect.y = -bigy/2;
bigrect.width = bigx -2;
bigrect.height = bigy -2;
rect.x = -50;
rect.y = -25;
rect.width = 100;
rect.height = 50;
gdk_rectangle_intersect(&bigrect, &rect, &intersect);
cairo_rectangle(cr, intersect.x, intersect.y, intersect.width, intersect.height);
cairo_fill(cr);
cairo_destroy(cr);
return FALSE;
}
static gboolean
time_handler (GtkWidget *widget)
{
if (widget->window == NULL) return FALSE;
gtk_widget_queue_draw(widget);
return TRUE;
}
int
main (int argc, char *argv[])
{
GtkWidget *window;
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
g_signal_connect(G_OBJECT(window), "expose-event",
G_CALLBACK(on_expose_event), NULL);
g_signal_connect(G_OBJECT(window), "destroy",
G_CALLBACK(gtk_main_quit), NULL);
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
gtk_window_set_default_size(GTK_WINDOW(window), 250, 200);
gtk_widget_set_app_paintable(window, TRUE);
gtk_widget_show_all(window);
g_timeout_add(5, (GSourceFunc) time_handler, (gpointer) window);
gtk_main();
return 0;
}

在這個示例中，繪製了兩個矩形，一個是形狀大一些的，一個是在旋轉的。大點的那個矩形，持續的在進行形狀的縮放，小一點的一直在旋轉。在兩個矩形的 運動過程中進行了交集操作，它們的相交區域用黑色區域來繪製。注意：那個相交區域並非恰好是矩形，只是為了簡化，將那個區域用矩形近似替代。

?
1
static gboolean xdirection = TRUE;

這個變量決定了那個大一些的矩形的運動方向。

?
1
2
3
4
5
if (bigx > width) {
xdirection = FALSE;
delta = -delta;
bigx = width;
}

如果那個大的矩形，其寬度增長到與窗口的寬度相等時，就開始收縮，同時矩形開始沿 y 方向收縮。

?
1
cairo_rotate(cr, rotate);

cairo_rotate() 函數用來旋轉那個小一點的矩形。

?
1
2
3
GdkRectangle bigrect;
GdkRectangle rect;
GdkRectangle intersect;

這裡定義了三個矩形區域。insersect 是那兩個矩形的相交區域。

?
1
gdk_rectangle_intersect(&bigrect, &rect, &intersect);

這個函數可完成矩形相交運算。

?
1
2
cairo_rectangle(cr, intersect.x, intersect.y, intersect.width, intersect.height);
cairo_fill(cr);

繪製相交區域的矩形。

遮蔽

因為在源被用於外觀之前，首先要被過濾。遮蔽可作為一種過濾器。遮蔽用於決定源的哪部分要被顯示，哪部分不可被顯示。遮蔽的不透明部分允許將源複製到外觀，透明部分則不允許將源複製給外觀。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
#include
#include
static gboolean
on_expose_event(GtkWidget *widget,
GdkEventExpose *event,
gpointer data)
{
cairo_t *cr;
cairo_surface_t *surface;
cr = gdk_cairo_create(widget->window);
cairo_set_source_rgb(cr, 0, 0, 0);
surface = cairo_image_surface_create_from_png("omen.png");
cairo_mask_surface(cr, surface, 0, 0);
cairo_fill(cr);
cairo_surface_destroy(surface);
cairo_destroy(cr);
return FALSE;
}
int main(int argc, char *argv[])
{
GtkWidget *window;
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
g_signal_connect(G_OBJECT(window), "expose-event",
G_CALLBACK(on_expose_event), NULL);
g_signal_connect(G_OBJECT(window), "destroy",
G_CALLBACK(gtk_main_quit), NULL);
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
gtk_window_set_default_size(GTK_WINDOW(window), 305, 100);
gtk_window_set_title(GTK_WINDOW(window), "mask");
gtk_widget_set_app_paintable(window, TRUE);
gtk_widget_show_all(window);
gtk_main();
return 0;
}

這個小例子清楚的展示了遮蔽的基本思想。

?
1
2
3
surface = cairo_image_surface_create_from_png("omen.png");
cairo_mask_surface(cr, surface, 0, 0);
cairo_fill(cr);

這裡，是用了一幅圖像作為遮蔽，然後在窗口中顯示它。

張貼者： 於 沒有留言:

「轉貼」Cairo 圖形指南 (11) —— 圖像

在這一篇裡，要講述圖像的處理。先是演示如何在 GTK+ 窗口中顯示一幅圖像，然後再製造一些特效。

圖像的顯示

在第一個例子裡，顯示了一幅圖像。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
#include
#include
cairo_surface_t *image;
static gboolean
on_expose_event(GtkWidget *widget,
GdkEventExpose *event,
gpointer data)
{
cairo_t *cr;
cr = gdk_cairo_create (widget->window);
cairo_set_source_surface(cr, image, 10, 10);
cairo_paint(cr);
cairo_destroy(cr);
return FALSE;
}
int main(int argc, char *argv[])
{
GtkWidget *window;
image = cairo_image_surface_create_from_png("plaveckycastle.png");
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
g_signal_connect(window, "expose-event",
G_CALLBACK (on_expose_event), NULL);
g_signal_connect(window, "destroy",
G_CALLBACK (gtk_main_quit), NULL);
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
gtk_window_set_default_size(GTK_WINDOW(window), 320, 250);
gtk_widget_set_app_paintable(window, TRUE);
gtk_widget_show_all(window);
gtk_main();
cairo_surface_destroy(image);
return 0;
}

這個示例顯示了一幅圖片，其尺寸為 300x225，可從這裡下載。這是斯洛伐克西部一個什麼地方（Plavecke Podhradie）的中世紀城堡的廢墟的一幅照片。

?
1
image = cairo_image_surface_create_from_png("plaveckycastle.png");

用一幅 png 圖片來創建一份圖像外觀。出於效率的考慮，應在主函數中調用這個函數。

?
1
cairo_set_source_surface(cr, image, 10, 10);

基於前面構造的圖像外觀來創建源與外觀，用於圖像的繪製。

?
1
cairo_paint(cr);

繪製圖片。

垂簾效果（Blind Down）

在下面的代碼示例中，要垂簾顯示圖片，就像拉下窗簾的那種效果。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
#include
#include
gboolean timer = TRUE;
cairo_surface_t *image;
static gboolean
on_expose_event(GtkWidget *widget,
GdkEventExpose *event,
gpointer data)
{
cairo_t *cr;
cairo_t *ic;
cairo_surface_t *surface;
static gdouble angle = 0;
static gint image_width = 0;
static gint image_height = 0;
static gint w = 0;
static gint h = 0;
cr = gdk_cairo_create(widget->window);
gint width, height;
gtk_window_get_size(GTK_WINDOW(widget), &width, &height);
image_width = cairo_image_surface_get_width(image);
image_height = cairo_image_surface_get_height(image);
w = image_width;
surface = cairo_image_surface_create(CAIRO_FORMAT_ARGB32, image_width, image_height);
ic = cairo_create(surface);
cairo_rectangle(ic, 0, 0, w, h);
cairo_fill(ic);
h += 1;
if ( h == image_height) timer = FALSE;
cairo_set_source_surface(cr, image, 10, 10);
cairo_mask_surface(cr, surface, 10, 10);
cairo_surface_destroy(surface);
cairo_destroy(cr);
cairo_destroy(ic);
return FALSE;
}
static gboolean
time_handler(GtkWidget *widget)
{
if (widget->window == NULL) return FALSE;
if (!timer) return FALSE;
gtk_widget_queue_draw(widget);
return TRUE;
}
int main(int argc, char *argv[])
{
GtkWidget *window;
image = cairo_image_surface_create_from_png("plaveckycastle.png");
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
g_signal_connect(G_OBJECT(window), "expose-event",
G_CALLBACK(on_expose_event), NULL);
g_signal_connect(G_OBJECT(window), "destroy",
G_CALLBACK(gtk_main_quit), NULL);
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
gtk_window_set_default_size(GTK_WINDOW(window), 325, 250);
gtk_window_set_title(GTK_WINDOW(window), "blind down");
gtk_widget_set_app_paintable(window, TRUE);
g_timeout_add(15, (GSourceFunc) time_handler, (gpointer) window);
gtk_widget_show_all(window);
gtk_main();
cairo_surface_destroy(image);
return 0;
}

這個垂簾效果幕後的思想相當簡單。圖片的高度是 h 個像素，則可對其逐行進行繪製，直至圖片完全顯示。

?
1
2
cairo_t *cr;
cairo_t *ic;

聲明兩個 cairo 環境，一個與 GtkWindow 相關聯，另一個與圖片相關聯。

?
1
2
surface = cairo_image_surface_create(CAIRO_FORMAT_ARGB32, image_width, image_height);
ic = cairo_create(surface);

創建一個圖像外觀，並通過它構造那個與圖像相關聯的 cairo 環境。

?
1
2
cairo_rectangle(ic, 0, 0, w, h);
cairo_fill(ic);

在初始的空圖像中繪製一個矩形，它在循環顯示中會增加 1 個像素的高度。採用這種方式創建的圖像在後面要作為蒙板來用。

?
1
2
h += 1;
if ( h == image_height) timer = FALSE;

整幅圖像繪製完畢後，停止計時器。

?
1
2
cairo_set_source_surface(cr, image, 10, 10);
cairo_mask_surface(cr, surface, 10, 10);

城堡圖像被設置為要被繪製的源，並採用 surface 的 alpha 通道作為蒙板來繪製這個源。

光譜效果

將這種效果稱為光譜效果，因為作者不知道怎麼稱呼才好（我感覺叫百葉窗效果更好）。可能你還記得從前的 ZX 光譜計算機，在這種計算機上載入圖像時，它就逐漸的被顯示出來，下面的示例大致是模仿這種方式。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
#include
#include
gboolean timer = TRUE;
cairo_surface_t *image;
static gboolean
on_expose_event(GtkWidget *widget,
GdkEventExpose *event,
gpointer data)
{
cairo_t *cr;
cairo_t *ic;
cairo_surface_t *surface;
static gdouble angle = 0;
static gint w = 0;
static gint h = 0;
static gint image_width = 0;
static gint image_height = 0;
static gint count = 0;
cr = gdk_cairo_create(widget->window);
gint width, height;
gtk_window_get_size(GTK_WINDOW(widget), &width, &height);
surface = cairo_image_surface_create(CAIRO_FORMAT_ARGB32, image_width, image_height);
image_width = cairo_image_surface_get_width(image);
image_height = cairo_image_surface_get_height(image);
w = image_width;
ic = cairo_create(surface);
gint i, j;
for (i = 0; i <= image_height; i+=7) {
for (j=0 ; j <>
cairo_move_to(ic, 0, i+j);
cairo_line_to(ic, w, i+j);
}
}
count++;
if ( count == 8) timer = FALSE;
cairo_stroke(ic);
cairo_set_source_surface(cr, image, 10, 10);
cairo_mask_surface(cr, surface, 10, 10);
cairo_surface_destroy(surface);
cairo_destroy(cr);
cairo_destroy(ic);
return FALSE;
}
static gboolean
time_handler (GtkWidget *widget)
{
if (widget->window == NULL) return FALSE;
if (!timer) return FALSE;
gtk_widget_queue_draw(widget);
return TRUE;
}
int main(int argc, char *argv[])
{
GtkWidget *window;
image = cairo_image_surface_create_from_png("plaveckycastle.png");
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
g_signal_connect(G_OBJECT(window), "expose-event",
G_CALLBACK(on_expose_event), NULL);
g_signal_connect(G_OBJECT(window), "destroy",
G_CALLBACK(gtk_main_quit), NULL);
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
gtk_window_set_default_size(GTK_WINDOW(window), 325, 250);
gtk_widget_set_app_paintable(window, TRUE);
g_timeout_add(400, (GSourceFunc) time_handler, (gpointer) window);
gtk_widget_show_all(window);
gtk_main();
cairo_surface_destroy(image);
return 0;
}

這個示例的許多細節與上一個示例相似。這次，是將圖像分為每 8 行為一個區域。在每次循環中，8 個部分中每個區域增加一個像素高度。通過這種方式創建的圖像將再一次作為模板來顯示城堡圖像。

?
1
2
3
4
5
6
7
gint i, j;
for (i = 0; i <= image_height; i+=7) {
for (j=0 ; j <>
cairo_move_to(ic, 0, i+j);
cairo_line_to(ic, w, i+j);
}
}

這是該示例的主要邏輯，我們逐漸的將線繪製到各區域。




張貼者： 於 沒有留言:

「轉貼」Cairo 圖形指南 (10) —— 合成

合成 (Compositing) 可以將一些單獨的源 (source) 所生成可視元素組合成到單幅圖像中去，主要用於創建所有的可視元素作為同一場景的一部分這樣一種假象。合成在電影工業中被廣為使用，用於創建人群、不尋常 的世界等畫面，因為這樣的畫面在現實中的製作代價非常昂貴甚至難以實現。

Cairo 圖形庫提供了 14 種不同的合成操作。

#include
#include

static void
draw (cairo_t * cr, gint x, gint w, gint h, cairo_operator_t op)
{

cairo_t *first_cr, *second_cr;
cairo_surface_t *first, *second;

first = cairo_surface_create_similar (cairo_get_target (cr),
CAIRO_CONTENT_COLOR_ALPHA,
w, h);

second = cairo_surface_create_similar (cairo_get_target (cr),
CAIRO_CONTENT_COLOR_ALPHA,
w, h);

first_cr = cairo_create (first);
cairo_set_source_rgb (first_cr, 0, 0, 0.4);
cairo_rectangle (first_cr, x, 20, 50, 50);
cairo_fill (first_cr);

second_cr = cairo_create (second);
cairo_set_source_rgb (second_cr, 0.5, 0.5, 0);
cairo_rectangle (second_cr, x + 10, 40, 50, 50);
cairo_fill (second_cr);

cairo_set_operator (first_cr, op);
cairo_set_source_surface (first_cr, second, 0, 0);
cairo_paint (first_cr);

cairo_set_source_surface (cr, first, 0, 0);
cairo_paint (cr);

cairo_surface_destroy (first);
cairo_surface_destroy (second);

cairo_destroy (first_cr);
cairo_destroy (second_cr);
}

static gboolean
on_expose_event (GtkWidget * widget,
GdkEventExpose * event, gpointer data)
{
cairo_t *cr;
gint w, h;
gint x, y;

cairo_operator_t oper[] = {
CAIRO_OPERATOR_DEST_OVER,
CAIRO_OPERATOR_DEST_IN,
CAIRO_OPERATOR_OUT,
CAIRO_OPERATOR_ADD,
CAIRO_OPERATOR_ATOP,
CAIRO_OPERATOR_DEST_ATOP,
};

gtk_window_get_size (GTK_WINDOW (widget), &w, &h);

cr = gdk_cairo_create (widget->window);

gint i;
for (x = 20, y = 20, i = 0; i < 6; x += 80, i++) {
draw (cr, x, w, h, oper[i]);
}

cairo_destroy (cr);

return FALSE;
}

int
main (int argc, char *argv[])
{
GtkWidget *window;

gtk_init (&argc, &argv);

window = gtk_window_new (GTK_WINDOW_TOPLEVEL);

g_signal_connect (window, "expose-event",
G_CALLBACK (on_expose_event), NULL);
g_signal_connect (window, "destroy",
G_CALLBACK (gtk_main_quit), NULL);

gtk_window_set_position (GTK_WINDOW (window),
GTK_WIN_POS_CENTER);
gtk_window_set_default_size (GTK_WINDOW (window), 510, 120);
gtk_widget_set_app_paintable (window, TRUE);

gtk_widget_show_all (window);

gtk_main ();

return 0;
}

示例程序中，顯示了兩個正方形的 6 種合成效果。

first = cairo_surface_create_similar (cairo_get_target (cr),
CAIRO_CONTENT_COLOR_ALPHA,
w, h);

second = cairo_surface_create_similar (cairo_get_target (cr),
CAIRO_CONTENT_COLOR_ALPHA,
w, h);

先創建兩個外觀 (surface)。

first_cr = cairo_create (first);
cairo_set_source_rgb (first_cr, 0, 0, 0.4);
cairo_rectangle (first_cr, x, 20, 50, 50);
cairo_fill (first_cr);

對第一個外觀生成的一個 cairo 環境，並在其中創建一個矩形。

cairo_set_operator (first_cr, op);
cairo_set_source_surface (first_cr, second, 0, 0);
cairo_paint (first_cr);

cairo_set_operator () 函數設置 first_cr 所容許的合成操作。cairo_set_source_surface () 函數基於 second 外觀創建圖案，並將其作為 first_cr 環境中的源。調用 cairo_paint () 函數顯示最終合成結果（也就是輸出到 cr 環境）。

cairo_set_source_surface (cr, first, 0, 0);
cairo_paint (cr);

最後，在 GTK+ 窗口上顯示結果。

cairo_operator_t oper[] = {
CAIRO_OPERATOR_DEST_OVER,
CAIRO_OPERATOR_DEST_IN,
CAIRO_OPERATOR_OUT,
CAIRO_OPERATOR_ADD,
CAIRO_OPERATOR_ATOP,
CAIRO_OPERATOR_DEST_ATOP,
};

這就是傳說中的那 6 種合成操作。

張貼者： 於 沒有留言:
訂閱： 文章 (Atom)