绘图区控件和绘图

现在,我们开始向屏幕绘图。

我们使用的构件是绘图区控件。一个绘图区控件本质上是一个 X 窗口,没有其它的东西。它是一个空白的画布,我们可以在其上绘制需要的东西。

创建一个绘图区:

GtkWidget*    gtk_drawing_area_new    (void);

用如下函数设置控件的默认大小:

void    gtk_drawing_area_size    (GtkDrawingArea    *darea,
                                gint    width,
                                gint    height);

当调用函数gtk_widget_set_size_request() 或 用户手动调整包含绘图区的窗口的大小时,默认大小可以无效,这对所有的控件都是一样的。

当我们创建绘图区控件时应该注意:我们完全负责绘制其上的内容。如果我们的窗口被遮住后暴露出来,我们得到一个暴露事件,我们必须重绘先前被遮住的部分。

为了能正确的重绘,我们必须记住绘制在屏幕上的内容。另外,这显然很麻烦,如果窗口的一部分被清除了,我们需一步步的重绘。解决的办法是使用一个后端位图 。我们用向图像中绘制来代替直接向屏幕绘制,当图像改变或图像的一部分需要显示,我们复制相应的部分到屏幕上。

创建后端位图:

用如下函数创建后端位图:

GdkPixmap* gdk_pixmap_new (GdkWindow  *window,
                     gint    width,
                     gint    height,
                     gint    depth);

参数:

  • window
    该参数设置一个 GDK 窗口,位图继承该窗口的所有属性。
  • width 和height
    设置位图的大小。
  • depth
    设置颜色深度 ,那是每个像素的二进制位数,如果 depth 设为-1 ,它会自动匹配窗口的颜色深度。

技巧:
创建pixmap时,应该使pixmap的色深与它要绘制到的目标窗口的色深相同。
如果在其drawable参数中指定一个窗口,则色深将与指定窗口的色深相同,此时应该将depth参数设置为-1。
如果drawable参数为NULL,则必须在其depth参数中指定色深。

我们在事件”configure_event”的处理函数中创建位图。这个事件会在我们改变窗口大小时产生,包括窗口创建时。

/* 绘制区的后端位图 */
static GdkPixmap *pixmap = NULL;

/* 创建一个适当大小的后端位图 */
static gint    configure_event (GtkWidget *widget, GdkEventConfigure *event)
{
    if (pixmap)
        gdk_pixmap_unref(pixmap);

    pixmap = gdk_pixmap_new(widget->window,
            widget->allocation.width,
            widget->allocation.height,
            -1);

    gdk_draw_rectangle (pixmap,
                        widget->style->white_gc,
                        TRUE,
                        0, 0,
                        widget->allocation.width,
                        widget->allocation.height);

    return TRUE;
}

调用函数gdk_draw_rectangle() 清除位图,并初始化为白色。后面我们会详细讲解。

expose_event 暴露事件

暴漏事件,也常称作:曝光事件。

我们的暴露事件处理函数只是简单复制相应部分的位图到屏幕上(用暴露事件的event->area来确定重绘区域):

/* 从后端位图重新绘制屏幕 */
static gint expose_event (GtkWidget *widget, GdkEventExpose *event)
{
  gdk_draw_pixmap(widget->window,
        widget->style->fg_gc[GTK_WIDGET_STATE (widget)],
        pixmap,
        event->area.x, event->area.y,
        event->area.x, event->area.y,
        event->area.width, event->area.height);

  return FALSE;
}

更多绘图曝光事件,也可以参考下面链接的前半部分:
https://www.softool.cn/read/gtk_series_of_tutorials/33.html

其它绘图函数

现在我们来看如何保持屏幕跟随位图的更新,如何在位图上绘制我们需要的东西? GTK 的GDK库中有许多函数用于在可绘区域绘图。可绘区域可以是窗口、位图或黑白图。在上面我们已经见到了两个,gdk_draw_rectangle() 和gdk_draw_pixmap() 。
这些函数的完全列表如下:

gdk_draw_line ()

gdk_draw_rectangle ()

gdk_draw_arc ()

gdk_draw_polygon ()

gdk_draw_string ()

gdk_draw_text ()

gdk_draw_pixmap ()

gdk_draw_bitmap ()

gdk_draw_image ()

gdk_draw_points ()

gdk_draw_segments ()

详见参考文档或头文件<gdk/gdk.h> 。这些函数的头两个参数都相同。第一个参数是可绘区域。第二个参数是图像关联 (GC)。

一个图像关联封装一些信息,如前景色、背景色和线宽。GDK有一组函数用于创建和修改图像关联,但为了方便,我们仅使用预定义的图像关联。每个控件有一个相关联的风格。(可以在 gtkrc 文件中修改,详见 GTK 的 rc 文件)其中,存储了许多图像关联。一些访问这些图像关联的示例如下:

widget->style->white_gc

widget->style->black_gc

widget->style->fg_gc[GTK_STATE_NORMAL]

widget->style->bg_gc[GTK_WIDGET_STATE(widget)]

域值fg_gc 、bg_gc 、dark_gc 和light_gc 索引取值靠一个GtkStateType 类型的参数,该类型可以取如下值:

GTK_STATE_NORMAL,

GTK_STATE_ACTIVE,

GTK_STATE_PRELIGHT,

GTK_STATE_SELECTED,

GTK_STATE_INSENSITIVE

例如,GTK_STATE_SELECTED 默认的前景色是白色,默认的背景色是暗蓝色。

我们的函数draw_brush() 做实际的屏幕绘制工作。函数如下:

/* 在屏幕上绘制一个矩形 */
static void draw_brush (GtkWidget *widget, gdouble x, gdouble y)
{
    GdkRectangle update_rect;
    update_rect.x = x - 5;

    update_rect.y = y - 5;

    update_rect.width = 10;

    update_rect.height = 10;

    gdk_draw_rectangle (pixmap,

    widget->style->black_gc,

    TRUE,

    update_rect.x, update_rect.y,

    update_rect.width, update_rect.height);

    gtk_widget_draw (widget, &update_rect);

}

在位图上绘制了矩形之后,我们调用如下函数:

void    gtk_widget_draw    (GtkWidget    *widget,
                            GdkRectangle    *area);

它会通知X参数area 给定的区域需要更新。 X 会最终会产生一个暴露事件(混合区域需要多次调用函数gtk_widget_draw() ),然后会调用暴露事件处理函数,复制相应的部分到屏幕上。

现在我们已经有了一个较完整的绘图程序,只差主窗口部分了。