Edje Library Documentation

Version:: 0.9.92.062

Author:: Carsten Haitzler <raster@rasterman.com>

Date:: 2003-2008

What is Edje?

Edje is a complex graphical design & layout library.

It's purpose is to be a sequel to "Ebits" which to date has serviced the needs of Enlightenment development for version 0.17. The original design parameters under which Ebits came about were a lot more restricted than the resulting use of them, thus Edje was born.

Edje is a more complex layout engine compared to Ebits. It doesn't pretend to do containing and regular layout like a widget set. It still inherits the more simplistic layout ideas behind Ebits, but it now does them a lot more cleanly, allowing for easy expansion, and the ability to cover much more ground than Ebits ever could. For the purposes of Enlightenment 0.17, Edje should serve all the purposes of creating visual elements (borders of windows, scrollbars, etc.) and allow the designer the ability to animate, layout and control the look and feel of any program using Edje as its basic GUI constructor. This library allows for multiple collections of Layouts in one file, sharing the same image database and thus allowing a whole theme to be conveniently packaged into 1 file and shipped around.

Edje, unlike Ebits, separates the layout and behavior logic. Edje files ship with an image database, used by all the parts in all the collections to source graphical data. It has a directory of logical part names pointing to the part collection entry ID in the file (thus allowing for multiple logical names to point to the same part collection, allowing for the sharing of data between display elements). Each part collection consists of a list of visual parts, as well as a list of programs. A program is a conditionally run program that if a particular event occurs (a button is pressed, a mouse enters or leaves a part) will trigger an action that may affect other parts. In this way a part collection can be "programmed" via its file as to hilight buttons when the mouse passes over them or show hidden parts when a button is clicked somewhere etc. The actions performed in changing from one state to another are also allowed to transition over a period of time, allowing animation.

This separation and simplistic event driven style of programming can produce almost any look and feel one could want for basic visual elements. Anything more complex is likely the domain of an application or widget set that may use Edje as a convenient way of being able to configure parts of the display.

What does Edje require?

Edje requires fairly little on your system. to use the Edje runtime library you need:

Evas (library)
Ecore (library)
Eet (library)

Evas needs to be build with the PNG and EET image loaders enabled at a minimum. Edje uses X for the test program, so you will need the SOFTWARE_X11 engine built into Evas as well. A suggested configure list is below in the "cheat sheet" for Evas.

Ecore needs the ECORE, ECORE_EVAS and ECORE_X modules built at a minimum. It's suggested to build all the Ecore modules, but the ECORE_FB modules is definitely optional.

Eet has no options so just build and install it.

It is suggested right now that you get the latest CVS versions of the required libraries. You also need to build them in the right order and make sure the right options are enabled in the required libraries. Here is a quick "cheat sheet" on how to get started.

1. You need Eet from the HEAD cvs branch (must be up-to-date)

  cvs co e17/libs/eet
  cd e17/libs/eet
  ./autogen.sh
  ./configure
  make
  sudo make install
  cd

2. You need Evas from the HEAD branch built with eet loader support.

  cvs co e17/libs/evas
  cd e17/libs/evas
  ./autogen.sh
  ./configure
  make
  sudo make install
  cd
  
3. You need Ecore from the HEAD cvs branch

  cvs co e17/libs/ecore
  cd e17/libs/ecore
  ./autogen.sh
  ./configure
  make
  sudo make install
  cd

4. You need embryo from the HEAD cvs branch

  cvs co e17/libs/embryo
  cd e17/libs/embryo
  ./autogen.sh
  ./configure
  make
  sudo make install
  cd

How to compile and test Edje

Now you need to compile and install Edje.

  ./configure
  make
  sudo make install

You now have it installed and ready to go, but you are missing data files. In data/ there are data sets for you to look at as examples. To try one out do:

   cd data
   ./e_logo.sh
   
   edje ./e_logo.eet

The Edje test program/viewer is able to view multiple Edje data sets. The following will view 3 of them at once in the one window (which you can resize to give you more space to move and resize the Edje data sets around):

  edje ./e_logo.eet ./e_logo.eet ./e_logo.eet

So how does this all work?

Edje internally holds a geometry state machine and state graph of what is visible, not, where, at what size, with what colors etc. This is described to Edje from an Edje .eet file containing this information. These files can be produced by using edje_cc to take a text file (a .edc file) and "compile" an output .eet file that contains this information, images and any other data needed.

Todo:

See src/lib/edje_private.h for a list of FIXME's

Complete documentation of API

Bytecode language for extending programs... but what/how?