Edje Animations example

In this example we will figure out how to manipulate the animations on an Edje object.

After reading this document you will be able to manipulate the frametime, freeze, pause and stop, all animations on an Edje object.

To play with this example you will use the keyboard. Below are listed the keys and what each does.

- '+' Increase the frametime;
- '-' Decrease the frametime;
- '=' Prints the actual frametime and says if the animations is playing;
- 'f' Freezes the animations in the Edje object;
- 'F' Freezes the animations in all objects in the running program;
- 't' Thaws the animations in the Edje object;
- 'T' Thaws the animations in all objects in the running program;
- 's' Pauses the animations;
- 'p' Plays the animations previously stopped;
- 'a' Starts the animation in the Edje object;
- 'A' Stops the animations in the Edje object;

Now that we've explained how to use our example, we will see how it is made. Let's start by looking at the piece of code responsible to the actions commented above.

_on_key_down(void *data EINA_UNUSED, Evas *evas EINA_UNUSED, Evas_Object *obj, void *event_info)
{
Evas_Event_Key_Down *ev;
double ft;
ev = (Evas_Event_Key_Down *)event_info;
if (!strcmp(ev->key, "h"))
{
printf(commands);
return;
}
else if (!strcmp(ev->key, "plus"))
{
frametime *= 2.0;
printf("Increasing frametime to: %f\n", frametime);
edje_frametime_set(frametime);
}
else if (!strcmp(ev->key, "minus"))
{
frametime /= 2.0;
printf("Decreasing frametime to: %f\n", frametime);
edje_frametime_set(frametime);
}
else if (!strcmp(ev->key, "equal"))
{
ft = edje_frametime_get();
printf("Frametime: %f\n", ft);
if (edje_object_play_get(obj))
printf("Object is playing\n");
else
printf("Object was paused\n");
if (edje_object_animation_get(obj))
printf("Animation is running\n");
else
printf("Animation was stopped\n");
}
else if (!strcmp(ev->key, "s"))
{
edje_object_play_set(obj, EINA_FALSE);
printf("Pausing the object\n");
}
else if (!strcmp(ev->key, "p"))
{
edje_object_play_set(obj, EINA_TRUE);
printf("Playing the object\n");
}
else if (!strcmp(ev->key, "f"))
printf("Freezing object. Count: %d\n", edje_object_freeze(obj));
else if (!strcmp(ev->key, "t"))
printf("Thawing object. Count: %d\n", edje_object_thaw(obj));
else if (!strcmp(ev->key, "F"))
{
edje_freeze();
printf("Freezing all objects\n");
}
else if (!strcmp(ev->key, "T"))
{
edje_thaw();
printf("Thawing all objects\n");
}
else if (!strcmp(ev->key, "a"))
{
edje_object_animation_set(obj, EINA_TRUE);
printf("Starting the animation in the Edje object\n");
}
else if (!strcmp(ev->key, "A"))
{
edje_object_animation_set(obj, EINA_FALSE);
printf("Stopping the animation in the Edje object\n");
edje_thaw
void edje_thaw(void)
Thaws Edje objects.
Definition: edje_util.c:349
edje_freeze
void edje_freeze(void)
Freezes Edje objects.
Definition: edje_util.c:212
edje_frametime_set
void edje_frametime_set(double t)
Sets edje transitions' frame time.
Definition: edje_program.c:216
edje_frametime_get
double edje_frametime_get(void)
Gets edje transitions' frame time.
Definition: edje_program.c:222
edje_object_thaw
int edje_object_thaw(Edje_Object *obj)
Thaws the Edje object.
Definition: edje_legacy.c:1104
edje_object_play_get
Eina_Bool edje_object_play_get(const Evas_Object *obj)
Whether this object is playing or not.
Definition: edje_legacy.c:1122
edje_object_animation_set
void edje_object_animation_set(Efl_Canvas_Layout *obj, Eina_Bool on)
Whether this object is animating or not.
Definition: efl_canvas_layout_eo.legacy.c:3
edje_object_animation_get
Eina_Bool edje_object_animation_get(const Efl_Canvas_Layout *obj)
Whether this object is animating or not.
Definition: efl_canvas_layout_eo.legacy.c:9
edje_object_freeze
int edje_object_freeze(Edje_Object *obj)
Freezes the Edje object.
Definition: edje_legacy.c:1098
edje_object_play_set
void edje_object_play_set(Evas_Object *obj, Eina_Bool play)
Whether this object is playing or not.
Definition: edje_legacy.c:1116
EINA_TRUE
#define EINA_TRUE
boolean value TRUE (numerical value 1)
Definition: eina_types.h:539
EINA_FALSE
#define EINA_FALSE
boolean value FALSE (numerical value 0)
Definition: eina_types.h:533
EINA_UNUSED
#define EINA_UNUSED
Used to indicate that a function parameter is purposely unused.
Definition: eina_types.h:339
Evas
Eo Evas
An opaque handle to an Evas canvas.
Definition: Evas_Common.h:163
Evas_Object
Efl_Canvas_Object Evas_Object
An Evas Object handle.
Definition: Evas_Common.h:185
_Evas_Event_Key_Down
Key press event.
Definition: Evas_Legacy.h:314
_Evas_Event_Key_Down::key
const char * key
The logical key : (eg shift+1 == exclamation)
Definition: Evas_Legacy.h:320
}
else if (!strcmp(ev->key, "Escape"))
ecore_main_loop_quit();
else
{
printf("unhandled key: %s\n", ev->key);
printf(commands);
}
ecore_main_loop_quit
void ecore_main_loop_quit(void)
Quits the main loop once all the events currently on the queue have been processed.
Definition: ecore_main.c:1321

Note
  The actions for the keys 'f' and 'F' will have the same effect in our example, just because there is only one object in the running program, The same happens with the keys 't' and 'T'.

As you may have seen these set of functions are pretty easy to handle. The other important part of this example is the EDC file. The animations used in the code were created there

program {
signal: "load";
source: "";
in: 2.0 0.0;
after: "animation,state1";
}
program {
name: "animation,state1";
in: 1.0 0.0;
action: STATE_SET "invert" 1.0;
target: "part_one";
target: "part_two";
target: "part_three";
transition: LINEAR 0.6;
after: "animation,state2";
}
program {
name: "animation,state2";
in: 1.0 0.0;
action: STATE_SET "default" 0.0;
target: "part_one";
target: "part_two";
target: "part_three";
transition: LINEAR 0.6;
after: "animation,state1";
}
}

The example's window should look like this picture:

The full example follows.

#ifdef HAVE_CONFIG_H
# include "config.h"
#else
# define EINA_UNUSED
#endif
#ifndef PACKAGE_DATA_DIR
#define PACKAGE_DATA_DIR "."
#endif
#include <Ecore.h>
#include <Ecore_Evas.h>
#include <Edje.h>
#define WIDTH (400)
#define HEIGHT (300)
static const char commands[] = \
"commands are:\n"
"\t+ - increase frametime\n"
"\t- - decrease frametime\n"
"\t= - status of the animation\n"
"\ts - pause\n"
"\tp - play\n"
"\tf - freeze one object\n"
"\tF - freeze all objects\n"
"\tt - thaw one object\n"
"\tT - thaw all objects\n"
"\ta - start animation of one object\n"
"\tA - stop animation of one object\n"
"\tEsc - exit\n"
"\th - print help\n";
static double frametime = 1.0 / 30.0; /* default value */
static void
_on_delete_cb(Ecore_Evas *ee EINA_UNUSED)
{
ecore_main_loop_quit();
}
static void
_on_canvas_resize(Ecore_Evas *ee)
{
Evas_Object *bg;
Evas_Object *edje_obj;
int w;
int h;
bg = ecore_evas_data_get(ee, "background");
edje_obj = ecore_evas_data_get(ee, "edje_obj");
ecore_evas_geometry_get(ee, NULL, NULL, &w, &h);
evas_object_resize(bg, w, h);
evas_object_resize(edje_obj, w, h);
}
static void
_on_key_down(void *data EINA_UNUSED, Evas *evas EINA_UNUSED, Evas_Object *obj, void *event_info)
{
Evas_Event_Key_Down *ev;
double ft;
ev = (Evas_Event_Key_Down *)event_info;
if (!strcmp(ev->key, "h"))
{
printf(commands);
return;
}
else if (!strcmp(ev->key, "plus"))
{
frametime *= 2.0;
printf("Increasing frametime to: %f\n", frametime);
edje_frametime_set(frametime);
}
else if (!strcmp(ev->key, "minus"))
{
frametime /= 2.0;
printf("Decreasing frametime to: %f\n", frametime);
edje_frametime_set(frametime);
}
else if (!strcmp(ev->key, "equal"))
{
ft = edje_frametime_get();
printf("Frametime: %f\n", ft);
if (edje_object_play_get(obj))
printf("Object is playing\n");
else
printf("Object was paused\n");
if (edje_object_animation_get(obj))
printf("Animation is running\n");
else
printf("Animation was stopped\n");
}
else if (!strcmp(ev->key, "s"))
{
edje_object_play_set(obj, EINA_FALSE);
printf("Pausing the object\n");
}
else if (!strcmp(ev->key, "p"))
{
edje_object_play_set(obj, EINA_TRUE);
printf("Playing the object\n");
}
else if (!strcmp(ev->key, "f"))
printf("Freezing object. Count: %d\n", edje_object_freeze(obj));
else if (!strcmp(ev->key, "t"))
printf("Thawing object. Count: %d\n", edje_object_thaw(obj));
else if (!strcmp(ev->key, "F"))
{
edje_freeze();
printf("Freezing all objects\n");
}
else if (!strcmp(ev->key, "T"))
{
edje_thaw();
printf("Thawing all objects\n");
}
else if (!strcmp(ev->key, "a"))
{
edje_object_animation_set(obj, EINA_TRUE);
printf("Starting the animation in the Edje object\n");
}
else if (!strcmp(ev->key, "A"))
{
edje_object_animation_set(obj, EINA_FALSE);
printf("Stopping the animation in the Edje object\n");
}
else if (!strcmp(ev->key, "Escape"))
ecore_main_loop_quit();
else
{
printf("unhandled key: %s\n", ev->key);
printf(commands);
}
}
int
main(int argc EINA_UNUSED, char *argv[] EINA_UNUSED)
{
const char *edje_file = PACKAGE_DATA_DIR"/animations.edj";
Ecore_Evas *ee;
Evas *evas;
Evas_Object *bg;
Evas_Object *edje_obj;
if (!ecore_evas_init())
return EXIT_FAILURE;
if (!edje_init())
goto shutdown_ecore_evas;
/* this will give you a window with an Evas canvas under the first
* engine available */
ee = ecore_evas_new(NULL, 0, 0, WIDTH, HEIGHT, NULL);
if (!ee) goto shutdown_edje;
ecore_evas_callback_delete_request_set(ee, _on_delete_cb);
ecore_evas_callback_resize_set(ee, _on_canvas_resize);
ecore_evas_title_set(ee, "Edje Animations Example");
evas = ecore_evas_get(ee);
bg = evas_object_rectangle_add(evas);
evas_object_color_set(bg, 255, 255, 255, 255); /* white bg */
evas_object_move(bg, 0, 0); /* at canvas' origin */
evas_object_resize(bg, WIDTH, HEIGHT); /* covers full canvas */
evas_object_show(bg);
ecore_evas_data_set(ee, "background", bg);
edje_obj = edje_object_add(evas);
edje_object_file_set(edje_obj, edje_file, "animations_group");
evas_object_move(edje_obj, 0, 0);
evas_object_resize(edje_obj, WIDTH, HEIGHT);
evas_object_show(edje_obj);
ecore_evas_data_set(ee, "edje_obj", edje_obj);
evas_object_event_callback_add(edje_obj, EVAS_CALLBACK_KEY_DOWN,
_on_key_down, NULL);
evas_object_focus_set(edje_obj, EINA_TRUE);
printf(commands);
ecore_evas_show(ee);
ecore_main_loop_begin();
ecore_evas_free(ee);
ecore_evas_shutdown();
edje_shutdown();
return EXIT_SUCCESS;
shutdown_edje:
edje_shutdown();
shutdown_ecore_evas:
ecore_evas_shutdown();
return EXIT_FAILURE;
}
Ecore_Evas.h
Evas wrapper functions.
Edje.h
Edje Graphical Design Library.
EVAS_CALLBACK_KEY_DOWN
@ EVAS_CALLBACK_KEY_DOWN
Key Press Event.
Definition: Evas_Common.h:430
ecore_evas_init
EAPI int ecore_evas_init(void)
Inits the Ecore_Evas system.
Definition: ecore_evas.c:602
ecore_evas_title_set
EAPI void ecore_evas_title_set(Ecore_Evas *ee, const char *t)
Sets the title of an Ecore_Evas' window.
Definition: ecore_evas.c:1527
ecore_evas_callback_delete_request_set
EAPI void ecore_evas_callback_delete_request_set(Ecore_Evas *ee, Ecore_Evas_Event_Cb func)
Sets a callback for Ecore_Evas delete request events.
Definition: ecore_evas.c:1176
ecore_evas_show
EAPI void ecore_evas_show(Ecore_Evas *ee)
Shows an Ecore_Evas' window.
Definition: ecore_evas.c:1480
ecore_evas_get
EAPI Evas * ecore_evas_get(const Ecore_Evas *ee)
Gets an Ecore_Evas's Evas.
Definition: ecore_evas.c:1300
ecore_evas_geometry_get
EAPI void ecore_evas_geometry_get(const Ecore_Evas *ee, int *x, int *y, int *w, int *h)
Gets the geometry of an Ecore_Evas.
Definition: ecore_evas.c:1362
ecore_evas_data_set
EAPI void ecore_evas_data_set(Ecore_Evas *ee, const char *key, const void *data)
Stores user data in an Ecore_Evas structure.
Definition: ecore_evas.c:1103
ecore_evas_callback_resize_set
EAPI void ecore_evas_callback_resize_set(Ecore_Evas *ee, Ecore_Evas_Event_Cb func)
Sets a callback for Ecore_Evas resize events.
Definition: ecore_evas.c:1140
ecore_evas_shutdown
EAPI int ecore_evas_shutdown(void)
Shuts down the Ecore_Evas system.
Definition: ecore_evas.c:666
ecore_evas_new
EAPI Ecore_Evas * ecore_evas_new(const char *engine_name, int x, int y, int w, int h, const char *extra_options)
Creates a new Ecore_Evas based on engine name and common parameters.
Definition: ecore_evas.c:1039
ecore_evas_free
EAPI void ecore_evas_free(Ecore_Evas *ee)
Frees an Ecore_Evas.
Definition: ecore_evas.c:1083
ecore_evas_data_get
EAPI void * ecore_evas_data_get(const Ecore_Evas *ee, const char *key)
Retrieves user data associated with an Ecore_Evas.
Definition: ecore_evas.c:1092
ecore_main_loop_begin
void ecore_main_loop_begin(void)
Runs the application main loop.
Definition: ecore_main.c:1311
edje_shutdown
int edje_shutdown(void)
Shuts down the Edje library.
Definition: edje_main.c:262
edje_init
int edje_init(void)
Initializes the Edje library.
Definition: edje_main.c:35
edje_object_add
Evas_Object * edje_object_add(Evas *evas)
Instantiates a new Edje object.
Definition: edje_smart.c:22
edje_object_file_set
Eina_Bool edje_object_file_set(Evas_Object *obj, const char *file, const char *group)
Sets the EDJ file (and group within it) to load an Edje object's contents from.
Definition: edje_smart.c:467
evas_object_show
EVAS_API void evas_object_show(Evas_Object *eo_obj)
Makes the given Evas object visible.
Definition: evas_object_main.c:1814
evas_object_color_set
EVAS_API void evas_object_color_set(Evas_Object *obj, int r, int g, int b, int a)
Sets the general/main color of the given Evas object to the given one.
Definition: evas_object_main.c:2024
evas_object_event_callback_add
EVAS_API void evas_object_event_callback_add(Evas_Object *eo_obj, Evas_Callback_Type type, Evas_Object_Event_Cb func, const void *data)
Add (register) a callback function to a given Evas object event.
Definition: evas_callbacks.c:478
evas_object_move
EVAS_API void evas_object_move(Evas_Object *obj, Evas_Coord x, Evas_Coord y)
Move the given Evas object to the given location inside its canvas' viewport.
Definition: evas_object_main.c:1171
evas_object_focus_set
EVAS_API void evas_object_focus_set(Efl_Canvas_Object *obj, Eina_Bool focus)
Indicates that this object is the keyboard event receiver on its canvas.
Definition: efl_canvas_object_eo.legacy.c:39
evas_object_resize
EVAS_API void evas_object_resize(Evas_Object *obj, Evas_Coord w, Evas_Coord h)
Changes the size of the given Evas object.
Definition: evas_object_main.c:1236
evas_object_rectangle_add
EVAS_API Evas_Object * evas_object_rectangle_add(Evas *e)
Adds a rectangle to the given evas.
Definition: evas_object_rectangle.c:78
collections {
group {
name: "animations_group";
min: 100 80;
parts {
part {
name: "part_one";
type: RECT;
scale: 1;
description {
min: 50 50;
state: "default" 0.0;
color: 0 0 0 255; /* black */
rel1.relative: 0.0 0.0;
rel2.relative: 0.33 1.0;
}
description {
state: "invert" 1.0;
inherit: "default" 0.0;
rel1.relative: 0.0 0.0;
rel2.relative: 1.0 0.33;
}
}
part {
name: "part_two";
type: RECT;
scale: 1;
description {
min: 50 50;
state: "default" 0.0;
color: 255 255 0 255; /* yellow */
rel1.relative: 0.33 0.0;
rel2.relative: 0.66 1.0;
}
description {
state: "invert" 1.0;
inherit: "default" 0.0;
rel1.relative: 0.0 0.66;
rel2.relative: 1.0 1.0;
}
}
part {
name: "part_three";
type: RECT;
description {
state: "default" 0.0;
color: 255 0 0 255; /* red */
rel1.relative: 0.66 0.0;
rel2.relative: 1.0 1.0;
}
description {
state: "invert" 1.0;
inherit: "default" 0.0;
rel1.relative: 0.0 0.33;
rel2.relative: 1.0 0.66;
}
}
}
program {
signal: "load";
source: "";
in: 2.0 0.0;
after: "animation,state1";
}
program {
name: "animation,state1";
in: 1.0 0.0;
action: STATE_SET "invert" 1.0;
target: "part_one";
target: "part_two";
target: "part_three";
transition: LINEAR 0.6;
after: "animation,state2";
}
program {
name: "animation,state2";
in: 1.0 0.0;
action: STATE_SET "default" 0.0;
target: "part_one";
target: "part_two";
target: "part_three";
transition: LINEAR 0.6;
after: "animation,state1";
}
}

To compile use this command:

    * gcc -o edje-animations edje-animations.c -DPACKAGE_BIN_DIR=\"/Where/enlightenment/is/installed/bin\"
    * -DPACKAGE_LIB_DIR=\"/Where/enlightenment/is/installed/lib\"
    * -DPACKAGE_DATA_DIR=\"/Where/enlightenment/is/installed/share\"
    * `pkg-config --cflags --libs evas ecore ecore-evas edje`
    *
    * edje_cc animations.edc
    *