# Cairo 后端 > 原文： [https://zetcode.com/gfx/cairo/cairobackends/](https://zetcode.com/gfx/cairo/cairobackends/) Cairo 庫支持各種后端。 在 Cairo 圖形教程的這一部分中，我們將使用 Cairo 創建 PNG 圖像，PDF 文件，SVG 文件，并在 GTK 窗口上繪制。 ## PNG 圖像 在第一個示例中，我們將創建一個 PNG 圖像。 ```c #include <cairo.h> int main(void) { cairo_surface_t *surface; cairo_t *cr; surface = cairo_image_surface_create(CAIRO_FORMAT_ARGB32, 390, 60); cr = cairo_create(surface); cairo_set_source_rgb(cr, 0, 0, 0); cairo_select_font_face(cr, "Sans", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_NORMAL); cairo_set_font_size(cr, 40.0); cairo_move_to(cr, 10.0, 50.0); cairo_show_text(cr, "Disziplin ist Macht."); cairo_surface_write_to_png(surface, "image.png"); cairo_destroy(cr); cairo_surface_destroy(surface); return 0; } ``` 本示例是一個小型控制臺應用，它將創建一個 PNG 圖像。 ```c #include <cairo.h> ``` 在此頭文件中，我們將找到函數和常量的聲明。 ```c cairo_surface_t *surface; cairo_t *cr; ``` 在這里，我們聲明一個表面和一個 Cairo 上下文。 ```c surface = cairo_image_surface_create(CAIRO_FORMAT_ARGB32, 390, 60); cr = cairo_create(surface); ``` 我們創建一個表面和一個 Cairo 上下文。 表面是 390x60 像素的圖像。 ```c cairo_set_source_rgb(cr, 0, 0, 0); ``` 我們將用黑色墨水繪制。 ```c cairo_select_font_face(cr, "Sans", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_NORMAL); cairo_set_font_size(cr, 40.0); ``` 我們選擇一種字體類型并設置其大小。 ```c cairo_move_to(cr, 10.0, 50.0); cairo_show_text(cr, "Disziplin ist Macht."); ``` 我們移到圖像內的（10.0，50.0）位置并繪制文本。 ```c cairo_surface_write_to_png(surface, "image.png"); ``` 此函數調用將創建 PNG 圖像。 ```c cairo_destroy(cr); cairo_surface_destroy(surface); ``` 最后，我們清理資源。 ## PDF 文件 在第二個示例中，我們將使用 Cairo 庫創建一個簡單的 PDF 文件。 ```c #include <cairo.h> #include <cairo-pdf.h> int main(void) { cairo_surface_t *surface; cairo_t *cr; surface = cairo_pdf_surface_create("pdffile.pdf", 504, 648); cr = cairo_create(surface); cairo_set_source_rgb(cr, 0, 0, 0); cairo_select_font_face (cr, "Sans", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_NORMAL); cairo_set_font_size (cr, 40.0); cairo_move_to(cr, 10.0, 50.0); cairo_show_text(cr, "Disziplin ist Macht."); cairo_show_page(cr); cairo_surface_destroy(surface); cairo_destroy(cr); return 0; } ``` 我們必須在 PDF 查看器中打開 PDF 文件。 Linux 用戶可以使用 KPDF 或 Evince 查看器。 ```c surface = cairo_pdf_surface_create("pdffile.pdf", 504, 648); ``` 要渲染 PDF 文件，我們必須使用`cairo_pdf_surface_create()`函數調用來創建 PDF 曲面。 PDF 文件的大小以磅為單位指定，這是排版的標準。 ```c cairo_show_page(cr); ``` `cairo_show_page()`完成 PDF 文件的渲染。  圖：Evince 中的 PDF 文件 ## SVG 文件 下一個示例創建一個簡單的 SVG（可縮放矢量圖形）文件。 SVG 是當今最熱門的技術之一。 ```c #include <cairo.h> #include <cairo-svg.h> int main(void) { cairo_surface_t *surface; cairo_t *cr; surface = cairo_svg_surface_create("svgfile.svg", 390, 60); cr = cairo_create(surface); cairo_set_source_rgb(cr, 0, 0, 0); cairo_select_font_face(cr, "Sans", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_NORMAL); cairo_set_font_size(cr, 40.0); cairo_move_to(cr, 10.0, 50.0); cairo_show_text(cr, "Disziplin ist Macht."); cairo_surface_destroy(surface); cairo_destroy(cr); return 0; } ``` 我們可以使用 Firefox，Opera 或 Inkscape 程序打開`svgfile.svg`文件。 ```c surface = cairo_svg_surface_create("svgfile.svg", 390, 60); ``` 要在 Cairo 創建 SVG 文件，我們必須使用`cairo_svg_surface_create()`函數調用來創建 svg 曲面。 ```c cr = cairo_create(surface); ``` Cairo 上下文是從 SVG 曲面創建的。 其余代碼與前面的示例相同。  SVG file in Chrome ## GTK 窗口 在最后一個示例中，我們將在 GTK 窗口上繪制。 該后端將在本教程的其余部分中使用。 ```c #include <cairo.h> #include <gtk/gtk.h> static void do_drawing(cairo_t *); static gboolean on_draw_event(GtkWidget *widget, cairo_t *cr, gpointer user_data) { do_drawing(cr); return FALSE; } static void do_drawing(cairo_t *cr) { cairo_set_source_rgb(cr, 0, 0, 0); cairo_select_font_face(cr, "Sans", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_NORMAL); cairo_set_font_size(cr, 40.0); cairo_move_to(cr, 10.0, 50.0); cairo_show_text(cr, "Disziplin ist Macht."); } int main(int argc, char *argv[]) { GtkWidget *window; GtkWidget *darea; gtk_init(&argc, &argv); window = gtk_window_new(GTK_WINDOW_TOPLEVEL); darea = gtk_drawing_area_new(); gtk_container_add(GTK_CONTAINER(window), darea); g_signal_connect(G_OBJECT(darea), "draw", G_CALLBACK(on_draw_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), 400, 90); gtk_window_set_title(GTK_WINDOW(window), "GTK window"); gtk_widget_show_all(window); gtk_main(); return 0; } ``` 該示例彈出一個居中的 GTK 窗口，在該窗口上繪制`"Disziplin ist Macht"`文本。 ```c #include <cairo.h> #include <gtk/gtk.h> ``` 我們包括必要的 Cairo 和 GTK 標頭。 ```c static gboolean on_draw_event(GtkWidget *widget, cairo_t *cr, gpointer user_data) { do_drawing(cr); return FALSE; } ``` 我們將實際圖形委托給`do_drawing()`函數。 發送的參數是 Cairo 上下文。 ```c static void do_drawing(cairo_t *cr) { cairo_set_source_rgb(cr, 0, 0, 0); cairo_select_font_face(cr, "Sans", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_NORMAL); cairo_set_font_size(cr, 40.0); cairo_move_to(cr, 10.0, 50.0); cairo_show_text(cr, "Disziplin ist Macht."); } ``` Cairo 功能執行繪圖。 ```c darea = gtk_drawing_area_new(); gtk_container_add(GTK_CONTAINER(window), darea); ``` 我們創建一個`GtkDrawingArea`小部件，并將其添加到容器窗口。 用于自定義繪圖。 ```c g_signal_connect(G_OBJECT(darea), "draw", G_CALLBACK(on_draw_event), NULL); ``` 當需要重新繪制`GtkDrawingArea`小部件時，它將發出`draw`信號。 我們將該信號連接到`on_draw_event()`回調。  圖：GTK 窗口 在本章中，我們介紹了受支持的 Cairo 后端。