Languages

Menu
Sites
Language
Does anybody know why the (Circle) UI Components / src / index.c works at all?

File in question is https://developer.tizen.org/development/sample/native/UI/%28Circle%29_UI_Components/src/index.c. This file is part of the Circle UI component from here: https://developer.tizen.org/development/sample/native/UI/%28Circle%29_UI_Components.

I'm especially interested in the

_create_view_layout

function, especially this part:

    /* Create Pages */
	if (even_num)
		max_items = NUM_INDEX_CIRCLE_EVEN;
	else
		max_items = NUM_ITEMS;
	for (i = 0; i < max_items; ++i)
	{
		page_layout = elm_layout_add(box);
		pd->page_layout[i] = page_layout;
		evas_object_size_hint_weight_set(page_layout, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
		evas_object_size_hint_align_set(page_layout, 0, EVAS_HINT_FILL);
		elm_layout_theme_set(page_layout, "layout", "body_thumbnail", "default");
		evas_object_show(page_layout);
 
		img = elm_image_add(page_layout);
		snprintf(img_path, sizeof(img_path), "%s/100_%d.jpg", ICON_DIR, (i % 6) + 1);
		elm_image_file_set(img, img_path, NULL);
		elm_object_part_content_set(page_layout, "elm.icon", img);
 
		/* Make unselect state all of the pages except first one */
		if (i)
			elm_object_signal_emit(page_layout, "elm,state,thumbnail,unselect", "elm");
 
		elm_box_pack_end(box, page_layout);
	}

How does it work? Why does it work?

The documentation has nothing on "body_thumbnail/default" theme.

The documentation also has nothing on "elm,state,thumbnail,unselect" signal.

The entire sample project does not have anything that handles this signal, so it must be done internally. But by who? And what is that signal supposed to do? Why does this code work at all? (I tried the code - it indeed works).

 

I mean this is an example project, so it is meant to teach us. Why does an example uses an undocumented code which we can't even learn from ???
 

Edited by: James B on 08 Mar, 2017

Responses

1 Replies
Armaan-Ul- Islam

Hello James,

I have also been through such difficulties. Can't say I've got full understanding now, but anyways I'm sharing my findings with you (in code comments):

 

if (even_num)
    	max_items = NUM_INDEX_CIRCLE_EVEN;    // marco for '6'
	else
		max_items = NUM_ITEMS;       // marco for '5'

	for (i = 0; i < max_items; ++i)     // adding 5 images one after another
	{
		page_layout = elm_layout_add(box);   // add new layout on box
		pd->page_layout[i] = page_layout;    // adding data to structure *appdata(pagedata)
                                                                                                                                             // pd->page_layout[0],pd->page_layout[1],.......pd->page_layout[5]
	        
                evas_object_size_hint_weight_set(page_layout, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND); // Expand  macro for '1'
		evas_object_size_hint_align_set(page_layout, 0, EVAS_HINT_FILL);                   //Fill macro for '- 1' 
		elm_layout_theme_set(page_layout, "layout","body_thumbnail","default");           
                                                      //  theme group name, naming convention by developer
		evas_object_show(page_layout);        // show page layout

		img = elm_image_add(page_layout);    //add image on layout
		snprintf(img_path, sizeof(img_path), "%s/100_%d.jpg", ICON_DIR, (i % 6) +1);                                 
                                                      //add images 100_1,100_2,...100_5 from res>images folder based on 'i'
		elm_image_file_set(img, img_path, NULL); // set image from file
		elm_object_part_content_set(page_layout, "elm.icon", img); 
                                                      // set the image on layout with  nameof the 'part', naming convention by developer
		/* Make unselect state all of the pages except first one */
		if (i)
			elm_object_signal_emit(page_layout, "elm,state,thumbnail,unselect", "elm");
                                                      //emit signal, can be used as flag for developer
		elm_box_pack_end(box, page_layout);   //pack the layout at end of the box (layout sequence: 5 4 3 2 1 0) 
	}

 

UI structure:

[ box [ layout5[ img100_5] ] [ layout4[ img100_4] ]  [ layout3[ img100_3] ] [ layout2[ img100_2] ] [ layout1[ img100_1] ] [ layout0[ img100_0] ] ]

As far as I've seen in elm_layout_theme_set ( Evas_Object * obj, const char * clas, const char * group, const char * style ) these const char* are the name of the class,group,style (similar EDC ) named by the developer as he wants to (like Java class, css class name), same for elm_object_part_content_set( Evas_Object * obj, const char * part, Evas_Object * content ), the const char* means name of the part. (may be used for further identification or calling)

 

elm_layout_signal_emit() and elm_object_signal_callback_add() function is to be used by the developer to emit a signal and change the code flow to callback, sounds a good tool to use.

 

You might like to check out these links:

https://developer.tizen.org/ko/forums/native-application-development/what-value-can-be-set-group-parameter-elm_layout_theme_set?langswitch=en

https://developer.tizen.org/dev-guide/native/2.3.0/org.tizen.mobile.native.apireference/group__Layout.html#gabce6e0211b610437487c432bd536f8ca

https://developer.tizen.org/dev-guide/native/2.3.0/org.tizen.mobile.native.apireference/group__General.html#ga0531ec8867c72def7c780601764ca642

https://developer.tizen.org/dev-guide/native/2.3.0/org.tizen.mobile.native.apireference/group__General.html#ga1beada7edf5d714c0dba5459bcc993fc

https://developer.tizen.org/dev-guide/native/2.3.0/org.tizen.mobile.native.apireference/group__General.html#ga6f9574b798efcd454afdac6f2904f633