Draw on top of a window

[Richard Kung <richardkung linpus com>]

Hi,

I want to use cairo to draw on top of a window but don't know how to achieve it.
Below is my code.
bottom_image is always on top of top_image.
Any suggestion for beginners is welcome.

Richard

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

cairo_surface_t *top_image;
GtkWidget *bottom_image;

static gboolean on_expose_event(GtkWidget *widget, GdkEventExpose *event, gpointer data)
{
  cairo_t *cr;
  cr = gdk_cairo_create(widget->window);
  cairo_set_source_surface(cr, top_image, 0, 0);
  cairo_paint(cr);
  cairo_destroy(cr);

  return FALSE;
}

int main(int argc, char *argv[])
{
  GtkWidget *window;

  gtk_init(&argc, &argv);
  window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
  top_image = cairo_image_surface_create_from_png("top.png");
  bottom_image  = gtk_image_new_from_file("bottom.png");
  gtk_container_add(GTK_CONTAINER(window), bottom_image);

  g_signal_connect(window, "expose-event", G_CALLBACK (on_expose_event), NULL);
  g_signal_connect(window, "destroy", G_CALLBACK (gtk_main_quit), NULL);
  gtk_widget_set_app_paintable(window, TRUE);
  gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
  gtk_window_set_default_size(GTK_WINDOW(window), 200, 200);
  gtk_widget_show_all(window);
  gtk_main();

  cairo_surface_destroy(top_image);
  return 0;
}