Search code examples
tizentizen-native-app

Customizing 1text item in genlist - and receive highlighted signal

On the Tizen OS, there is a nice genlist style 1text. It creates a "magnifier" effect on the list, ie: top and bottom items are smaller then the one in the middle:

enter image description here

And they are smoothly coming larger as user moves them into the middle.

I wanted to customize the genlist's item style, so I searched online, and have created myownlistitem.

My goal is to make the text red immediately when the item is highlighted (ie. brought into the middle). To be sure the program is using my layout, I've made the text's color purple by default:

group { "elm/genlist/item/myownlistitem/default";
  data.item: "texts" "elm.text";

  parts {
      rect { "elm.spacer";
        scale: 1;
        mouse_events: 1;
        desc { "default";
           min: 0 100;
        }            
      } 
      text { "elm.text";
        desc { "default";
            color: 255 0 255 255; // to be purple by default
            text.size: 28;
        }
        desc { "highlighted";
            inherit: "default";
            color: 255 0 0 255; // to be red
        }
      }
  }

  programs {
      program { name: "myownlistitem_highlighted";
         signal: "elm,state,highlighted";
         source: "elm";
         action: STATE_SET "highlighted" 0;
         target: "elm.text"
      }
      program { name: "myownlistitem_unhighlighted";
         signal: "elm,state,unhighlighted";
         source: "elm";
         action: STATE_SET "default";
         target: "elm.text"
      }     
  }
}

This is very nice, works as intended:

enter image description here

But as you can see, I have lost the magnifier effect of 1text.

So I went one bit further and changed back the list items' class to 1text, and in listItemClass->func.content_get:

Evas_Object* UI::getListItemContent(void* data, Evas_Object* obj, const char* part) {
  Evas_Object* item = elm_layout_add(obj);
  elm_layout_file_set(mylayout.edj, "elm/genlist/item/myownlistitem/default");
  elm_object_part_text_set(item, "elm.text", "Demo");

  return item;
}

It is actually working, magnifier effect stayed:

enter image description here

But my layout is no longer getting the highlighted and unhighlightedsignals. I tried a lot of things from C code (*_signal_callback_add) but never been able to receive these signals anymore.

How can I get these signals in my layout when applying it to keep the magnifier effect too?

Solution

  • Magnifier effect, aka Fish-Eye effect is designed for internal feature. it was not meant to be open in public to the application developers, so tizen does not have official way to turn it on/off in user side.

    but, internally there is some data in edc which turn on/off this effect in each item styles which can be changed in the futures as I said it is not official.

    see the 1text style,

    group { "elm/genlist/item/1text/default";
                                                                                                                                                                                                           
  data.item: "flips" "elm.flip.icon elm.flip.content";
  data.item: "texts" "elm.text";
  data.item: "focus_bg" "on";
  data.item: "contents" "elm.swallow.center_check";
  // 'vi_effect' data can determine fisheye effect.
  // 'on' : enable item resize effect depending on their distance from center position.
  // 'off': disable the effect and item size will not changed by it's position. this is default value.
  data.item: "vi_effect" "on";
  //'highlight_direct' do not use transition at item highlight
  data.item: "highlight_direct" "on";
  //

    vi_effect and highlight_direct data.item is what you desire. normally changing item's text is very easy by using html-tag in textblock string, but genlist does not sending any highlight event callback for now, so this is the way you can apply.