The flip widget can hold two Evas Objects and allows the user flip between them using several pre-defined animations.

• Adding a Flip
• Configuring Flip Animation
• Interacting With the User

• Flip Widget API
• A Flip Example

This is how to create a flip widget.

Evas_Object *flip, *content1, *content2;
flip = elm_flip_add(parent);

We can add content to the flip widget. content1 is set to the “front” content and content2 is set to the “back” mode.

elm_object_part_content_set(flip, "front", content1);
elm_object_part_content_set(flip, "back", content2);

Now we can run an flip animation.

elm_flip_go(flip, ELM_FLIP_CUBE_UP);

This animation flips up the “front” content object as if it was on a side of a cube, letting the down facing side of the cube appear with the “back” content object. Several animations are available:

• ELM_FLIP_ROTATE_X_CENTER_AXIS - Rotate the currently visible content around a horizontal axis in the middle of its height, the other content is shown as the other side of the flip.
• ELM_FLIP_ROTATE_Y_CENTER_AXIS - Rotate the currently visible content around a vertical axis in the middle of its width, the other content is shown as the other side of the flip.
• ELM_FLIP_ROTATE_XZ_CENTER_AXIS - Rotate the currently visible content around a diagonal axis in the middle of its width, the other content is shown as the other side of the flip.
• ELM_FLIP_ROTATE_YZ_CENTER_AXIS - Rotate the currently visible content around a diagonal axis in the middle of its height, the other content is shown as the other side of the flip.
• ELM_FLIP_CUBE_LEFT - Rotate the currently visible content to the left as if the flip was a cube, the other content is show as the right face of the cube.
• ELM_FLIP_CUBE_RIGHT - Rotate the currently visible content to the right as if the flip was a cube, the other content is show as the left face of the cube.
• ELM_FLIP_CUBE_UP - Rotate the currently visible content up as if the flip was a cube, the other content is show as the bottom face of the cube.
• ELM_FLIP_CUBE_DOWN - Rotate the currently visible content down as if the flip was a cube, the other content is show as the upper face of the cube.
• ELM_FLIP_PAGE_LEFT - Move the currently visible content to the left as if the flip was a book, the other content is shown as the page below that.
• ELM_FLIP_PAGE_RIGHT - Move the currently visible content to the right as if the flip was a book, the other content is shown as the page below that.
• ELM_FLIP_PAGE_UP - Move the currently visible content up as if the flip was a book, the other content is shown as the page below that.
• ELM_FLIP_PAGE_DOWN - Move the currently visible content down as if the flip was a book, the other content is shown as the page below that.

By default, the user cannot interact with the flip. We can set the interaction to be possible, but we have to choose which animation appears on the interaction (rotation has been selected in the following example).

elm_flip_interaction_set(flip, ELM_FLIP_INTERACTION_ROTATE);

The available modes of interaction are

• ELM_FLIP_INTERACTION_NONE - No interaction is allowed
• ELM_FLIP_INTERACTION_ROTATE - Interaction causes a rotating animation
• ELM_FLIP_INTERACTION_CUBE - Interaction causes a cube animation
• ELM_FLIP_INTERACTION_PAGE - Interaction causes a page animation

We must also choose, which interaction directions are enabled (only right and left in the following example).

elm_flip_interaction_direction_enabled_set(flip, ELM_FLIP_DIRECTION_LEFT, EINA_TRUE);
elm_flip_interaction_direction_enabled_set(flip, ELM_FLIP_DIRECTION_RIGHT, EINA_TRUE);

We can also set the amount of the flip that is sensitive to user interaction. In the following example, it is set to the entire flip (1) to make the flip easy to interact with.

elm_flip_interaction_direction_hitsize_set(flip, ELM_FLIP_DIRECTION_LEFT, 1);
elm_flip_interaction_direction_hitsize_set(flip, ELM_FLIP_DIRECTION_RIGHT, 1);

Two signals are emitted by the flip: one when an animation starts and one when it ends. For these signals, event_info parameter is NULL.

• “animate,begin” - A flip animation is started
• “animate,done” - A flip animation is finished

We can register a callback on the “animation,begin” signal.

evas_object_smart_callback_add(entry, "animate,begin", _anim_start_cb, data);
 
// Callback function for the "animate,begin" signal
// This callback is called when the flip animation starts
static void
_anim_start_cb(void *data, Evas_Object *obj, void *event_info)
{
   printf("Animation starts\n");
}

A Flip Example