Wearable native

Rotary Selector

This feature is supported in wearable applications only.

The rotary selector is optimized for wearable circular devices. It is composed of a selector and multiple items surrounding the selector. The rotary selector can be used to select an item or to move to the next or prev page through a rotary event.

The rotary selector handle can use the elm_layout APIs, because the rotary selector handle is an elm_layout object.

Figure: Rotary Selector

Rotary Selector

Creating a Rotary Selector

To create a rotary selector, use the eext_rotary_selector_add() function:

Evas_Object *rotary_selector, *parent;

Rotary_selector = eext_rotary_selector_add(parent);

Activating a Rotary Event

The rotary selector can be activated and deactivated by using the eext_rotary_object_event_activated_set() function. If the second parameter is set to EINA_TRUE, the created rotary selector can also receive a rotary event.

eext_rotary_object_event_activated_set(rotary_selector, EINA_TRUE);

Configuring the Selector and Item State

You can configure the selector and item states:

  • The available selector states are:
    • EEXT_ROTARY_SELECTOR_SELECTOR_STATE_NORMAL: Selector is in a normal state.
    • EEXT_ROTARY_SELECTOR_SELECTOR_STATE_PRESSED: Selector is in a pressed state.

    For example, to set the selector color for a normal state selector:

    eext_rotary_selector_part_color_set(selector, "selector,bg_image", 
                                    EEXT_ROTARY_SELECTOR_SELECTOR_STATE_NORMAL, 
                                    100, 100, 100, 255);
  • The available selector item states are:
    • EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL: Item is in a normal state.
    • EEXT_ROTARY_SELECTOR_ITEM_STATE_PRESSED: Item is in a pressed state.

    For example, to set the item color for a normal state item:

    eext_rotary_selector_item_part_color_set(item, "item,icon", 
                                         EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL, 
                                         100, 100, 100, 255);

The following table shows the customizable rotary selector parts.

Table: Customizable rotary selector parts
Part Setting function View
selector,main_text eext_rotary_selector_item_part_color_set()

main_text
selector,sub_text eext_rotary_selector_item_part_color_set()

sub_text
item,icon

item,bg_image

 eext_rotary_selector_item_part_content_set()

eext_rotary_selector_item_part_color_set()

Item content
selector,icon

selector,content

selector,bg_image

 eext_rotary_selector_part_content_set()

eext_rotary_selector_part_color_set()

eext_rotary_selector_part_content_get()

Selector content

Setting the Rotary Selector Item Text

The following table shows the functions you can use to set the main and sub text of an item. The text is displayed in the selector when the item is selected.

Table: Item texts
Text Setting function View
selector,main_text eext_rotary_selector_item_part_text_set()

eext_rotary_selector_item_domain_translatable_part_text_set()

main_text
selector,sub_text eext_rotary_selector_item_part_text_set()

eext_rotary_selector_item_domain_translatable_part_text_set()

sub_text

Adding a Rotary Selector Item

Note
A maximum of 11 items can be displayed in one page of the rotary selector. Any exceeding items are arranged in the next page.

To add an item, append it with the eext_rotary_selector_item_append() function and set its attributes:

Eext_Object_Item * item;
Evas_Object *image;

// Append item
item = eext_rotary_selector_item_append(rotary_selector);
// Set item icon
image = elm_image_add(rotary_selector);
elm_image_file_set(image, "music_controller_btn_play.png", NULL);

eext_rotary_selector_item_part_content_set(item, "item,icon", 
                                           EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL, image);
// Set selector main text
eext_rotary_selector_item_part_text_set(item, "selector,main_text", "Options");

// Set selector content icon
image = elm_image_add(rotary_selector);
elm_image_file_set(image, "music_controller_btn.png", NULL);
eext_rotary_selector_item_part_content_set(item, "selector,icon", 
                                           EEXT_ROTARY_SELECTOR_ITEM_STATE_NORMAL, image);

Using the Rotary Selector Callbacks

The rotary selector emits the following signals:

  • item,selected: User selected the item.
  • item,clicked: User clicked the item.

For both signals, the event_info parameter returned in the callback is NULL.

To register and define a callback function called by the clicked signal

{
   evas_object_smart_callback_add(rotary_selector, "item,clicked", item_clicked_cb, data);
}

// Callback function for the "item,clicked" signal
// This callback is called when the item is clicked by the user
void 
item_clicked_cb(void *data, Evas_Object *obj, void *event_info)
{
   dlog_print(DLOG_INFO, LOG_TAG, "Item clicked\n");
}
Go to top