Mobile native Wearable native

Handling Edje Files

This tutorial demonstrates how you can manage EDJ files. An EDJ file is a specific eet file that collects layouts. The Edje layout is called Style and created using the EDC language. The file that contains the layout collection called Theme.

Initializing the Application

The following example shows a typical Elementary application that creates a window entitled Genlist Basic Tutorial. It is consisted of a conformant widget that contains a naviframe widget. The genlist goes inside the naviframe.

static void
create_base_gui(appdata_s *ad)
{
   char edj_path[PATH_MAX] = {0, };

   // Window
   ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE);
   elm_win_conformant_set(ad->win, EINA_TRUE);
   elm_win_autodel_set(ad->win, EINA_TRUE);

   if (elm_win_wm_rotation_supported_get(ad->win)) 
   {
      int rots[4] = {0, 90, 180, 270};
      elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4);
   }
   evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, ad);

   // Conformant
   ad->conform = elm_conformant_add(ad->win);
   elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW);
   elm_win_indicator_opacity_set(ad->win, ELM_WIN_INDICATOR_OPAQUE);
   evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
   elm_win_resize_object_add(ad->win, ad->conform);
   evas_object_show(ad->conform);

   // Naviframe
   ad->navifr = elm_naviframe_add(ad->win);
   elm_object_content_set(ad->conform, ad->navifr);
   eext_object_event_callback_add(ad->navifr, EEXT_CALLBACK_BACK, eext_naviframe_back_cb, ad);

   // Genlist
   ad->itc = elm_genlist_item_class_new();
   ad->itc->func.text_get =_genlist_item_text_get;

   ad->genlist = elm_genlist_add(ad->win);
   evas_object_size_hint_weight_set(ad->genlist, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
   elm_naviframe_item_simple_push(ad->navifr, ad->genlist);

   // Show window after base GUI is set up
   evas_object_show(ad->win);
}

static bool
app_create(void *data)
{
   // Initialize UI resources and application data
   // If this function returns true, the main loop of application starts
   // If this function returns false, the application is terminated
   appdata_s *ad = data;

   create_base_gui(ad);

   return true;
}

Declare the struct appdata:

typedef struct appdata
{
   Evas_Object *win;
   Evas_Object *conform;
   Evas_Object *navifr;
   Evas_Object *genlist;
   Eina_List *list;
   Elm_Genlist_Item_Class *itc;
} 
appdata_s;

Loading the Collection List from an EDJ File

Edje provides the functionality to manipulate the EDJ files. First, get the list of styles from EDJ file:

// Get the collection list from the EDJ file
app_get_resource(EDJ_FILE, edj_path, (int)PATH_MAX);
ad->list = edje_file_collection_list(edj_path);

When you do not use the collection list, delete it:

static void
win_delete_request_cb(void *data, Evas_Object *obj, void *event_info)
{
   appdata_s *ad = data;
   // Free the collection list
   edje_file_collection_list_free(ad->list);
   ui_app_exit();
}
Note
The list returned after using the edje_file_collection_list() function must only be deleted using the edje_file_collection_list_free() function.

Add the item in the genlist to display the list:

EINA_LIST_FOREACH(ad->list, l, str)
{
   elm_genlist_item_append(ad->genlist, ad->itc, str, NULL, ELM_GENLIST_ITEM_NONE, _genlist_clicked, ad);
}

Creating an Edje Object

Implement callbacks for the clicked (tapped) event. Check that the required style exists using the edje_file_group_exists() function. The first argument is the path to EDJ file and style name. Create the Edje object and load the given style.

static void
_genlist_clicked(void *data, Evas_Object *obj, void *event_info)
{
   appdata_s *ad = data;
   Elm_Object_Item *eoi = NULL;
   const char *str;
   char edj_path[PATH_MAX] = {0, };
   Evas_Object *edje_object;

   app_get_resource(EDJ_FILE, edj_path, (int)PATH_MAX);
   eoi = elm_genlist_selected_item_get(obj);

   str = elm_object_item_part_text_get(eoi, "elm.text");
   // Check whether a group matching glob exists in an edje file
   // If there is no matching group
   if (!edje_file_group_exists(edj_path, str)) return;

   // Load the given style to the object
   edje_object = edje_object_add(evas_object_evas_get(ad->win));
   edje_object_file_set(edje_object, edj_path, str);
   // Check object loading errors
   if (edje_object_load_error_get(edje_object) != EDJE_LOAD_ERROR_NONE)
   {
      evas_object_del(edje_object);

      return;
   }
   evas_object_size_hint_weight_set(edje_object, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
   elm_naviframe_item_simple_push(ad->navifr, edje_object);
}
Go to top