gEvas: the GTK+2 to Evas Bridge

Learn about some of the Enlightenment Foundation Libraries and how to use them with gEvas for high performance in your next GTK+2 application.

At its core, gEvas provides five things: it tells Evas when to repaint itself, assists in gluing Evas events and glib2 signals together, handles Edje timer calls to support animation, helps Evas play nice with GTK+2 widgets and codes to assist in Evas usage. Because Evas also is being targeted at embedded systems, some handy code is left out of the core Evas to make it lean. Because gEvas is desktop-targeted, it adds some handy functionality for desktop applications.

The following code creates a gEvas canvas inside a scrollable area and attaches it to a GTK+2 window. As not every scrollable gEvas will want to allow the middle button to drag the canvas position—as in The GIMP—you have to set this up outside of gevas_new_gtkscrolledwindow():

GtkWidget* window = 0;
GtkWidget* scw    = 0;
GtkWidget* gevas  = 0;

window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
   (GtkgEvas**)(&gevas), &scw );
gtk_container_add(GTK_CONTAINER(window), scw);


gevas_set_middleb_scrolls(GTK_GEVAS(gevas), 1,

The gEvas API for creating objects takes a leaf from standard GTK+ coding, having some methods attached to a general GtkgEvasObj class. Other special classes, such as GtkgEvasImage, are derived from GtkgEvasObj. Unfortunately, this also brings the usual cast-heavy style of ANSI C GTK+ programming.

The following creates an image showing your PNG file at its original width and height. We then move the image and raise its layer in the canvas:

GtkgEvasImage* gi;
GtkgEvasObj* go;

gi = gevasimage_new_from_metadata(
        GTK_GEVAS(gevas), "/my/path/foo.png" );
go = GTK_GEVASOBJ( gi );

int x = 100, y = 50;
gevasobj_move(      go, x, y );
gevasobj_set_layer( go, 1 );

I created a simple client showing how to connect Evas events from the canvas to some GTK+2 widgets outside the gEvas widget. Look in the demo directory of the gEvas package for signalconnect.c. For a more-advanced example, take a look at the testgevas client for the use of both raw Evas callbacks and Evas-triggered callbacks that are marshaled to glib signals. Signalconnect is shown in Figure 3.

Figure 3. Connecting Evas and GTK+ signals. The dinosaur image can be dragged around either directly or by moving the slider bar.

Connecting to Evas events is handled by way of the GtkgEvasEvHClass subclasses. The below fragment causes evh to marshal Evas' mouse up/down events into glib signals, which then are connected to reporting functions. Also, when the user moves the raptor image, raptor_moved() is called by way of a glib2 signal to update various GTK+2 widgets with the current coordinates of the image:

static gint raptor_moved(
    GtkgEvasObj* o,
    Evas_Coord* x, Evas_Coord* y,
	gpointer user_data )
 gtk_progress_bar_set_fraction( x_coord_tracker,
      (1.0 * (*x)) / CANVAS_WIDTH );
      GTK_RANGE(y_coord_tracker), *y );


static gboolean
gtk_mouse_down_cb(GtkObject * object,
 GtkObject * gevasobj, gint _b, gint _x, gint _y,
 gpointer data)
 char buffer[1024];
 snprintf(buffer,1000,"mouse_down b:%d x:%d y:%d",
          _b, _x, _y);
 gtk_label_set_text( e_logo_label, buffer );
 return FALSE;

gi = gevasimage_new();
go = GTK_GEVASOBJ( gi );
gevasimage_set_image_name( gi, "raptor.png" );

/** Let the user drag the raptor around **/
GtkObject *evh = gevasevh_drag_new();
gevasobj_add_evhandler( GTK_GEVASOBJ( gi ), evh );

gtk_signal_connect( go, "move_absolute",
   GTK_SIGNAL_FUNC( raptor_moved ), go );

gi = gevasimage_new();
go = GTK_GEVASOBJ( gi );
gevasimage_set_image_name( gi, "e_logo.png" );

evh = gevasevh_to_gtk_signal_new();
gevasobj_add_evhandler( GTK_GEVASOBJ( gi ), evh );

gtk_signal_connect(GTK_OBJECT(evh), "mouse_down",
  GTK_SIGNAL_FUNC(gtk_mouse_down_cb), NULL);
gtk_signal_connect(GTK_OBJECT(evh), "mouse_up",
  GTK_SIGNAL_FUNC(gtk_mouse_up_cb), NULL);

The following are some more functional event handlers that can be attached:

/* Standard GTK+ popup menu creation + handling */
static gboolean
gtk_popup_activate_cb(GtkObject * object,
   GtkObject * gevasobj, gint _b, gint _x, gint _y,
   gpointer data)
 static GtkMenu *menu = 0;

GtkgEvasObj* go  = ...;
GtkObject*   evh = 0;

/* Make the object throb when mouse is over it */
GtkgEvasEvHThrob* evht = gevasevh_throb_new( go );

/* Allow the user to drag the object around  */
evh = gevasevh_drag_new();
gevasobj_add_evhandler( go, evh );

/* Make a popup menu appear on right mouse click */
evh = gevasevh_popup_new();
gevasobj_add_evhandler( go, evh );

   GTK_SIGNAL_FUNC(gtk_popup_activate_cb), NULL);

Handling a selection in the canvas is a little trickier than the above event handlers. This is so because more than one object is involved in the selection process. You create a selector event handler object of class GtkgEvasEvHGroupSelector that attaches to the object you want as the background unselectable object. You can think of this object as where the rubber-band rectangle is drawn to indicate which objects should become selected. The rubber band always is drawn at a higher layer than the selectable objects. Each selectable object on the canvas then has a GtkgEvasEvHSelectable object attached to it that communicates with the GtkgEvasEvHGroupSelector object:

GtkWidget*     gevas = ...;
GtkObject*     evh_selector = 0;
GtkgEvasImage* gevas_image;

gevas_image = gevasimage_new();
gevasobj_set_gevas(gevas_image, gevas);

/* Make this a group_selector */
evh_selector = gevasevh_group_selector_new();

GtkgEvasObj* go  = ...;
make_selectable( gevas, go, evh_selector );


/* lets make this object also selectable */
void make_selectable( GtkgEvasObj* object,
                      GtkObject* evhsel )
 GtkgEvasObj* ct  = 0;
 GtkObject* evh = gevasevh_selectable_new( evhsel );

 gevasobj_add_evhandler(object, evh);
    GTK_GEVASEVH_SELECTABLE(evh),  object);

 ct = (GtkgEvasObj*)gevasgrad_new(
     gevasobj_get_gevas( GTK_OBJECT(object)));

 gevasobj_set_color( ct, 255, 200, 255, 200);

 gevasgrad_add_color(ct, 120, 150, 170, 45, 8);
 gevasgrad_add_color(ct, 200, 170, 90, 150, 16);

 gevasgrad_set_angle(ct, 150);
 gevasobj_resize( ct, 200,100);
 gevasobj_set_layer(ct, 9999);


You then can easily test if objects are selected or get a collection object to perform operations on all objects selected:

GtkgEvasEvHGroupSelector* ev = ...;
GtkgEvasEvHSelectable*    o  = ...;
GtkgEvasObjCollection*    col = 0;

gboolean yn = gevasevh_group_selector_isinsel(ev,o);
col = gevasevh_group_selector_get_collection( ev );
gevas_obj_collection_move_relative( col, 100, 200 );

In addition, some objects, such as geTransAlphaWipe, were created to perform image transitions before Edje existed. Although Edje is the way of the future, the alphawipe code allows you to perform a common simple transition without involving Edje. This is used in gevasanim to create a sprite-like object that transitions between its frames using alpha blending.

The xxx_from_metadata() functions in gEvas allow you to set up location, image filename, visibility and other attributes for a new object using a single string. Both the from_metadata() and the transition code duplicate functionality now also available in Edje:

sprite = gevas_sprite_new( GTK_GEVAS(gevas) );

for( i=1; i<frame_count; ++i )
 gchar* md = g_strdup_printf(
 gi = gevasimage_new_from_metadata( GTK_GEVAS(gevas), md );
 g_free( md );
 gevas_sprite_add( sprite, GTK_GEVASOBJ( gi ) );

gevas_sprite_set_default_frame_delay( sprite,2000 );
gevas_sprite_play_forever( sprite );

/* frame transitions */
geTransAlphaWipe* trans = 0;
trans = gevastrans_alphawipe_new();
for( i=0; i<frame_count; ++i )
     sprite, i, trans );

For the grand finale, I put an Edje object onto the gEvas canvas. The client I created to demonstrate for this article is demo/gevasedje in the gEvas distribution. The interesting parts are shown below. The Edje itself has an Enlightenment logo that spins around and one that throbs under mouse clicks:

/* init engines */
gtk_init(&argc, &argv);

gevas = ...;
/* allow edje to update the canvas as well */
gevas_setup_ecore( (GtkgEvas*)gevas );

/* place an edje object */
GtkgEvasEdje* gedje
 = gevasedje_new_with_canvas( gevas );

/* eet files can contain many edje objects */
gevasedje_set_file( gedje, "e_logo.eet", "test" );
go = GTK_GEVASOBJ(gedje);
gevasobj_move(      go, 300, 300 );
gevasobj_resize(    go, 370, 350 );
gevasobj_set_layer( go, 10 );
gevasobj_show(      go );


White Paper
Linux Management with Red Hat Satellite: Measuring Business Impact and ROI

Linux has become a key foundation for supporting today's rapidly growing IT environments. Linux is being used to deploy business applications and databases, trading on its reputation as a low-cost operating environment. For many IT organizations, Linux is a mainstay for deploying Web servers and has evolved from handling basic file, print, and utility workloads to running mission-critical applications and databases, physically, virtually, and in the cloud. As Linux grows in importance in terms of value to the business, managing Linux environments to high standards of service quality — availability, security, and performance — becomes an essential requirement for business success.

Learn More

Sponsored by Red Hat

White Paper
Private PaaS for the Agile Enterprise

If you already use virtualized infrastructure, you are well on your way to leveraging the power of the cloud. Virtualization offers the promise of limitless resources, but how do you manage that scalability when your DevOps team doesn’t scale? In today’s hypercompetitive markets, fast results can make a difference between leading the pack vs. obsolescence. Organizations need more benefits from cloud computing than just raw resources. They need agility, flexibility, convenience, ROI, and control.

Stackato private Platform-as-a-Service technology from ActiveState extends your private cloud infrastructure by creating a private PaaS to provide on-demand availability, flexibility, control, and ultimately, faster time-to-market for your enterprise.

Learn More

Sponsored by ActiveState