用開羅圖形繪製多個矩形

我想寫一個開羅程序來黑色填充整個圖像，然後在裏面繪製另一個矩形的另一種顏色。最終，我將使這個程序生成當前時間的.png，看起來像數字時鐘。現在，這是我掛斷的地方。用開羅圖形繪製多個矩形

這裏是我的代碼：

#include <stdio.h> 
#include <cairo.h> 

//on color: 0.6, 1.0, 0 
//off color: 0.2, 0.4, 0 

int prop_number_width; 
int prop_number_height; 

int prop_width; 
int prop_height; 
int prop_space_width; 
int prop_space_height; 

double width; 
double height; 

double w_unit; 
double h_unit; 

void draw_number(cairo_t* cr, int unit_width, int num); 

int main(int argc, char** argv) { 
    /* proportional sizes: 
    * the widths and heights of the diagram 
    */ 
    prop_number_width = 5; //how many spaces the number takes up 
    prop_number_height = 6; 

    prop_space_width = 1; //extra width on each side 
    prop_space_height = 1; //extra height on each side 
    prop_width = 25 + (2 * prop_space_width); //width of diagram 
    prop_height = 6 + (2 * prop_space_height); //height of diagram 

    /* actual sizes: 
    * the pixel value of different sizes 
    */ 
    width = 200.0; 
    height = 100.0; 

    w_unit = width/prop_width; 
    h_unit = height/prop_height; 

    //begin cairo stuff 
    cairo_surface_t* surface = cairo_image_surface_create(CAIRO_FORMAT_ARGB32, (int)width, (int)height); 
    cairo_t* cr = cairo_create(surface); 

    //black fill 
    cairo_set_source_rgb(cr, 0.0, 0.0, 0.0); 
    cairo_rectangle(cr, 0.0, 0.0, width, height); //cr ref, x, y, width, height 
    cairo_fill_preserve(cr); 

    //draw numbers from left to right 
    draw_number(cr, 0, 1); 
    //draw_number(cr, 6, 3); 
    //draw_number(cr, 14, 3); 
    //draw_number(cr, 20, 7); 

    //draw in colons 

    cairo_destroy(cr); 
    cairo_surface_write_to_png(surface, "test.png"); 
    cairo_surface_destroy(surface); 
    return 0; 
} 

void draw_number(cairo_t* cr, int unit_width, int num) { 
    //determine the box size that the number will be drawn in 
    double box_x = w_unit * (prop_space_width + unit_width); 
    double box_y = h_unit * prop_space_height; 
    double box_width = w_unit * prop_number_width; 
    double box_height = h_unit * prop_number_height; 

    printf("{box_x: %lf box_y: %lf} {box_width: %lf box_height: %lf}\n", box_x, box_y, box_width, box_height); 
    cairo_set_source_rgb(cr, 0.2, 0.4, 0); 
    cairo_rectangle(cr, box_x, box_y, box_width, box_height); 
    cairo_fill_preserve(cr); 
}

問題是與此代碼它繪製矩形以佔據整個圖像，其中從printf的的它應該只佔用一小部分。有人知道如何讓這個矩形顯示爲正確的大小嗎？

來源

2010-08-01 SummerCodin