Icon
PUBLISHED
The icon UI component is used to display standard icon images ("delete", "home", and "apps") or images coming from a custom file (such as PNG, JPG, and Edje) in icon contexts. The icon component inherits from the image [1] component, which means that image functions can be used on icon objects. For more information, see the Icon [2] API.
This feature is supported in mobile applications only.
In the following cases, use an icon instead of an image:
- You need a thumbnail version of an original image.
- You need freedesktop.org [3]-provided icon images.
- You need theme-provided icon images (Edje groups).
Basic Usage
To use an icon component in your application:
- Add an icon with the
elm_icon_add()
function:Evas_Object *icon; icon = elm_icon_add(parent);
- Set an image to the icon.
To set a standard icon from freedesktop.org [3], use the
elm_icon_standard_set()
function:Evas_Object *icon; Evas_Object *parent; icon = elm_icon_add(parent); elm_icon_standard_set(icon, "Home");
- Register the callback functions.
To change the image file:
-
You can use an image in the file system (for example,
/tmp/Home.png
):elm_image_file_set(icon, "/tmp/Home.png", NULL);
You can also use a group in an Edje file (for example,
/tmp/Home.edj
):elm_image_file_set(icon, "/tmp/Home.edj", "elm/icon/Home/default");
-
You can generate and use a thumbnail:
elm_icon_thumb_set(icon, "/tmp/Home.png", NULL);
The
elm_icon_thumb_set()
function sets the file in the icon and enables the use of a cached thumbnail, if it already exists. Otherwise, it creates a new thumbnail and caches it for future use. The Ethumb library support is required for the thumbnail usage.
The following example shows a simple use case of the icon component.
Example: Icon use case
Evas_Object *win; Evas_Object *conf; Evas_Object *nf; Evas_Object *box; Evas_Object icon; Elm_Object_Item *nf_it; /* Starting right after the basic EFL UI layout code [4] */ /* win - conformant - naviframe */ /* Add a box to pack icons */ box = elm_box_add(nf); elm_object_content_set(nf, box); evas_object_show(box); elm_naviframe_item_push(nf, "Icon", NULL, NULL, box, NULL); icon = elm_icon_add(box); elm_icon_standard_set(icon, "apps"); evas_object_size_hint_min_set(icon, ELM_SCALE_SIZE(50), ELM_SCALE_SIZE(50)); evas_object_show(icon); elm_box_pack_end(box, icon); icon = elm_icon_add(box); elm_icon_standard_set(icon, "home"); evas_object_size_hint_min_set(icon, ELM_SCALE_SIZE(50), ELM_SCALE_SIZE(50)); evas_object_show(icon); elm_box_pack_end(box, icon); icon = elm_icon_add(box); elm_icon_standard_set(icon, "clock"); evas_object_size_hint_min_set(icon, ELM_SCALE_SIZE(50), ELM_SCALE_SIZE(50)); evas_object_show(icon); elm_box_pack_end(box, icon); |
Standard Icons
Table: Icon styles
Style | Sample |
---|---|
apps |
|
arrow_down |
|
arrow_left |
|
arrow_right |
|
arrow_up |
|
chat |
|
clock |
|
close |
|
delete |
|
edit |
|
file |
|
folder |
|
home |
|
no_photo |
|
refresh |
|
media_player/forward |
|
media_player/info |
|
media_player/next |
|
media_player/pause |
|
media_player/play |
|
media_player/prev |
|
media_player/rewind |
|
media_player/stop |
|
menu/apps |
|
menu/arrow_down |
|
menu/arrow_left |
|
menu/arrow_right |
|
menu/arrow_up |
|
menu/chat |
|
menu/clock |
|
menu/close |
|
menu/delete |
|
menu/edit |
|
menu/file |
|
menu/folder |
|
menu/home |
|
menu/refresh |
|
photo/no_photo |
|
toolbar/apps |
|
toolbar/arrow_down |
|
toolbar/arrow_left |
|
toolbar/arrow_right |
|
toolbar/arrow_up |
|
toolbar/chat |
|
toolbar/clock |
|
toolbar/close |
|
toolbar/delete |
|
toolbar/edit |
|
toolbar/file |
|
toolbar/folder |
|
toolbar/home |
|
toolbar/more_menu |
|
toolbar/refresh |
Callbacks
You can register callback functions connected to the following signals for an icon object.
Table: Icon callback signals
Signal | Description | event_info |
---|---|---|
thumb,done |
The elm_icon_thumb_set() function is completed with success. |
NULL |
thumb,error |
The elm_icon_thumb_set() function fails. |
NULL |