教程六

编译参考教程二

描绘 (Stroke) 与填充 (Fill)

描绘 (Stroke) 可以绘制形状的轮廓，填充 (Fill) 则用于向形状内部灌注颜色。 

#include<math.h>
#include <cairo.h>
#include <gtk/gtk.h>

static gboolean
on_expose_event ( GtkWidget* widget,
                 GdkEventExpose *event, gpointer data)
{
        cairo_t *cr;

        cr = gdk_cairo_create ( widget->window) ;

        int width, height;
        gtk_window_get_size ( GTK_WINDOW ( widget) , &width, &height) ;
        cairo_set_line_width ( cr, 9) ;

        cairo_set_source_rgb ( cr, 0.69 , 0.19 , 0) ;
        cairo_arc ( cr, width / 2 , height / 2 ,
                   ( width < height ? width : height) / 2 - 10 , 0 ,
                   2 * M_PI) ;
        cairo_stroke_preserve ( cr) ;

        cairo_set_source_rgb ( cr, 0.3 , 0.4 , 0.6) ;
        cairo_fill ( cr) ;

        cairo_destroy ( cr) ;

        returnFALSE ;
}

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) , 200 , 150) ;

        gtk_widget_set_app_paintable ( window, TRUE) ;
        gtk_widget_show_all ( window) ;

        gtk_main () ;

        return0 ;
}

这个示例绘制一个内部填充灰色的圆。

下面对代码进行解析：

---

#include<math.h>

之所以引入这个头文件，是因为程序中使用了圆周率常量M_PI。

---

       int width,height;
        gtk_window_get_size ( GTK_WINDOW ( widget) , &width, &height) ;

获取窗口的宽度与高度尺寸。程序中将使用这些值作为绘制圆形的参考尺寸，以实现窗口尺寸变化时，所绘制的圆的尺寸也会相应变化。

---

       cairo_set_source_rgb ( cr, 0.69 , 0.19 , 0) ;
        cairo_arc ( cr, width / 2 , height / 2 ,
                   ( width < height ? width : height) / 2 - 10 , 0 ,
                   2 * M_PI) ;
        cairo_stroke_preserve ( cr) ;

描绘圆的轮廓。这里要注意一下 cairo_stroke_preserve() 函数与 cairo_stroke () 函数的区别（最好的办法是用后者替换一下前者，看看程序执行效果）。cairo_stroke_preserve () 函数会将它绘制的路径依然保存在 cairo 环境中，而 cairo_stroke () 所绘制的路径，在绘制完成后，就从 cairo的环境中清除了。

---

       cairo_set_source_rgb ( cr, 0.3 , 0.4 , 0.6) ;
        cairo_fill ( cr) ;

对使用cairo_stroke_preserve () 函数绘制的路径进行蓝色填充。