Languages

Menu
Sites
Language
edc group with two text part with dynamic width in one line

Hi,

I am define a edc group with two text part, I want to put them in a line, and its width should be resized base on its content, the second text part should be following closely with the first text part. Them should be looks like: "Hello""world", or "Hi""World", the position of "world" should be related to the "Hello" or "Hi"

I can't find a way in edc to implement it, help! Thanks for any advice.

group { 
        name: "doubletextlabel";
        parts{
            part{
                name: "bg";
                type: RECT;
                scale: 1;
                description {
                    state: "default" 0.0;
                    rel1 { relative: 0.0 0.0; }
                    rel2 { relative: 1.0 1.0; }
                    color: 36 65 98 255;
                }
            }
            part{
                name: "text.head";
                type: TEXT;
                scale: 1;
                description {
                    state: "default" 0.0;
                    rel1 { relative: 0.0 0.0; }
                    rel2 { relative: 0.5 1.0; }
                    text {
                        font: "Tizen:style=Regular";
                        size: 26;
                        min: 1 1;
                        align: 0.5 0.5;
                    }
                    color: 255 255 255 255;
                }
            }
            part{
                name: "text.end";
                type: TEXT;
                scale: 1;
                description {
                    state: "default" 0.0;
                    rel1 { relative: 0.5 0.0; }
                    rel2 { relative: 1.0 1.0; }
                    text {
                        font: "Tizen:style=Regular";
                        size: 26;
                        min: 1 1;
                        align: 0.5 0.5;
                    }
                    color: 255 255 255 255;
                }
            }
        }
        programs {
            program {
                name: "headclick";
                source: "text.head";
                signal: "mouse,clicked,1";
                action:  SIGNAL_EMIT "text,click" "edj,text.head";
            }
            program {
                name: "endclick";
                source: "text.end";
                signal: "mouse,clicked,1";
                action:  SIGNAL_EMIT "text,click" "edj,text.end";
            }
        } //end programs
    }

 

List

Responses

12 Replies
Ashwini Kumar

Hi,

How about aliging your first text "Hello" at 1.0,0.5 and second text "World" at 0.0 0.5.

-Ashwini

colin Rao

Hi, thanks!

As the screenshot,  the first part is "hi,", second part is "world". I want the width of the text part should be depend on the actual text content length, as below pic, I want the left space of "hi," to be cut. I need a way to implement it via edc.

Garik Bezruchko

UP!
Have the same problem, maybe some more ideas?

Vikram

it's very very very less of edje programming document, hope the Samsung can provide more training document regarding edje/EFL, it's the basis for tizen native app programming.

Carsten Haitzler

can you provide a diagram/sketch of what you want? i can't understand from the description.

colin Rao

Hi, thanks~

paste my screenshot here, the edc group as my first paste/comment.

the text "hi," is the first text part, and "world" is the second. what I expect layout? that's there shouldn't have space between "hi," and "world".

Carsten Haitzler

sorry put it here in reply - no image. broken image link here.

Carsten Haitzler

broken image. :(

colin Rao

:(, paste image into the site is very headache.

another way, paste my sample code here, that's you can try it by new a project and include the edc and sample code to check the result. :)

any way, thank you very much!!!

static Evas_Object*
test_doubletextlabel(appdata_s *ad)
{
    Evas_Object* _label;

	/* Naviframe */
	ad->naviframe = elm_naviframe_add(ad->conform);
	evas_object_show(ad->naviframe);

	_label = elm_label_add(ad->naviframe);
	elm_layout_file_set(_label, EDJ_FILE, "doubletextlabel");
	elm_object_part_text_set(_label, "text.head", "hi,");
	elm_object_part_text_set(_label, "text.end", "world");
	evas_object_size_hint_weight_set(_label, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
	evas_object_size_hint_align_set(_label, EVAS_HINT_FILL, EVAS_HINT_FILL);
	evas_object_size_hint_max_set(_label, 80, 30);
	evas_object_show(_label);

	elm_object_signal_callback_add(_label, "text,click", "edj,text.head", label_click_cb, (void*)ad);
	elm_object_signal_callback_add(_label, "text,click", "edj,text.end", label_click_cb, (void*)ad);

	elm_naviframe_item_push(ad->naviframe, "double text label", NULL, NULL, _label, NULL);
	return ad->naviframe;
}

 

Carsten Haitzler

Try this: I think this is what you want. you can test your edj designed with edje_player like:

edje_cc t.edc
edje_player t.edj -g=doubletextlabel

This should save you a lot of time. It's what I do when trying out ideas... so here is the demo edc in full. Note that i make the 2nd text part relative TO the first one. this is a core feature od edc that you need to know/use to have things layour relative TO eachother. i made the first one "zero sized" horizontally (relative to the ssme point) and set alignment to 0.0 and rely on the text.min property to expand the part by its minimum size (width) being the min width of the text.

​collections {
group { name: "doubletextlabel";
   parts{
      part{ name: "bg"; type: RECT;
         scale: 1;
         description { state: "default" 0.0;
            rel1 { relative: 0.0 0.0; }
            rel2 { relative: 1.0 1.0; }
            color: 36 65 98 255;
         }
      }
      part { name: "text.head"; type: TEXT;
         scale: 1;
         description { state: "default" 0.0;
            rel1 { relative: 0.0 0.0; }
            rel2 { relative: 0.0 1.0; }
            align: 0.0 0.5;
            text { font: "Tizen:style=Regular"; size: 26;
               min: 1 1;
               align: 0.0 0.5;
               text: "Hello";
            }
            color: 255 255 255 255;
         }
      }
      part { name: "text.end"; type: TEXT;
         scale: 1;
         description { state: "default" 0.0;
            rel1 {
               relative: 1.0 0.0;
               to_x: "text.head";
            }
            rel2 { relative: 1.0 1.0; }
            align: 0.0 0.5;
            text { font: "Tizen:style=Regular"; size: 26;
               min: 1 1;
               align: 0.0 0.5;
               text: "World";
            }
            color: 255 255 255 255;
         }
      }
   }
   programs {
      program { name: "headclick";
         source: "text.head";
         signal: "mouse,clicked,1";
         action:  SIGNAL_EMIT "text,click" "edj,text.head";
      }
      program { name: "endclick";
         source: "text.end";
         signal: "mouse,clicked,1";
         action:  SIGNAL_EMIT "text,click" "edj,text.end";
      }
   }
}
}

 

 
 
colin Rao

Hi,

Thanks!!! very much. It solved my issue.

One more thing, did you have any edc programming doc/material, I am very appriciate!!!

Carsten Haitzler

https://docs.enlightenment.org/auto/edje/edcref.html

http://cuddletech.com/edje/

 

and there is just literally mountains of sample edc (look here and in sub directories)

https://git.enlightenment.org/core/elementary.git/tree/data/themes

https://git.enlightenment.org/apps/terminology.git/tree/data/themes

https://git.enlightenment.org/apps/rage.git/tree/data/themes