用Cairo图形绘制多个矩形

我正试图编写一个Cairo程序，以黑色填充整个图像，然后在其中绘制另一个不同颜色的矩形。最后，我要让这个程序生成一个.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);
}

#包括
#包括
//颜色：0.6、1.0、0
//色差：0.2,0.4,0
int prop_number_width；
int道具编号和高度；
int prop_宽度；
int prop_高度；
int prop_space_width；
int prop_space_height；
双倍宽度；
双高；
双w_单元；
双h_装置；
无效图纸编号（cairo\u t*cr，整数单位宽度，整数数量）；
int main（int argc，字符**argv）{
/*比例尺寸：
*图表的宽度和高度
*/
prop_number_width=5；//该数字占用多少空格
道具编号和高度=6；
prop_space_width=1；//每侧额外宽度
prop_space_height=1；//每侧额外高度
prop_width=25+（2*prop_space_width）；//图表的宽度
道具高度=6+（2*道具空间高度）；//图表高度
/*实际尺寸：
*不同大小的像素值
*/
宽度=200.0；
高度=100.0；
w_单位=宽度/道具宽度；
h_单位=高度/支柱高度；
//从开罗开始
cairo\u surface\u t*surface=cairo\u image\u surface\u create（cairo\u格式\u ARGB32，（int）宽度，（int）高度）；
cairo_t*cr=cairo_创建（曲面）；
//黑色填料
cairo_set_source_rgb（cr，0.0,0.0,0.0）；
cairo_矩形（cr，0.0，0.0，宽度，高度）；//cr-ref，x，y，宽度，高度
开罗填充保护区（cr）；
//从左到右画数字
图纸编号（cr，0，1）；
//图纸编号（cr、6、3）；
//图纸编号（cr、14、3）；
//图纸编号（cr、20、7）；
//缩进冒号
开罗大学（cr）；
cairo_surface_write_to_png（surface，“test.png”）；
开罗·表面·破坏（表面）；
返回0；
}
无效绘图编号（cairo\u t*cr，整数单位宽度，整数数量）{
//确定将绘制数字的框大小
双盒x=w_单位*（道具空间宽度+单位宽度）；
双箱y=h_单位*道具空间高度；
双框宽度=w\U单位*道具编号\U宽度；
双箱高度=h\U装置*道具编号\U高度；
printf（“{box\u x:%lf box\u y:%lf}{box\u宽度：%lf box\u高度：%lf}\n”，box\u x，box\u y，box\u宽度，box\u高度）；
cairo_set_source_rgb（cr，0.2,0.4,0）；
cairo_矩形（cr、长方体x、长方体y、长方体宽度、长方体高度）；
开罗填充保护区（cr）；
}

---

问题在于，这段代码绘制的矩形占据了整个图像，而从printf的角度来看，它应该只占据一小部分。有人知道如何使这个矩形显示为正确的大小吗？

我应该更仔细地查看API。我需要做

cairo\u fill（）

而不是

cairo\u fill\u preserve（）

。显然，对cairo\u fill\u preserve（）的第一个调用是保留原始矩形并始终填充该矩形