Jump to: navigation, search
This article is a stub. You can help the OLPC project by expanding it.

Deprecation Warning

Hippocanvas is sort of deprecated. Initially, hippocanvas was to be the basic building block for all Activities, but it proved too immature to be used everywhere. Instead activity developers are encouraged to use the standard GTK components. However, hippocanvas does provide some features that are difficult or impossible with standard GTK, as used by Chat and a few other Sugar elements. Therefore, it is included in the build. -Benjinam M. Schwartz


HippoCanvas is a generic user interface element that can draw Cairo graphics, respond to key and mouse events, and lay out other widgets. It is currently used to implement a number of Sugar's custom widgets (toolbars, rounded buttons, etc.) and to lay out the screen.

On the OLPC, HippoCanvas, aka hippo, is a GTK widget and it can contain other GTK widgets, so the programmer can freely combine HippoCanvas and other widgets. While Sugar does not require that activities be written using HippoCanvas, those that do can look more visually consistent with other activities.


HippoCanvas was originally designed to be a cross-platform UI layer built on top of other windowing systems. It is used in Sugar to work around deficiencies in GTK's layout system. [1] HippoCanvas also makes it easier to prototype custom widgets, and its Python interface can be somewhat simpler than native GTK widgets.


Hippo PyDoc

Classes and Interfaces

Canvas object

Derives from GtkContainer. This is a GTK widget that hosts a root CanvasItem.

CanvasItem interface

CanvasContext interface

CanvasBox object

Derives from GObject, implements CanvasItem, CanvasContext.

CanvasWidget object

Derives from CanvasBox.

CanvasImage object

Derives from CanvasBox.

CanvasText object

Derives from CanvasBox.

CanvasLink object

Derives from CanvasText.


PackFlags enumeration

CascadeMode enumeration

StockColor enumeration

CanvasPointer enumeration

ItemAlignment enumeration

CanvasSizeMode enumeration

ScrollbarPolicy enumeration

EventType enumeration

MotionDetail enumeration

Key enumeration

Orientation enumeration

Side enumeration

Gravity enumeration

Internal objects

Event object

Encapsulates information about a mouse action or keypress. It is currently only used internally.

Rectangle object

Describes a rectangle on the screen in integer coordinates. It is currently only used internally.


  • x
  • y
  • width
  • height


  • rectangle.intersect(rect2, dest)
  • rectangle.equals(rect2) => boolean