Mobile native

[UI Sample] Elm Transit Sample Overview

The Elm Transit sample demonstrates how to add the translation and rotation effect on Evas_Object.

The following figure illustrates the main screen of Elm Transit.

Figure: Elm Transit screen

Elm Transit screen

Implementation

The following code snippet shows how to create a transit for an Evas_Object. The elm_transit_add() function creates a transit, and the elm_transit_object_add() function adds the transit on an Evas_Object.

Evas_Object *btn;
Elm_Transit *transit;

btn = elm_button_add(win);
elm_object_text_set(btn, "Elm Transit");
evas_object_move(btn, 0, 0);
evas_object_resize(btn, 200, 200);
evas_object_show(btn);

transit = elm_transit_add();
elm_transit_object_add(transit, btn);

The following code snippet gives the transit effects, such as translation or rotation. In addition, it enables you to set options for the transit. The elm_transit_repeat_times_set() function sets the total animation time. The default count is 1, and the number of repeats is 3. So the total number of repeats is 4. The elm_transit_auto_reverse_set() function sets whether the effect is reversed. If you set the number by 1, the effect is reversed. The elm_transit_duration_set() function sets the time for how long the effect lasts.

elm_transit_effect_translation_add(transit,0, 0, 200, 200);
elm_transit_effect_rotation_add(transit, 0, 180);
elm_transit_repeat_times_set(transit, 3);
elm_transit_auto_reverse_set(transit, 1);
elm_transit_duration_set(transit, 1);

The following code snippet shows how to start the transit. Once the elm_transit_go() function is called, the transit begins to measure the time.

elm_transit_go(transit);
Go to top