Paolo Donadeo — LifeLOG

All about my life, job and thoughts
  • rss
  • Home
  • Blog
  • Contacts
    • GPG public key
    • Alessandro Donadeo — Curriculum Vitæ

Draw something on the screen… and interact with it!

Paolo | 01/09/2008 | 13:30

Summary of the previous episodes: 10 days ago Richard Jones complained about the difficulties to achieve simple tasks (drawing a function graph on the screen) on modern computers with modern programming languages; the day after Erik de Castro Lopo replied with a post in which he used GTK and Cairo (better: the OCaml bindings) to achieve the result to draw a simple function on the screen. Yesterday Matias Giovannini added some pepper to this argument using SDL to draw the Newton fractal.

So, what can be added to all this? With a perfect graphic toy you can draw on a window with simple commands, of course, but you also want to interact with the objects you drew. So I elaborated Erik example to add some keyboard and mouse interaction with the graphics on the screen.

Downloading and compiling

First of all, download the source code or, if you want the latest version, clone my GIT repository:

$ git clone http://www.ex-nunc.org/projects/pdonadeo/cairo_toy.git cairo_toy.git

To compile the program you need:

  • OCaml (I have version 3.10.2, but probably 3.10.0 or 3.10.1 are ok);
  • Lablgtk2, the OCaml binding to GTK2;
  • the OCaml binding to libcairo.

All these packages are available in any recent Linux distribution; on Debian/Ubuntu:

$ aptitude install ocaml liblablgtk2-ocaml-dev libcairo-ocaml-dev

To compile instruct this command inside the program directory:

$ ocamlbuild demo_toy.native

The code

The program is very simple and is essentially derived from Erik’s code: the core is the functor Toy_maker.Make which accepts, as input, a module with the following signature INTERACTOR:

?View Code OCAML
module type INTERACTOR =
sig
  type state
  val init_state : state
  val win_title : string
  val init_width : int
  val init_height : int
  val cmd_line_handler : state -> string array -> state
  val keyboard_callback : state -> GdkEvent.Key.t -> state * bool
  val pointer_buttons_callback : state -> GdkEvent.Button.t -> state * bool
  val pointer_motion_callback : state -> GdkEvent.Motion.t -> state * bool
  val pointer_scroll_callback : state -> GdkEvent.Scroll.t -> state * bool
  val repaint : state -> Cairo.t -> int -> int -> state * bool
end

In this module the user must provide a type state, which contains the application state, some initialization values, a command line handler (in case you need) and 4 event handlers for the following events:

  • keyboard;
  • mouse motion;
  • mouse buttons;
  • mouse wheel event (scroll events in GTK).

The user also provides a repaint function, which takes care of repainting the Cairo context.

As a demo I wrote a simple My_interactor module implementing the following simple features:

  • left click on the gray background creates a new circle;
  • left click inside an existing circle moves it around;
  • right click inside a circle deletes it;
  • the mouse wheel zooms (in and out);
  • middle click is used to pan;

Here is the result.

Yes, it’s somewhat dull, but it does its job. Have fun!

Share this page
Subscribedel.icio.usRedditTechnorati
Categories
Article, Computer programming, English, Objective Caml, Spare time
Tags
Article, Computer programming, English, Objective Caml, Spare time
Comments rss
Comments rss
Trackback
Trackback

« Ascoltare Radio Monte Carlo… con Linux Si riparte… »

2 responses

This is off-topic, but i think your two-colour background makes

bluestormNo Gravatar | 01/09/2008 | 19:58

This is off-topic, but i think your two-colour background makes the code quite hard to read. It looks like a list of unrelated lines, while it isn’t, wich is a bit disturbing.

If you want to make the line number easy to associate with the corresponding code line, you could try a hover mechanism (highlighting the line under the mouse) instead.

You are right, now it's much more readable.

PaoloNo Gravatar | 01/09/2008 | 21:07

You are right, now it’s much more readable.

Leave a comment

You can use these tags : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Administration

  • Log in
  • Entries RSS
  • Comments RSS

Search with Google

Facets (like tags, but better)

Article Books Chillout Cinema Computer programming Digital life Editors Essay Information retrieval Job Karate Librarianship Life Linux Music News Nu-jazz Objective Caml Photography Politics Python Random thoughts Review South American literature Spare time Tips Visual arts Writing

Facets hierarchy

Site map

  • Home
  • Blog
  • Contacts
    • GPG public key
    • Alessandro Donadeo — Curriculum Vitæ

RSS Recent links on del.icio.us

  • nautilussvn - Google Code
  • Apache CouchDB: The CouchDB Project
  • Creating a Progress Bar Using CSS and JavaScript
  • MooCrop: Mootools 1.2 Image Cropping
  • OCamlP3l
  • 10 Useful Techniques To Improve Your User Interface Designs
  • on facebook and graphology

RSS Interesting News

  • Putting OCaml's type system to work: Writing statically-checked XML [PDF]programming: what's new online
  • L'inadatto presidenteAntonio Di Pietro
  • Unemployment fears worry GermansBBC News | Europe | World Edition
  • on facebook and graphologyi'm in a hurry - stefano zacchiroli blog
  • Comic for December 14, 2008Dilbert Daily Strip
  • Fast PDF viewing right in your browserGmail Blog
  • Abruzzo: un modello virtuosoAntonio Di Pietro

My Last.Fm

Recent Posts

  • Si riparte…
  • Draw something on the screen… and interact with it!
  • Ascoltare Radio Monte Carlo… con Linux
  • Holiday!
  • Vacanze!
  • Ritardo Cronico
  • PyCon Due

Old posts

  • September 2008 (2)
  • August 2008 (1)
  • July 2008 (2)
  • June 2008 (1)
  • May 2008 (1)
  • April 2008 (2)
  • March 2008 (1)
  • January 2008 (4)
  • November 2007 (2)
  • October 2007 (6)
  • August 2007 (2)

Blogroll

  • Alex
  • Andrea
  • Benji
  • Dome
  • Gigi
  • Ilaria
  • kOoLiNuS’s blog (English)
  • kOoLiNuS’s blog (italian)
  • Le ricette del secco
  • Roberto Gastaldi
  • Tommaso Carullo

Make me a present...

My Amazon.com Wish List
My Hoepli.it Wish List
rss Comments rss valid xhtml 1.1 Viewable With Any Browser design by jide