[Toolbar] disable transition_animation_on
[platform/core/uifw/efl-theme-tizen.git] / themes / widgets / toolbar.edc
index 6b4bfbd..47f479b 100644 (file)
 
 #define ITEM_STATE_ENABLED 0
 #define ITEM_STATE_DISABLED 1
+#define TOOLBAR_SLIDING_PER_FPS     2
+#define TOOLBAR_SLIDING_FPS         40.0
+#define TOOLBAR_SLIDING_TEXT_GAP    40
+#define TOOLBAR_SLIDING_TEXT_OFFSET 5
 
 #define TOOLBAR_TEXT_STYLE(_font_size) \
    style { name: "toolbar_text_style_"_font_size; \
-      base: "font=Tizen:style=Medium style=far_shadow,bottom shadow_color=#ffffffff font_size="_font_size" align=center color="TABBAR_ITEM_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=-10"; \
+      base: "font=Tizen:style=Bold style=far_shadow,bottom shadow_color=#000000be font_size="_font_size" align=center color="TOOLBAR_ITEM_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=0"; \
+      tag: "br" "\n"; \
+      tag: "ps" "ps"; \
+      tag: "hilight" "+ font=Tizen:style=Bold"; \
+      tag: "b" "+ font=Tizen:style=Bold"; \
+      tag: "tab" "\t"; \
+   }
+
+#define TABBAR_TEXT_STYLE(_font_size) \
+   style { name: "tabbar_text_style_"_font_size; \
+      base: "font=Tizen:style=Bold style=far_shadow,bottom shadow_color=#000000ff font_size="_font_size" align=center color="TABBAR_ITEM_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=0"; \
       tag: "br" "\n"; \
       tag: "ps" "ps"; \
       tag: "hilight" "+ font=Tizen:style=Bold"; \
@@ -32,7 +46,7 @@
 
 #define TOOLBAR_SELECTED_TEXT_STYLE(_font_size) \
    style { name: "toolbar_selected_text_style_"_font_size; \
-      base: "font=Tizen:style=Medium style=far_shadow,bottom shadow_color=#ffffffff font_size="_font_size" align=center color="TABBAR_ITEM_SELECTED_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=-10"; \
+      base: "font=Tizen:style=Bold style=far_shadow,bottom shadow_color=#000000ff font_size="_font_size" align=center color="TABBAR_ITEM_SELECTED_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=0"; \
       tag: "br" "\n"; \
       tag: "ps" "ps"; \
       tag: "hilight" "+ font=Tizen:style=Bold"; \
    }
 
 styles{
-   TOOLBAR_TEXT_STYLE(24)
-   TOOLBAR_TEXT_STYLE(28)
-   TOOLBAR_TEXT_STYLE(30)
-   TOOLBAR_SELECTED_TEXT_STYLE(24)
-   TOOLBAR_SELECTED_TEXT_STYLE(28)
-   TOOLBAR_SELECTED_TEXT_STYLE(30)
+   TABBAR_TEXT_STYLE(30)
+   TOOLBAR_TEXT_STYLE(36)
 }
 
 group { name: "elm/toolbar/base/default";
+   data {
+      item: "focus_highlight" "on";
+   }
+   images {
+       image: "00_toolbar_bg.png" COMP;
+   }
    parts {
       part { name: "base";
          type: RECT;
          mouse_events: 1;
          description { state: "default" 0.0;
-            color: 248 246 239 255;
+         }
+      }
+      part { name: "base_bg";
+         type: IMAGE;
+         scale: 1;
+         description {
+            state: "default" 0.0;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "base";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "base";
+            }
+            image {
+                normal: "00_toolbar_bg.png";
+                border: TOOLBAR_ITEM_BG_DEFAULT_BORDER_INC;
+                border_scale: 1;
+            }
          }
       }
       part { name: "clipper";
@@ -64,12 +99,12 @@ group { name: "elm/toolbar/base/default";
          description {
             state: "default" 0.0;
             rel1 {
+               relative: 0.0 0.0;
                to: "base";
-               offset: 2 2;
             }
             rel2 {
+               relative: 1.0 1.0;
                to: "base";
-               offset: -3 -3;
             }
          }
       }
@@ -95,44 +130,35 @@ group { name: "elm/toolbar/base/default";
 
 group { name: "elm/toolbar/item/default";
    images {
-      image: "00_tab_press.png" COMP;
+      image: "00_toolbar_press.png" COMP;
+      image: "00_tab_focus.png" COMP;
    }
 
-   data.item: "transition_animation_on" "1";
+   data.item: "transition_animation_on" "0";
    script {
       public item_state = ITEM_STATE_ENABLED;
       public items_number = 0;
    }
    parts {
       part { name: "bg";
+         type: IMAGE;
+         scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0;
             visible: 0;
-            color: 255 255 255 0;
-            rel1 {
-               relative: 0.0 0.0;
-               offset: TOOLBAR_ITEM_BG_REL1_OFFSET_INC;
-            }
-            rel2 {
-               relative: 1.0 1.0;
-               offset: TOOLBAR_ITEM_BG_REL2_OFFSET_INC;
-            }
             image {
-               normal: "00_tab_press.png";
+               normal: "00_toolbar_press.png";
                border: TOOLBAR_ITEM_BG_SELECTED_BORDER_INC;
+               border_scale: 1;
             }
-            image.middle: SOLID;
-            fill.smooth: 0;
          }
          description { state: "selected" 0.0;
             inherit: "default" 0.0;
             visible: 1;
-            color: 255 255 255 255;
          }
          description { state: "disabled" 0.0;
             inherit: "default" 0.0;
             visible: 0;
-            color: 255 255 255 0;
          }
       }
       part { name: "padding_left_top";
@@ -142,11 +168,23 @@ group { name: "elm/toolbar/item/default";
          description { state: "default" 0.0;
             align: 0.0 0.0;
             rel2.relative: 0.0 0.0;
-            min: 10 8;
+            min: 0 0;
             fixed: 1 1;
-            visible: 1;
+            visible: 0;
             color: 0 0 0 0;
          }
+         description { state: "1_item" 0.0;
+            inherit: "default" 0.0;
+            min: 60 0;
+         }
+         description { state: "2_items" 0.0;
+            inherit: "default" 0.0;
+            min: 40 0;
+         }
+         description { state: "3_items" 0.0;
+            inherit: "default" 0.0;
+            min: 20 0;
+         }
       }
       part { name: "padding_right_bottom";
          type: RECT;
@@ -155,190 +193,22 @@ group { name: "elm/toolbar/item/default";
          description { state: "default" 0.0;
             align: 1.0 1.0;
             rel1.relative: 1.0 1.0;
-            min: 10 5;
-            fixed: 1 1;
-            visible: 1;
-            color: 0 0 0 0;
-         }
-      }
-      part {
-         name: "icon_rect";
-         type: RECT;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
             min: 0 0;
-            fixed: 0 1;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 1.0;
-               to_x: "padding_right_bottom";
-               to_y: "padding_left_top";
-            }
-            align: 0.5 0.0;
-            color: 0 0 0 0;
-         }
-         description { state: "visible" 0.0;
-            min: TABBAR_ITEM_ICON_SIZE_INC;
-            fixed: 0 1;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 1.0;
-               to_x: "padding_right_bottom";
-               to_y: "padding_left_top";
-            }
-            align: 0.5 0.0;
+            fixed: 1 1;
+            visible: 0;
             color: 0 0 0 0;
          }
-         description { state: "icononly" 0.0;
+         description { state: "1_item" 0.0;
             inherit: "default" 0.0;
+            min: 60 0;
          }
-      }
-      part { name: "padding_after_icon";
-         type: RECT;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0; //when only icon or no icon is there
-            align: 0.0 0.0;
-            rel1 {
-               relative: 0.0 1.0;
-               to: "icon_rect";
-            }
-            rel2.to: "icon_rect";
-            fixed: 0 1;
-            min: 0 0;
-            color: 0 0 0 0;
-         }
-         description { state: "visible" 0.0;
+         description { state: "2_items" 0.0;
             inherit: "default" 0.0;
+            min: 40 0;
          }
-         description { state: "icononly" 0.0;
+         description { state: "3_items" 0.0;
             inherit: "default" 0.0;
-         }
-      }
-      part { name: "padding_before_text";
-         type: RECT;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0; //when only icon or no icon is there
-            align: 0.5 1.0;
-            rel1 {
-               relative: 1.0 0.0;
-               to_x: "padding_left_top";
-               to_y: "elm.text";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to_x: "padding_right_bottom";
-               to_y: "elm.text";
-            }
-            fixed: 0 1;
-            min: 0 0;
-            color: 0 0 0 0;
-         }
-      }
-      part { name: "elm.swallow.icon";
-         type: SWALLOW;
-         scale: 1;
-         clip_to: "elm.icon.clipper";
-         description { state: "default" 0.0;
-            visible: 0;
-            align: 0.5 0.0;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 1.0;
-               to_x: "padding_right_bottom";
-               to_y: "padding_left_top";
-            }
-            fixed: 0 1;
-         }
-         description { state: "visible" 0.0;
-            fixed: 0 1;
-            min: TABBAR_ITEM_ICON_SIZE_INC;
-            max: TABBAR_ITEM_ICON_SIZE_INC;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to_x: "padding_right_bottom";
-               to_y: "padding_before_text";
-            }
-            aspect: 1.0 1.0;
-            aspect_preference: HORIZONTAL;
-         }
-         description { state: "icononly" 0.0;
-            min: TABBAR_ITEM_ICON_SIZE_INC;
-            max: TABBAR_ITEM_ICON_SIZE_INC;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to: "padding_right_bottom";
-            }
-            aspect: 1.0 1.0;
-            aspect_preference: HORIZONTAL;
-         }
-      }
-      part { name: "elm.swallow.icon_new";
-         type: SWALLOW;
-         scale: 1;
-         clip_to: "elm.icon_new.clipper";
-         description { state: "default" 0.0;
-            visible: 0;
-            align: 0.5 0.0;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 1.0;
-               to_x: "padding_right_bottom";
-               to_y: "padding_left_top";
-            }
-            fixed: 0 1;
-         }
-         description { state: "visible" 0.0;
-            fixed: 0 1;
-            min: TABBAR_ITEM_ICON_SIZE_INC;
-            max: TABBAR_ITEM_ICON_SIZE_INC;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to_x: "padding_right_bottom";
-               to_y: "padding_before_text";
-            }
-            aspect: 1.0 1.0;
-            aspect_preference: HORIZONTAL;
-         }
-         description { state: "icononly" 0.0;
-            min: TABBAR_ITEM_ICON_SIZE_INC;
-            max: TABBAR_ITEM_ICON_SIZE_INC;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to: "padding_right_bottom";
-            }
-            aspect: 1.0 1.0;
-            aspect_preference: HORIZONTAL;
+            min: 20 0;
          }
       }
       part { name: "elm.text";
@@ -350,17 +220,16 @@ group { name: "elm/toolbar/item/default";
             visible: 0;
             rel1 {
                relative: 1.0 1.0;
-               to_x: "padding_left_top";
-               to_y: "padding_after_icon";
+               to: "padding_left_top";
             }
             rel2 {
                relative: 0.0 0.0;
                to: "padding_right_bottom";
             }
-            color: BUTTON_NAVIFRAME_DEFAULT_TEXT_COLOR_INC;
             fixed: 1 1;
+            max: 9999 60;
             text {
-               style: "toolbar_text_style_26";
+               style: "toolbar_text_style_36";
                min: 0 1;
             }
          }
@@ -368,21 +237,6 @@ group { name: "elm/toolbar/item/default";
             inherit: "default" 0.0;
             visible: 1;
          }
-         description { state: "visible_30" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_30";
-            visible: 1;
-         }
-         description { state: "visible_32" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_32";
-            visible: 1;
-         }
-         description { state: "visible_36" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_36";
-            visible: 1;
-         }
       }
       part { name: "elm.text_new";
          type: TEXTBLOCK;
@@ -393,8 +247,7 @@ group { name: "elm/toolbar/item/default";
             visible: 0;
             rel1 {
                relative: 1.0 1.0;
-               to_x: "padding_left_top";
-               to_y: "padding_after_icon";
+               to: "padding_left_top";
             }
             rel2 {
                relative: 0.0 0.0;
@@ -403,7 +256,7 @@ group { name: "elm/toolbar/item/default";
             color: BUTTON_NAVIFRAME_DEFAULT_TEXT_COLOR_INC;
             fixed: 1 1;
             text {
-               style: "toolbar_text_style_26";
+               style: "toolbar_text_style_36";
                min: 0 1;
             }
          }
@@ -411,21 +264,6 @@ group { name: "elm/toolbar/item/default";
             inherit: "default" 0.0;
             visible: 1;
          }
-         description { state: "visible_30" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_30";
-            visible: 1;
-         }
-         description { state: "visible_32" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_32";
-            visible: 1;
-         }
-         description { state: "visible_36" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_36";
-            visible: 1;
-         }
       }
       part { name: "elm.text.clipper";
          type: RECT;
@@ -451,28 +289,53 @@ group { name: "elm/toolbar/item/default";
             color: 255 255 255 153;
          }
       }
-      part { name: "elm.icon.clipper";
+      part { name: "divider";
          type: RECT;
+         scale: 1;
          description { state: "default" 0.0;
-            color: 255 255 255 255;
-         }
-         description { state: "animation" 0.0;
-            color: 255 255 255 0;
+            min: 2 78;
+            max: 2 78;
+            fixed: 1 1;
+            rel1 {
+                relative: 1.0 0.5;
+            }
+            rel2 {
+                relative: 1.0 0.5;
+            }
          }
-         description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+         description { state: "hidden" 0.0;
+            inherit: "default" 0.0;
+            visible: 0;
          }
       }
-      part { name: "elm.icon_new.clipper";
+      part { name: "divider_left";
          type: RECT;
+         clip_to: "divider";
          description { state: "default" 0.0;
-            color: 255 255 255 0;
-         }
-         description { state: "animation" 0.0;
-            color: 255 255 255 255;
+            color: TABBAR_ITEM_DIVIDER_LEFT_COLOR_INC;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "divider";
+            }
+            rel2 {
+                relative: 0.5 1.0;
+                to: "divider";
+            }
          }
-         description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+      }
+      part { name: "divider_right";
+         type: RECT;
+         clip_to: "divider";
+         description { state: "default" 0.0;
+            color: TABBAR_ITEM_DIVIDER_RIGHT_COLOR_INC;
+            rel1 {
+                relative: 0.5 0.0;
+                to: "divider";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "divider";
+            }
          }
       }
       part { name: "event";
@@ -491,6 +354,22 @@ group { name: "elm/toolbar/item/default";
             color: 0 0 0 0;
          }
       }
+      part { name: "highlight";
+         type: IMAGE;
+         scale: 1;
+         description { state: "default" 0.0;
+            visible: 0;
+            image {
+                normal: "00_tab_focus.png";
+                border: 8 8 8 8;
+                border_scale: 1;
+            }
+         }
+         description { state: "highlighted" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+         }
+      }
    }
    programs {
       program { name: "pressed";
@@ -513,6 +392,10 @@ group { name: "elm/toolbar/item/default";
          signal:  "mouse,clicked,1";
          source:  "event";
          action:  SIGNAL_EMIT "elm,action,click" "elm";
+         after: "play_sound";
+      }
+      program { name: "play_sound";
+         action: PLAY_SAMPLE "touch_sound" 1.0;
       }
       program { name: "mouse,in";
          signal:  "mouse,in";
@@ -531,9 +414,7 @@ group { name: "elm/toolbar/item/default";
             set_int(item_state, ITEM_STATE_DISABLED);
             set_state(PART:"bg", "disabled", 0.0);
             set_state(PART:"elm.text.clipper", "disabled", 0.0);
-            set_state(PART:"elm.icon.clipper", "disabled", 0.0);
             run_program(PROGRAM:"label_set,animation,done");
-            run_program(PROGRAM:"icon_set,animation,done");
          }
       }
       program { name: "enable";
@@ -543,9 +424,7 @@ group { name: "elm/toolbar/item/default";
             set_int(item_state, ITEM_STATE_ENABLED);
             set_state(PART:"bg", "default", 0.0);
             set_state(PART:"elm.text.clipper", "default", 0.0);
-            set_state(PART:"elm.icon.clipper", "default", 0.0);
             run_program(PROGRAM:"label_set,animation,done");
-            run_program(PROGRAM:"icon_set,animation,done");
          }
       }
       program { name: "label_set,animation,forward";
@@ -574,418 +453,92 @@ group { name: "elm/toolbar/item/default";
          target: "elm.text.clipper";
          target: "elm.text_new.clipper";
          transition: LINEAR 0.2;
-         after: "label_set,animation,done";
-      }
-      program { name: "label_set,animation,done";
-         action: SIGNAL_EMIT "elm,state,label_set,done" "elm";
-      }
-      program { name: "label,reset";
-         signal: "elm,state,label,reset";
-         source: "elm";
-         script {
-            set_state(PART:"elm.text_new.clipper", "default", 0.0);
-            if (get_int(item_state) != ITEM_STATE_DISABLED)
-              set_state(PART:"elm.text.clipper", "default", 0.0);
-            else
-              set_state(PART:"elm.text.clipper", "disabled", 0.0);
-         }
-      }
-      program { name: "icon_set,animation,forward";
-         signal: "elm,state,icon_set,forward";
-         source: "elm";
-         after: "icon_set,animation";
-      }
-      program { name: "icon_set,animation,backward";
-         signal: "elm,state,icon_set,backward";
-         source: "elm";
-         after: "icon_set,animation";
-      }
-      program { name: "icon_set,animation";
-         signal: "elm,state,icon_set";
-         source: "elm";
-         action: STATE_SET "animation" 0.0;
-         target: "elm.icon.clipper";
-         target: "elm.icon_new.clipper";
-         transition: LINEAR 0.2;
-         after: "icon_set,animation,done";
-      }
-      program { name: "icon_set,animation,done";
-         action: SIGNAL_EMIT "elm,state,icon_set,done" "elm";
-      }
-      program { name: "icon,reset";
-         signal: "elm,state,icon,reset";
-         source: "elm";
-         script {
-            set_state(PART:"elm.icon_new.clipper", "default", 0.0);
-            if (get_int(item_state) != ITEM_STATE_DISABLED)
-              set_state(PART:"elm.icon.clipper", "default", 0.0);
-            else
-              set_state(PART:"elm.icon.clipper", "disabled", 0.0);
-         }
-      }
-      program { name: "text_show";
-         signal: "elm,state,text,visible";
-         source: "elm";
-         script {
-            new st[31];
-            new Float:vl;
-            get_state(PART:"elm.swallow.icon", st, 30, vl);
-            if (!strcmp(st, "icononly"))
-              {
-                 set_state(PART:"elm.swallow.icon", "visible", 0.0);
-                 set_state(PART:"icon_rect", "visible", 0.0);
-                 set_state(PART:"padding_after_icon", "visible", 0.0);
-              }
-            if (strcmp(st, "default"))
-              {
-                 set_state(PART:"elm.text", "visible", 0.0);
-              }
-            else
-              {
-                if (get_int(items_number) <= 3)
-                  set_state(PART:"elm.text", "visible_32", 0.0);
-                else if (get_int(items_number) >= 4)
-                  set_state(PART:"elm.text", "visible_30", 0.0);
-              }
-         }
-      }
-      program { name: "text_hide";
-         signal: "elm,state,text,hidden";
-         source: "elm";
-         script {
-            new st[31];
-            new Float:vl;
-            get_state(PART:"elm.swallow.icon", st, 30, vl);
-            if (!strcmp(st, "visible"))
-              {
-                 set_state(PART:"elm.swallow.icon", "icononly", 0.0);
-                 set_state(PART:"icon_rect", "icononly", 0.0);
-                 set_state(PART:"padding_after_icon", "icononly", 0.0);
-              }
-            set_state(PART:"elm.text", "default", 0.0);
-         }
-      }
-      program { name: "icon_show";
-         signal: "elm,state,icon,visible";
-         source: "elm";
-         script {
-            new st[31];
-            new Float:vl;
-            get_state(PART:"elm.text", st, 30, vl);
-            if (!strncmp(st, "visible", 7))
-              {
-                 set_state(PART:"elm.swallow.icon", "visible", 0.0);
-                 set_state(PART:"icon_rect", "visible", 0.0);
-                 set_state(PART:"padding_after_icon", "visible", 0.0);
-                 set_state(PART:"elm.text", "visible", 0.0);
-              }
-            else
-              {
-                 set_state(PART:"elm.swallow.icon", "icononly", 0.0);
-                 set_state(PART:"icon_rect", "icononly", 0.0);
-                 set_state(PART:"padding_after_icon", "icononly", 0.0);
-              }
-         }
-      }
-      program { name: "icon_hide";
-         signal: "elm,state,icon,hidden";
-         source: "elm";
-         script {
-            new st[31];
-            new Float:vl;
-            get_state(PART:"elm.text", st, 30, vl);
-            if (!strncmp(st, "visible", 7))
-              {
-                if (get_int(items_number) <= 3)
-                  set_state(PART:"elm.text", "visible_32", 0.0);
-                else if (get_int(items_number) >= 4)
-                  set_state(PART:"elm.text", "visible_30", 0.0);
-              }
-            set_state(PART:"elm.swallow.icon", "default", 0.0);
-            set_state(PART:"icon_rect", "default", 0.0);
-            set_state(PART:"padding_after_icon", "default", 0.0);
-         }
-      }
-      program { name: "text_only_item_1";
-         signal: "elm,number,item,1";
-         source: "elm";
-         script {
-            set_int(items_number, 1);
-         }
-         after: "text_only_item_under_3";
-      }
-      program { name: "text_only_item_2";
-         signal: "elm,number,item,2";
-         source: "elm";
-         script {
-            set_int(items_number, 2);
-         }
-         after: "text_only_item_under_3";
-      }
-      program { name: "text_only_item_3";
-         signal: "elm,number,item,3";
-         source: "elm";
-         script {
-            set_int(items_number, 3);
-         }
-         after: "text_only_item_under_3";
-      }
-      program { name: "text_only_item_under_3";
-         script {
-            new st[31];
-            new Float:vl;
-            get_state(PART:"elm.swallow.icon", st, 30, vl);
-            if (strcmp(st, "visible"))
-              {
-                get_state(PART:"elm.text", st, 30, vl);
-                if (!strncmp(st, "visible", 7))
-                  {
-                      set_state(PART:"elm.text", "visible_32", 0.0);
-                  }
-              }
-         }
+         after: "label_set,animation,done";
       }
-      program { name: "text_only_item_4";
-         signal: "elm,number,item,4";
-         source: "elm";
-         script {
-            set_int(items_number, 4);
-         }
-         after: "text_only_item_upper_4";
+      program { name: "label_set,animation,done";
+         action: SIGNAL_EMIT "elm,state,label_set,done" "elm";
       }
-      program { name: "text_only_item_5";
-         signal: "elm,number,item,5";
+      program { name: "label,reset";
+         signal: "elm,state,label,reset";
          source: "elm";
          script {
-            set_int(items_number, 5);
+            set_state(PART:"elm.text_new.clipper", "default", 0.0);
+            if (get_int(item_state) != ITEM_STATE_DISABLED)
+              set_state(PART:"elm.text.clipper", "default", 0.0);
+            else
+              set_state(PART:"elm.text.clipper", "disabled", 0.0);
          }
-         after: "text_only_item_upper_4";
       }
-      program { name: "text_only_item_6";
-         signal: "elm,number,item,6";
+      program { name: "text_show";
+         signal: "elm,state,text,visible";
          source: "elm";
          script {
-            set_int(items_number, 6);
+               set_state(PART:"elm.text", "visible", 0.0);
          }
-         after: "text_only_item_upper_4";
       }
-      program { name: "text_only_item_7";
-         signal: "elm,number,item,7";
+      program { name: "text_hide";
+         signal: "elm,state,text,hidden";
          source: "elm";
          script {
-            set_int(items_number, 7);
+            set_state(PART:"elm.text", "default", 0.0);
          }
-         after: "text_only_item_upper_4";
       }
-      program { name: "text_only_item_8";
-         signal: "elm,number,item,8";
+      program { name: "text_only_item_1";
+         signal: "elm,number,item,1";
          source: "elm";
          script {
-            set_int(items_number, 8);
+            set_int(items_number, 1);
+            set_state(PART:"padding_left_top", "1_item", 0.0);
+            set_state(PART:"padding_right_bottom", "1_item", 0.0);
          }
-         after: "text_only_item_upper_4";
       }
-      program { name: "text_only_item_9";
-         signal: "elm,number,item,9";
+      program { name: "text_only_item_2";
+         signal: "elm,number,item,2";
          source: "elm";
          script {
-            set_int(items_number, 9);
+            set_int(items_number, 2);
+            set_state(PART:"padding_left_top", "2_items", 0.0);
+            set_state(PART:"padding_right_bottom", "2_items", 0.0);
          }
-         after: "text_only_item_upper_4";
       }
-      program { name: "text_only_item_10";
-         signal: "elm,number,item,10";
+      program { name: "text_only_item_3";
+         signal: "elm,number,item,3";
          source: "elm";
          script {
-            set_int(items_number, 10);
+            set_int(items_number, 3);
+            set_state(PART:"padding_left_top", "3_items", 0.0);
+            set_state(PART:"padding_right_bottom", "3_items", 0.0);
          }
-         after: "text_only_item_upper_4";
       }
-      program { name: "text_only_item_upper_4";
-         signal: "elm,number,item,4";
+      program { name: "divider_visible_1";
+         signal: "elm,order,first,item";
          source: "elm";
-         script {
-            new st[31];
-            new Float:vl;
-            get_state(PART:"elm.swallow.icon", st, 30, vl);
-            if (strcmp(st, "visible"))
-              {
-                get_state(PART:"elm.text", st, 30, vl);
-                if (!strncmp(st, "visible", 7))
-                  {
-                      set_state(PART:"elm.text", "visible_30", 0.0);
-                  }
-              }
-         }
-      }
-   }
-}
-
-group { name: "elm/toolbar/item/item_horizontal";
-   inherit: "elm/toolbar/item/default";
-   parts {
-      part { name: "icon_rect";
-         description { state: "default" 0.0;
-            fixed: 1 0;
-            align: 0.0 0.5;
-         }
-         description { state: "visible" 0.0;
-            fixed: 1 0;
-            rel2 {
-               relative: 1.0 0.0;
-               to_x: "padding_left_top";
-               to_y: "padding_right_bottom";
-            }
-            align: 0.0 0.5;
-         }
-      }
-      part { name: "padding_after_icon";
-         description { state: "default" 0.0; //when only icon or no icon is there
-            rel1.relative: 1.0 0.0;
-            fixed: 1 1;
-         }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
-            min: 6 0;
-         }
-      }
-      part { name: "padding_before_text";
-         description { state: "default" 0.0; //when only icon or no icon is there
-            align: 1.0 0.5;
-            rel1 {
-               relative: 0.0 1.0;
-               to_x: "elm.text";
-               to_y: "padding_left_top";
-            }
-            rel2 {
-               to_x: "elm.text";
-               to_y: "padding_right_bottom";
-            }
-            fixed: 1 0;
-            min: 6 0;
-         }
+         action: STATE_SET "default" 0.0;
+         target: "divider";
       }
-      part { name: "elm.swallow.icon";
-         description { state: "default" 0.0;
-            align: 0.0 0.5;
-            rel2 {
-               relative: 1.0 0.0;
-               to_x: "padding_left_top";
-               to_y: "padding_right_bottom";
-            }
-            fixed: 1 0;
-         }
-         description { state: "visible" 0.0;
-            fixed: 1 0;
-            align: 1.0 0.5;
-            rel1 {
-               relative: 0.0 1.0;
-               to_x: "padding_before_text";
-               to_y: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to_x: "padding_before_text";
-               to_y: "padding_right_bottom";
-            }
-            aspect_preference: VERTICAL;
-         }
-         description { state: "icononly" 0.0;
-            aspect_preference: VERTICAL;
-         }
+      program { name: "divider_visible_2";
+         signal: "elm,order,default,item";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "divider";
       }
-      part { name: "elm.swallow.icon_new";
-         description { state: "default" 0.0;
-            align: 0.0 0.5;
-            rel2 {
-               relative: 1.0 0.0;
-               to_x: "padding_left_top";
-               to_y: "padding_right_bottom";
-            }
-            fixed: 1 0;
-         }
-         description { state: "visible" 0.0;
-            fixed: 1 0;
-            align: 1.0 0.5;
-            rel1 {
-               relative: 0.0 1.0;
-               to_x: "padding_before_text";
-               to_y: "padding_left_top";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to_x: "padding_before_text";
-               to_y: "padding_right_bottom";
-            }
-            aspect_preference: VERTICAL;
-         }
-         description { state: "icononly" 0.0;
-            aspect_preference: VERTICAL;
-         }
+      program { name: "divider_hidden";
+         signal: "elm,order,last,item";
+         source: "elm";
+         action: STATE_SET "hidden" 0.0;
+         target: "divider";
       }
-      part { name: "elm.text";
-         type: TEXTBLOCK;
-         description { state: "default" 0.0;
-            rel1 {
-               relative: 1.0 1.0;
-               to_x: "padding_after_icon";
-               to_y: "padding_left_top";
-            }
-            text {
-               min: 1 0;
-            }
-         }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-         description { state: "visible_30" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_30";
-            visible: 1;
-         }
-         description { state: "visible_32" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_32";
-            visible: 1;
-         }
-         description { state: "visible_36" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_36";
-            visible: 1;
-         }
+      program { name: "highlight_on";
+         signal: "elm,highlight,on";
+         source: "elm";
+         action: STATE_SET "highlighted" 0.0;
+         target: "highlight";
       }
-      part { name: "elm.text_new";
-         type: TEXTBLOCK;
-         description { state: "default" 0.0;
-            rel1 {
-               relative: 1.0 1.0;
-               to_x: "padding_after_icon";
-               to_y: "padding_left_top";
-            }
-            text {
-               min: 1 0;
-            }
-         }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-         description { state: "visible_30" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_30";
-            visible: 1;
-         }
-         description { state: "visible_32" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_32";
-            visible: 1;
-         }
-         description { state: "visible_36" 0.0;
-            inherit: "default" 0.0;
-            text.style: "toolbar_text_style_36";
-            visible: 1;
-         }
+      program { name: "highlight_off";
+         signal: "elm,highlight,off";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "highlight";
       }
    }
 }
@@ -996,8 +549,8 @@ group { name: "elm/toolbar/separator/default";
          type: RECT;
          scale: 1;
          description { state: "default" 0.0;
-            min: 4 26;
-            max: 4 9999;
+            min: 2 88;
+            max: 2 88;
             fixed: 1 1;
             rel1 {
                 relative: 0.5 0.5;
@@ -1052,9 +605,13 @@ group { name: "elm/toolbar/object/default";
 }
 
 group { name: "elm/toolbar/base/tabbar";
+   data {
+      item: "focus_highlight" "on";
+   }
    images {
       image: "00_effect_tab_bounce_left.png" COMP;
       image: "00_effect_tab_bounce_right.png" COMP;
+      image: "00_title_bg.png" COMP;
    }
    script {
       public left_timer, right_timer;
@@ -1074,7 +631,24 @@ group { name: "elm/toolbar/base/tabbar";
          type: RECT;
          scale: 1;
          description { state: "default" 0.0;
-            color: 248 246 239 255;
+         }
+      }
+      part { name: "base_bg";
+         type: IMAGE;
+         scale: 1;
+         description {
+            state: "default" 0.0;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "base";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "base";
+            }
+            image {
+                normal: "00_title_bg.png";
+            }
          }
       }
       part { name: "left_padding";
@@ -1083,7 +657,7 @@ group { name: "elm/toolbar/base/tabbar";
          scale: 1;
          description {
             state: "default" 0.0;
-            min: 16 0;
+            min: 0 0;
             fixed: 1 1;
             visible: 0;
             align: 0.0 0.5;
@@ -1099,7 +673,7 @@ group { name: "elm/toolbar/base/tabbar";
          scale: 1;
          description {
             state: "default" 0.0;
-            min: 16 0;
+            min: 0 0;
             fixed: 1 1;
             visible: 0;
             align: 1.0 0.5;
@@ -1254,15 +828,97 @@ group { name: "elm/toolbar/item/tabbar";
    images {
       image: "00_tab_press.png" COMP;
       image: "00_badge_bg.png" COMP;
-      image: "00_focus.png" COMP;
+      image: "00_tab_focus.png" COMP;
+      image: "00_tab_select_bar.png" COMP;
+      image: "00_effect_tab_text_dim_left.png" COMP;
+      image: "00_effect_tab_text_dim_right.png" COMP;
    }
 
-   data.item: "transition_animation_on" "1";
+   data.item: "transition_animation_on" "0";
    script {
       public item_state = ITEM_STATE_ENABLED;
       public items_number = 0;
-      public selected = 0;
-      public temp;
+      public sliding_timer;
+      public end_timer;
+      public text_w;
+      public org_text_w;
+      public loop_count = 0;
+
+      public get_width() {
+         new x, y, w, h;
+         set_state(PART:"elm.text", "visible", 0.0);
+         get_geometry(PART:"elm.text", x, y, w, h);
+         set_int(org_text_w, w);
+
+         set_state(PART:"elm.text", "sliding", 0.0);
+         get_geometry(PART:"elm.text", x, y, w, h);
+         set_int(text_w, w);
+      }
+      public ender(val) {
+         set_int(loop_count, 0);
+         if (get_int(sliding_timer)) cancel_timer(get_int(sliding_timer));
+         set_int(sliding_timer, 0);
+         if (get_int(end_timer)) cancel_timer(get_int(end_timer));
+         set_int(end_timer, 0);
+         set_state(PART:"elm.text.dim.left", "default", 0.0);
+         set_state(PART:"elm.text_new.clipper", "default", 0.0);
+         if (val == 1) {
+            custom_state(PART:"elm.text", "sliding", 0.0);
+            set_state_val(PART:"elm.text", STATE_REL1_OFFSET, TOOLBAR_SLIDING_TEXT_OFFSET, 0);
+            set_state_val(PART:"elm.text", STATE_REL2_OFFSET, TOOLBAR_SLIDING_TEXT_OFFSET, 0);
+            set_state(PART:"elm.text", "custom", 0.0);
+         } else {
+            set_state(PART:"elm.text", "visible", 0.0);
+            set_state(PART:"elm.text.dim.right", "default", 0.0);
+         }
+      }
+      public sliding(val) {
+         new buf[128];
+         if (val == TOOLBAR_SLIDING_TEXT_OFFSET) {
+            set_int(loop_count, get_int(loop_count) + 1);
+            get_width();
+            if (get_int(text_w) <= get_int(org_text_w)) {
+               ender(0);
+               return;
+            }
+         }
+         val -= TOOLBAR_SLIDING_PER_FPS;
+// for debuging //////////////////////////////
+/*         snprintf(buf, 127, "%d:%d:%d",
+            val, get_int(org_text_w), get_int(text_w));
+         set_text(PART:"dbg", buf);*/
+
+         if (val <= -get_int(text_w) - TOOLBAR_SLIDING_TEXT_GAP + TOOLBAR_SLIDING_TEXT_OFFSET)
+            val = TOOLBAR_SLIDING_TEXT_OFFSET;
+         custom_state(PART:"elm.text", "sliding", 0.0);
+         set_state_val(PART:"elm.text", STATE_REL1_OFFSET, val, 0);
+         set_state_val(PART:"elm.text", STATE_REL2_OFFSET, val, 0);
+         set_state(PART:"elm.text", "custom", 0.0);
+
+         set_state(PART:"elm.text_new.clipper", "animation", 0.0);
+         get_text(PART:"elm.text", buf, 128);
+         set_text(PART:"elm.text_new", buf);
+         custom_state(PART:"elm.text_new", "sliding", 0.0);
+         set_state_val(PART:"elm.text_new", STATE_REL1_OFFSET,
+            val + get_int(text_w) + TOOLBAR_SLIDING_TEXT_GAP, 0);
+         set_state_val(PART:"elm.text_new", STATE_REL2_OFFSET,
+            val + get_int(text_w) + TOOLBAR_SLIDING_TEXT_GAP, 0);
+         set_state(PART:"elm.text_new", "custom", 0.0);
+
+         set_state(PART:"elm.text.dim.left", "show", 0.0);
+         set_state(PART:"elm.text.dim.right", "show", 0.0);
+
+         if (val == TOOLBAR_SLIDING_TEXT_OFFSET || val <= -get_int(text_w))
+            set_state(PART:"elm.text.dim.left", "default", 0.0);
+
+         if (val == TOOLBAR_SLIDING_TEXT_OFFSET) {
+            if (get_int(loop_count) < 3)
+               set_int(sliding_timer, timer(2.0, "sliding", TOOLBAR_SLIDING_TEXT_OFFSET));
+            else
+               set_int(end_timer, timer(0.5, "ender", 1));
+         } else
+            set_int(sliding_timer, timer(1.0/TOOLBAR_SLIDING_FPS, "sliding", val));
+      }
    }
    parts {
       part { name: "bg";
@@ -1270,12 +926,38 @@ group { name: "elm/toolbar/item/tabbar";
          scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0;
-            min: 172 0;
+            min: 180 0;
             visible: 0;
          }
          description { state: "icon_text" 0.0;
             inherit: "default" 0.0;
-            min: 229 0;
+            min: 180 0;
+         }
+      }
+      part { name: "selected_line";
+         type: IMAGE;
+         scale: 1;
+         mouse_events: 0;
+         description { state: "default" 0.0;
+            rel1 {
+                relative: 0.0 1.0;
+            }
+            rel2 {
+                relative: 1.0 1.0;
+            }
+            image {
+                normal: "00_tab_select_bar.png";
+                border: 1 1 1 1;
+                border_scale: 1;
+            }
+            align: 0.0 1.0;
+            min: 0 10;
+            fixed: 0 1;
+            visible: 0;
+         }
+         description { state: "selected" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
          }
       }
       part { name: "bg_cover";
@@ -1284,7 +966,11 @@ group { name: "elm/toolbar/item/tabbar";
          mouse_events: 0;
          description { state: "default" 0.0;
             visible: 0;
-            image.normal: "00_tab_press.png";
+            image {
+               normal: "00_tab_press.png";
+               border: 0 0 8 0;
+               border_scale: 1;
+            }
          }
          description { state: "pressed" 0.0;
             inherit: "default" 0.0;
@@ -1302,7 +988,7 @@ group { name: "elm/toolbar/item/tabbar";
          description { state: "default" 0.0;
             align: 0.0 0.0;
             rel2.relative: 0.0 0.0;
-            min: 6 0;
+            min: 2 0;
             fixed: 1 1;
             visible: 0;
             color: 0 0 0 0;
@@ -1315,7 +1001,7 @@ group { name: "elm/toolbar/item/tabbar";
          description { state: "default" 0.0;
             align: 1.0 1.0;
             rel1.relative: 1.0 1.0;
-            min: 6 0;
+            min: 2 0;
             fixed: 1 1;
             visible: 0;
             color: 0 0 0 0;
@@ -1328,22 +1014,22 @@ group { name: "elm/toolbar/item/tabbar";
          mouse_events: 0;
          description { state: "default" 0.0;
             min: 0 0;
-            fixed: 1 0;
+            fixed: 0 1;
             rel1 {
                relative: 1.0 1.0;
                to: "padding_left_top";
             }
             rel2 {
-               relative: 1.0 0.0;
-               to_x: "padding_left_top";
-               to_y: "padding_right_bottom";
+               relative: 0.0 1.0;
+               to_x: "padding_right_bottom";
+               to_y: "padding_left_top";
             }
-            align: 0.0 0.5;
+            align: 0.5 0.0;
             color: 0 0 0 0;
          }
          description { state: "visible" 0.0;
             inherit: "default" 0.0;
-            min: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
+            min: TABBAR_ITEM_ICON_SIZE_INC;
          }
          description { state: "icononly" 0.0;
             inherit: "default" 0.0;
@@ -1354,19 +1040,19 @@ group { name: "elm/toolbar/item/tabbar";
          scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0; //when only icon or no icon is there
-            align: 0.0 0.0;
+            align: 0.5 0.0;
             rel1 {
-               relative: 1.0 0.0;
+               relative: 0.0 1.0;
                to: "icon_rect";
             }
             rel2.to: "icon_rect";
-            fixed: 1 0;
+            fixed: 0 1;
             min: 0 0;
             color: 0 0 0 0;
          }
          description { state: "visible" 0.0;
             inherit: "default" 0.0;
-            min: 1 0;
+            min: 0 1;
          }
          description { state: "icononly" 0.0;
             inherit: "default" 0.0;
@@ -1377,22 +1063,48 @@ group { name: "elm/toolbar/item/tabbar";
          scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0; //when only icon or no icon is there
-            align: 1.0 0.5;
+            align: 0.5 1.0;
             rel1 {
-               relative: 0.0 1.0;
-               to_x: "elm.text";
-               to_y: "padding_left_top";
+               relative: 1.0 0.0;
+               to_x: "padding_left_top";
+               to_y: "elm.text";
             }
             rel2 {
                relative: 0.0 0.0;
-               to_x: "elm.text";
-               to_y: "padding_right_bottom";
+               to_x: "padding_right_bottom";
+               to_y: "elm.text";
             }
-            fixed: 1 0;
-            min: 8 0;
+            fixed: 0 1;
+            min: 0 0;
             color: 0 0 0 0;
          }
       }
+      part { name: "elm.swallow.icon.proxy";
+         type: PROXY;
+         scale: 1;
+         clip_to: "elm.icon.proxy.clipper";
+         description { state: "default" 0.0;
+             source: "elm.swallow.icon";
+             proxy.source_clip: 0;
+             rel1.to: "elm.swallow.icon";
+             rel1.offset: 0 3;
+             rel2.to: "elm.swallow.icon";
+             rel2.offset: -1 2;
+         }
+      }
+      part { name: "elm.swallow.icon_new.proxy";
+         type: PROXY;
+         scale: 1;
+         clip_to: "elm.icon_new.proxy.clipper";
+         description { state: "default" 0.0;
+             source: "elm.swallow.icon_new";
+             proxy.source_clip: 0;
+             rel1.to: "elm.swallow.icon_new";
+             rel1.offset: 0 3;
+             rel2.to: "elm.swallow.icon_new";
+             rel2.offset: -1 2;
+         }
+      }
       part { name: "elm.swallow.icon";
          type: SWALLOW;
          scale: 1;
@@ -1401,25 +1113,29 @@ group { name: "elm/toolbar/item/tabbar";
             visible: 0;
             min: TABBAR_ITEM_ICON_SIZE_INC;
             max: TABBAR_ITEM_ICON_SIZE_INC;
-            rel1.to: "padding_left_top";
-            rel2.to: "padding_right_bottom";
+            rel1 {
+                to: "padding_left_top";
+            }
+            rel2 {
+                to: "padding_right_bottom";
+            }
             aspect: 1.0 1.0;
             aspect_preference: HORIZONTAL;
          }
          description { state: "visible" 0.0;
             fixed: 1 0;
-            min: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
-            max: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
-            align: 1.0 0.5;
+            min: TABBAR_ITEM_ICON_SIZE_INC;
+            max: TABBAR_ITEM_ICON_SIZE_INC;
+            align: 0.5 1.0;
             rel1 {
-               relative: 0.0 1.0;
-               to_x: "padding_before_text";
-               to_y: "padding_left_top";
+               relative: 1.0 0.0;
+               to_x: "padding_left_top";
+               to_y: "padding_before_text";
             }
             rel2 {
                relative: 0.0 0.0;
-               to_x: "padding_before_text";
-               to_y: "padding_right_bottom";
+               to_x: "padding_right_bottom";
+               to_y: "padding_before_text";
             }
             aspect: 1.0 1.0;
             aspect_preference: HORIZONTAL;
@@ -1443,18 +1159,18 @@ group { name: "elm/toolbar/item/tabbar";
             aspect_preference: HORIZONTAL;
          }
          description { state: "visible" 0.0;
-            fixed: 0 1;
-            min: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
-            max: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
+            fixed: 1 0;
+            min: TABBAR_ITEM_ICON_SIZE_INC;
+            max: TABBAR_ITEM_ICON_SIZE_INC;
             rel1 {
                relative: 0.0 1.0;
-               to_x: "padding_before_text";
-               to_y: "padding_left_top";
+               to_x: "padding_left_top";
+               to_y: "padding_before_text";
             }
             rel2 {
                relative: 0.0 0.0;
-               to_x: "padding_before_text";
-               to_y: "padding_right_bottom";
+               to_x: "padding_right_bottom";
+               to_y: "padding_before_text";
             }
             aspect: 1.0 1.0;
             aspect_preference: HORIZONTAL;
@@ -1464,51 +1180,27 @@ group { name: "elm/toolbar/item/tabbar";
             visible: 1;
          }
       }
-      part { name: "elm.swallow.icon_new.proxy";
-         type: PROXY;
-         scale: 1;
-         clip_to: "elm.icon_new.proxy.clipper";
-         description { state: "default" 0.0;
-             source: "elm.swallow.icon_new";
-             rel1.to: "elm.swallow.icon_new";
-             rel1.offset: 0 -3;
-             rel2.to: "elm.swallow.icon_new";
-             rel2.offset: -1 -4;
-         }
-      }
-      part { name: "elm.swallow.icon.proxy";
-         type: PROXY;
-         scale: 1;
-         clip_to: "elm.icon.proxy.clipper";
-         description { state: "default" 0.0;
-             source: "elm.swallow.icon";
-             rel1.to: "elm.swallow.icon";
-             rel1.offset: 0 -3;
-             rel2.to: "elm.swallow.icon";
-             rel2.offset: -1 -4;
-         }
-      }
       part { name: "elm.text";
          type: TEXTBLOCK;
          mouse_events: 0;
          scale: 1;
          clip_to: "elm.text.clipper";
          description { state: "default" 0.0;
-            visible: 1;
+            visible: 0;
             rel1 {
                relative: 1.0 1.0;
-               to_x: "padding_after_icon";
-               to_y: "padding_left_top";
+               to_x: "padding_left_top";
+               to_y: "padding_after_icon";
             }
             rel2 {
                relative: 0.0 0.0;
                to: "padding_right_bottom";
             }
             fixed: 1 1;
-            max: 0 78;
+            max: 0 34;
             text {
-               style: "toolbar_text_style_30";
-               min: 0 0;
+               style: "tabbar_text_style_30";
+               min: 0 1;
                max: 1 0;
             }
          }
@@ -1516,36 +1208,12 @@ group { name: "elm/toolbar/item/tabbar";
             inherit: "default" 0.0;
             visible: 1;
          }
-         description { state: "visible" 0.24;
-            inherit: "visible" 0.0;
-            max: 0 62;
-            text.style: "toolbar_text_style_24";
-         }
-         description { state: "visible" 0.28;
-            inherit: "visible" 0.0;
-            max: 0 72;
-            text.style: "toolbar_text_style_28";
-         }
-         description { state: "visible" 0.30;
-            inherit: "visible" 0.0;
-            max: 0 78;
-            text.style: "toolbar_text_style_30";
-         }
-         description { state: "selected" 0.0;
+         description { state: "sliding" 0.0;
             inherit: "visible" 0.0;
-            text.style: "toolbar_selected_text_style_30";
-         }
-         description { state: "selected" 0.24;
-            inherit: "visible" 0.24;
-            text.style: "toolbar_selected_text_style_24";
-         }
-         description { state: "selected" 0.28;
-            inherit: "visible" 0.28;
-            text.style: "toolbar_selected_text_style_28";
-         }
-         description { state: "selected" 0.30;
-            inherit: "visible" 0.30;
-            text.style: "toolbar_selected_text_style_30";
+            rel1.offset: TOOLBAR_SLIDING_TEXT_OFFSET 0;
+            rel2.offset: TOOLBAR_SLIDING_TEXT_OFFSET 0;
+            text.min: 1 1;
+            align: 0.0 0.5;
          }
       }
       part { name: "elm.text_new";
@@ -1557,98 +1225,31 @@ group { name: "elm/toolbar/item/tabbar";
             visible: 0;
             rel1 {
                relative: 1.0 1.0;
-               to_x: "padding_after_icon";
-               to_y: "padding_left_top";
+               to_x: "padding_left_top";
+               to_y: "padding_after_icon";
             }
             rel2 {
                relative: 0.0 0.0;
                to: "padding_right_bottom";
             }
-            min: 0 36;
-            max: 9999 36;
+            max: 0 34;
             fixed: 1 1;
             text {
-               style: "toolbar_text_style_30";
-               min: 0 0;
-               max: 0 1;
+               style: "tabbar_text_style_30";
+               min: 0 1;
+               max: 1 0;
             }
          }
          description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
-         description { state: "visible" 0.24;
-            inherit: "visible" 0.0;
-            max: 0 62;
-            text.style: "toolbar_text_style_24";
-         }
-         description { state: "visible" 0.28;
-            inherit: "visible" 0.0;
-            max: 0 72;
-            text.style: "toolbar_text_style_28";
-         }
-         description { state: "visible" 0.30;
-            inherit: "visible" 0.0;
-            max: 0 78;
-            text.style: "toolbar_text_style_30";
-         }
-         description { state: "selected" 0.0;
+         description { state: "sliding" 0.0;
             inherit: "visible" 0.0;
-            text.style: "toolbar_selected_text_style_30";
-         }
-         description { state: "selected" 0.24;
-            inherit: "visible" 0.24;
-            text.style: "toolbar_selected_text_style_24";
-         }
-         description { state: "selected" 0.28;
-            inherit: "visible" 0.28;
-            text.style: "toolbar_selected_text_style_28";
-         }
-         description { state: "selected" 0.30;
-            inherit: "visible" 0.30;
-            text.style: "toolbar_selected_text_style_30";
-         }
-      }
-      part { name: "padding.selected_line";
-         type: RECT;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            rel1 {
-                relative: 0.0 0.5;
-                offset: 16 0;
-            }
-            rel2 {
-                relative: 1.0 0.5;
-                offset: -17 -1;
-            }
-            min: 0 64;
-            fixed: 0 1;
-            visible: 0;
-         }
-      }
-      part { name: "selected_line";
-         type: RECT;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            rel1 {
-                to: "padding.selected_line";
-                relative: 0.0 1.0;
-            }
-            rel2 {
-                to: "padding.selected_line";
-                relative: 1.0 1.0;
-            }
-            align: 0.5 0.0;
-            color: 59 115 182 255;
-            min: 0 5;
-            fixed: 0 1;
-            visible: 0;
-         }
-         description { state: "selected" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+            rel1.offset: TOOLBAR_SLIDING_TEXT_OFFSET 0;
+            rel2.offset: TOOLBAR_SLIDING_TEXT_OFFSET 0;
+            text.min: 1 1;
+            align: 0.0 0.5;
          }
       }
       part { name: "padding.badge";
@@ -1656,28 +1257,28 @@ group { name: "elm/toolbar/item/tabbar";
          scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0;
-            align: 1.0 0.5;
+            align: 1.0 0.0;
             rel1 {
                 relative: 1.0 0.0;
             }
             rel2 {
-                relative: 1.0 0.5;
+                relative: 1.0 0.0;
             }
-            min: 10 0;
-            fixed: 1 0;
+            min: 10 10;
+            fixed: 1 1;
             visible: 0;
          }
          description { state: "default" 0.10;
             inherit: "default" 0.0;
-            min: 10 0;
+            min: 10 10;
          }
          description { state: "default" 0.06;
             inherit: "default" 0.0;
-            min: 6 0;
+            min: 6 10;
          }
          description { state: "default" 0.04;
             inherit: "default" 0.0;
-            min: 4 0;
+            min: 4 10;
          }
       }
       part { name: "elm.image.badge";
@@ -1685,7 +1286,7 @@ group { name: "elm/toolbar/item/tabbar";
          scale: 1;
          description { state: "default" 0.0;
             visible: 0;
-            min: 54 48;
+            min: 54 54;
             fixed: 1 1;
             rel1 {
                to: "left.padding.text";
@@ -1697,7 +1298,7 @@ group { name: "elm/toolbar/item/tabbar";
             }
             image {
                normal: "00_badge_bg.png";
-               border: 29 24 0 0;
+               border: 26 26 0 0;
                border_scale: 1;
             }
          }
@@ -1713,16 +1314,16 @@ group { name: "elm/toolbar/item/tabbar";
             state: "default" 0.0;
             visible: 0;
             fixed: 1 1;
-            min: 13 47;
+            min: 12 54;
             rel1 {
                to: "elm.text.badge";
-               relative: 0.0 1.0;
+               relative: 0.0 0.0;
             }
             rel2 {
                to: "elm.text.badge";
                relative: 0.0 1.0;
             }
-            align: 1.0 1.0;
+            align: 1.0 0.0;
          }
       }
       part { name: "right.padding.text";
@@ -1732,7 +1333,7 @@ group { name: "elm/toolbar/item/tabbar";
             state: "default" 0.0;
             visible: 0;
             fixed: 1 1;
-            min: 8 48;
+            min: 12 54;
             rel1 {
                to: "padding.badge";
                relative: 0.0 1.0;
@@ -1741,7 +1342,7 @@ group { name: "elm/toolbar/item/tabbar";
                to: "padding.badge";
                relative: 0.0 1.0;
             }
-            align: 1.0 1.0;
+            align: 1.0 0.0;
          }
       }
       part { name: "elm.text.badge";
@@ -1759,14 +1360,15 @@ group { name: "elm/toolbar/item/tabbar";
                to: "right.padding.text";
                relative: 0.0 1.0;
             }
-            min: 25 0;
+            min: 30 0;
             fixed: 1 0;
             align: 1.0 0.5;
-            color: 10 100 208 255;
+            color: 250 250 250 255;
             text {
                font: "Tizen:style=Bold";
-               size: 26;
-               min: 1 1;
+               size: 34;
+               min: 1 0;
+               text_class: "tizen";
             }
          }
          description { state: "visible" 0.0;
@@ -1777,101 +1379,216 @@ group { name: "elm/toolbar/item/tabbar";
       part { name: "elm.text.clipper";
          type: RECT;
          description { state: "default" 0.0;
+            rel1 {
+               relative: 1.0 1.0;
+               to: "padding_left_top";
+            }
+            rel2 {
+               relative: 0.0 0.0;
+               to: "padding_right_bottom";
+            }
             color: 255 255 255 255;
          }
          description { state: "animation" 0.0;
+            inherit: "default" 0.0;
             color: 255 255 255 0;
          }
          description { state: "disabled" 0.0;
+            inherit: "default" 0.0;
             color: 255 255 255 153;
          }
       }
       part { name: "elm.text_new.clipper";
          type: RECT;
          description { state: "default" 0.0;
+            rel1 {
+               relative: 1.0 1.0;
+               to: "padding_left_top";
+            }
+            rel2 {
+               relative: 0.0 0.0;
+               to: "padding_right_bottom";
+            }
             color: 255 255 255 0;
          }
          description { state: "animation" 0.0;
+            inherit: "default" 0.0;
             color: 255 255 255 255;
          }
          description { state: "disabled" 0.0;
+            inherit: "default" 0.0;
             color: 255 255 255 153;
          }
       }
-      part { name: "elm.icon.clipper";
+      part { name: "elm.icon.proxy.clipper";
+         type: RECT;
+         description { state: "default" 0.0;
+            rel1 {
+               relative: 1.0 1.0;
+               to: "padding_left_top";
+            }
+            rel2 {
+               relative: 0.0 0.0;
+               to: "padding_right_bottom";
+            }
+            color: 0 0 0 255;
+         }
+         description { state: "animation" 0.0;
+            inherit: "default" 0.0;
+            color: 0 0 0 255;
+         }
+         description { state: "selected" 0.0;
+            inherit: "default" 0.0;
+            color: 0 0 0 255;
+         }
+         description { state: "disabled" 0.0;
+            inherit: "default" 0.0;
+            color: 0 0 0 255;
+         }
+      }
+      part { name: "elm.icon_new.proxy.clipper";
          type: RECT;
          description { state: "default" 0.0;
-            color: 255 255 255  255;
+            rel1 {
+               relative: 1.0 1.0;
+               to: "padding_left_top";
+            }
+            rel2 {
+               relative: 0.0 0.0;
+               to: "padding_right_bottom";
+            }
+            color: 0 0 0 255;
          }
          description { state: "animation" 0.0;
-            color: 255 255 255 0;
+            inherit: "default" 0.0;
+            color: 0 0 0 255;
          }
          description { state: "selected" 0.0;
-            color: 255 255 255 255;
+            inherit: "default" 0.0;
+            color: 0 0 0 255;
          }
          description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+            inherit: "default" 0.0;
+            color: 0 0 0 255;
          }
       }
-      part { name: "elm.icon_new.clipper";
+
+      part { name: "elm.icon.clipper";
          type: RECT;
          description { state: "default" 0.0;
-            color: 255 255 255 0;
+            rel1 {
+               relative: 1.0 1.0;
+               to: "padding_left_top";
+            }
+            rel2 {
+               relative: 0.0 0.0;
+               to: "padding_right_bottom";
+            }
+            color: 255 255 255 255;
          }
          description { state: "animation" 0.0;
+            inherit: "default" 0.0;
             color: 255 255 255 255;
          }
          description { state: "selected" 0.0;
+            inherit: "default" 0.0;
             color: 255 255 255 255;
          }
          description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+            inherit: "default" 0.0;
+            color: 255 255 255 255;
          }
       }
-      part { name: "elm.icon.proxy.clipper";
+      part { name: "elm.icon_new.clipper";
          type: RECT;
          description { state: "default" 0.0;
-            color: 153 153 153 255;
+            rel1 {
+               relative: 1.0 1.0;
+               to: "padding_left_top";
+            }
+            rel2 {
+               relative: 0.0 0.0;
+               to: "padding_right_bottom";
+            }
+            color: 255 255 255 255;
          }
          description { state: "animation" 0.0;
-            color: 255 255 255 0;
+            inherit: "default" 0.0;
+            color: 255 255 255 255;
          }
          description { state: "selected" 0.0;
-            color: 61 114 180 255;
+            inherit: "default" 0.0;
+            color: 255 255 255 255;
          }
          description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+            inherit: "default" 0.0;
+            color: 255 255 255 255;
          }
       }
-      part { name: "elm.icon_new.proxy.clipper";
-         type: RECT;
+      part { name: "elm.text.dim.left";
+         type: IMAGE;
+         scale: 1;
+         mouse_events: 0;
          description { state: "default" 0.0;
-            color: 255 255 255 0;
+            min: 45 0;
+            fixed: 1 0;
+            align: 0.0 0.5;
+            visible: 0;
+            rel1 {
+                relative: 0.0 0.0;
+                to_x: "elm.text.clipper";
+                to_y: "elm.text";
+            }
+            rel2 {
+                relative: 0.0 1.0;
+                to_x: "elm.text.clipper";
+                to_y: "elm.text";
+            }
+            image.normal: "00_effect_tab_text_dim_left.png";
          }
-         description { state: "animation" 0.0;
-            color: 255 255 255 255;
+         description { state: "show" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
          }
-         description { state: "selected" 0.0;
-            color: 61 114 180 255;
+      }
+      part { name: "elm.text.dim.right";
+         type: IMAGE;
+         scale: 1;
+         mouse_events: 0;
+         description { state: "default" 0.0;
+            min: 45 0;
+            fixed: 1 0;
+            align: 1.0 0.5;
+            visible: 0;
+            rel1 {
+                relative: 1.0 0.0;
+                to_x: "elm.text.clipper";
+                to_y: "elm.text";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to_x: "elm.text.clipper";
+                to_y: "elm.text";
+            }
+            image.normal: "00_effect_tab_text_dim_right.png";
          }
-         description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+         description { state: "show" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
          }
       }
       part { name: "divider";
          type: RECT;
          scale: 1;
          description { state: "default" 0.0;
-            min: 4 26;
-            max: 4 9999;
+            min: 2 88;
+            max: 2 88;
             fixed: 1 1;
             rel1 {
                 relative: 1.0 0.5;
-                to_y: "elm.swallow.icon";
             }
             rel2 {
                 relative: 1.0 0.5;
-                to_y: "elm.swallow.icon";
             }
          }
          description { state: "hidden" 0.0;
@@ -1911,11 +1628,13 @@ group { name: "elm/toolbar/item/tabbar";
       }
       part { name: "highlight";
          type: IMAGE;
+         scale: 1;
          description { state: "default" 0.0;
             visible: 0;
             image {
-                normal: "00_focus.png";
+                normal: "00_tab_focus.png";
                 border: 8 8 8 8;
+                border_scale: 1;
             }
          }
          description { state: "highlighted" 0.0;
@@ -1934,6 +1653,23 @@ group { name: "elm/toolbar/item/tabbar";
             color: 0 0 0 0;
          }
       }
+// for debuging //////////////////////////////
+/*      part { name: "dbg";
+         type: TEXTBLOCK;
+         mouse_events: 0;
+         scale: 1;
+         description { state: "default" 0.0;
+            rel1.relative: 1.0 0.0;
+            rel2.relative: 1.0 0.0;
+            fixed: 1 1;
+            align: 1.0 0.0;
+            text {
+               style: "tabbar_text_style_30";
+               text: "test";
+               min: 1 1;
+            }
+         }
+      }*/
    }
    programs {
       program { name: "go_active";
@@ -1949,10 +1685,9 @@ group { name: "elm/toolbar/item/tabbar";
          script{
             new st[31];
             new Float:vl;
-            set_int(selected, 1);
             get_state(PART:"elm.text", st, 30, vl);
-            if (!strcmp(st, "visible"))
-              set_state(PART:"elm.text", "selected", vl);
+            if (strcmp(st, "default"))
+                run_program(PROGRAM:"slide_start");
          }
       }
       program { name: "go_passive";
@@ -1968,10 +1703,9 @@ group { name: "elm/toolbar/item/tabbar";
          script{
             new st[31];
             new Float:vl;
-            set_int(selected, 0);
             get_state(PART:"elm.text", st, 30, vl);
-            if (!strcmp(st, "selected"))
-              set_state(PART:"elm.text", "visible", vl);
+            if (strcmp(st, "default"))
+                run_program(PROGRAM:"slide_stop");
          }
       }
       program { name: "moving";
@@ -2085,7 +1819,6 @@ group { name: "elm/toolbar/item/tabbar";
          action: STATE_SET "animation" 0.0;
          target: "elm.text.clipper";
          target: "elm.text_new.clipper";
-         transition: LINEAR 0.2;
          after: "label_set,animation,done";
       }
       program { name: "label_set,animation,done";
@@ -2120,7 +1853,6 @@ group { name: "elm/toolbar/item/tabbar";
          target: "elm.icon_new.clipper";
          target: "elm.icon.proxy.clipper";
          target: "elm.icon_new.proxy.clipper";
-         transition: LINEAR 0.2;
          after: "icon_set,animation,done";
       }
       program { name: "icon_set,animation,done";
@@ -2157,28 +1889,7 @@ group { name: "elm/toolbar/item/tabbar";
                  set_state(PART:"padding_after_icon", "visible", 0.0);
                  set_state(PART:"bg", "icon_text", 0.0);
               }
-            get_state(PART:"elm.text", st, 30, vl);
-            if (!strcmp(st, "default"))
-              {
-                if (get_int(selected))
-                  set_str(temp, "selected");
-                else
-                  set_str(temp, "visible");
-                get_str(temp, st, 31);
-
-                if (get_int(items_number) <= 2)
-                  set_state(PART:"elm.text", st, 0.30);
-                else if (get_int(items_number) == 3)
-                  set_state(PART:"elm.text", st, 0.28);
-                else if (get_int(items_number) >= 4)
-                  {
-                    get_state(PART:"bg", st, 30, vl);
-                    if (!strcmp(st, "icon_text"))
-                      set_state(PART:"elm.text", st, 0.28);
-                    else
-                      set_state(PART:"elm.text", st, 0.24);
-                  }
-              }
+            set_state(PART:"elm.text", "visible", 0.0);
          }
       }
       program { name: "text_hide";
@@ -2188,7 +1899,7 @@ group { name: "elm/toolbar/item/tabbar";
             new st[31];
             new Float:vl;
             get_state(PART:"elm.swallow.icon", st, 30, vl);
-            if (!strcmp(st, "visible"))
+            if (strcmp(st, "default"))
               {
                  set_state(PART:"elm.swallow.icon", "icononly", 0.0);
                  set_state(PART:"icon_rect", "icononly", 0.0);
@@ -2205,7 +1916,7 @@ group { name: "elm/toolbar/item/tabbar";
             new st[31];
             new Float:vl;
             get_state(PART:"elm.text", st, 30, vl);
-            if (!strncmp(st, "visible", 7))
+            if (strncmp(st, "default", 7))
               {
                  set_state(PART:"elm.swallow.icon", "visible", 0.0);
                  set_state(PART:"icon_rect", "visible", 0.0);
@@ -2230,195 +1941,243 @@ group { name: "elm/toolbar/item/tabbar";
             set_state(PART:"bg", "default", 0.0);
          }
       }
-      program { name: "text_only_item_1";
-         signal: "elm,number,item,1";
+      program { name: "badge_show";
+         signal: "elm,state,elm.text.badge,visible";
          source: "elm";
-         script {
-            set_int(items_number, 1);
-         }
-         after: "text_only_item_under_2";
+         action: STATE_SET "visible" 0.0;
+         target: "elm.text.badge";
+         target: "elm.image.badge";
       }
-      program { name: "text_only_item_2";
+      program { name: "badge_hide";
+         signal: "elm,state,elm.text.badge,hidden";
+         source: "elm";
+         action:  STATE_SET "default" 0.0;
+         target: "elm.text.badge";
+         target: "elm.image.badge";
+      }
+      program { name: "divider_visible_1";
+         signal: "elm,order,first,item";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "divider";
+      }
+      program { name: "divider_visible_2";
+         signal: "elm,order,default,item";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "divider";
+      }
+      program { name: "divider_hidden";
+         signal: "elm,order,last,item";
+         source: "elm";
+         action: STATE_SET "hidden" 0.0;
+         target: "divider";
+      }
+      program { name: "highlight_on";
+         signal: "elm,highlight,on";
+         source: "elm";
+         action: STATE_SET "highlighted" 0.0;
+         target: "highlight";
+      }
+      program { name: "highlight_off";
+         signal: "elm,highlight,off";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "highlight";
+      }
+      program { name: "tab_item_2";
          signal: "elm,number,item,2";
          source: "elm";
          script {
             set_int(items_number, 2);
-         }
-         after: "text_only_item_under_2";
-      }
-      program { name: "text_only_item_under_2";
-         script {
-            new st[31];
-            new Float:vl;
-            get_state(PART:"elm.text", st, 30, vl);
-            if (!strncmp(st, "visible", 7))
-              {
-                  set_state(PART:"elm.text", st, 0.30);
-              }
             set_state(PART:"padding.badge", "default", 0.10);
          }
       }
-      program { name: "text_only_item_3";
+      program { name: "tab_item_3";
          signal: "elm,number,item,3";
          source: "elm";
          script {
-            new st[31];
-            new Float:vl;
             set_int(items_number, 3);
-            get_state(PART:"elm.text", st, 30, vl);
-            if (!strncmp(st, "visible", 7))
-              {
-                  set_state(PART:"elm.text", st, 0.28);
-              }
             set_state(PART:"padding.badge", "default", 0.06);
          }
       }
-      program { name: "text_only_item_4";
+      program { name: "tab_item_4";
          signal: "elm,number,item,4";
          source: "elm";
          script {
             set_int(items_number, 4);
          }
-         after: "text_only_item_upper_4";
+         after: "tab_item_upper_4";
       }
-      program { name: "text_only_item_5";
+      program { name: "tab_item_5";
          signal: "elm,number,item,5";
          source: "elm";
          script {
             set_int(items_number, 5);
          }
-         after: "text_only_item_upper_4";
+         after: "tab_item_upper_4";
       }
-      program { name: "text_only_item_6";
+      program { name: "tab_item_6";
          signal: "elm,number,item,6";
          source: "elm";
          script {
             set_int(items_number, 6);
          }
-         after: "text_only_item_upper_4";
+         after: "tab_item_upper_4";
       }
-      program { name: "text_only_item_7";
+      program { name: "tab_item_7";
          signal: "elm,number,item,7";
          source: "elm";
          script {
             set_int(items_number, 7);
          }
-         after: "text_only_item_upper_4";
+         after: "tab_item_upper_4";
       }
-      program { name: "text_only_item_8";
+      program { name: "tab_item_8";
          signal: "elm,number,item,8";
          source: "elm";
          script {
             set_int(items_number, 8);
          }
-         after: "text_only_item_upper_4";
+         after: "tab_item_upper_4";
       }
-      program { name: "text_only_item_9";
+      program { name: "tab_item_9";
          signal: "elm,number,item,9";
          source: "elm";
          script {
             set_int(items_number, 9);
          }
-         after: "text_only_item_upper_4";
+         after: "tab_item_upper_4";
       }
-      program { name: "text_only_item_10";
+      program { name: "tab_item_10";
          signal: "elm,number,item,10";
          source: "elm";
          script {
             set_int(items_number, 10);
          }
-         after: "text_only_item_upper_4";
+         after: "tab_item_upper_4";
       }
-      program { name: "text_only_item_upper_4";
+      program { name: "tab_item_upper_4";
          script {
-            new st[31];
-            new stb[31];
-            new Float:vl;
-            get_state(PART:"elm.text", st, 30, vl);
-            if (!strcmp(st, "visible") || !strcmp(st, "selected"))
-              {
-                  get_state(PART:"bg", stb, 30, vl);
-                  if (!strcmp(stb, "icon_text"))
-                    set_state(PART:"elm.text", st, 0.28);
-                  else
-                    set_state(PART:"elm.text", st, 0.24);
-              }
-            get_state(PART:"bg", stb, 30, vl);
-            if (!strcmp(stb, "icon_text"))
-              set_state(PART:"padding.badge", "default", 0.06);
-            else
-              set_state(PART:"padding.badge", "default", 0.04);
+            set_state(PART:"padding.badge", "default", 0.04);
          }
       }
-      program { name: "badge_show";
-         signal: "elm,state,elm.text.badge,visible";
-         source: "elm";
-         action: STATE_SET "visible" 0.0;
-         target: "elm.text.badge";
-         target: "elm.image.badge";
-      }
-      program { name: "badge_hide";
-         signal: "elm,state,elm.text.badge,hidden";
-         source: "elm";
-         action:  STATE_SET "default" 0.0;
-         target: "elm.text.badge";
-         target: "elm.image.badge";
-      }
-      program { name: "divider_visible";
-         signal: "elm,order,first,item";
-         signal: "elm,order,default,item";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "divider";
-      }
-      program { name: "divider_hidden";
-         signal: "elm,order,last,item";
-         source: "elm";
-         action: STATE_SET "hidden" 0.0;
-         target: "divider";
-      }
-      program { name: "highlight_on";
-         signal: "elm,highlight,on";
-         source: "elm";
-         action: STATE_SET "highlighted" 0.0;
-         target: "highlight";
+      program { name: "slide_start";
+         script {
+            if (!get_int(sliding_timer) && !get_int(end_timer)) {
+               set_int(sliding_timer, timer(1.5, "sliding", TOOLBAR_SLIDING_TEXT_OFFSET));
+            }
+         }
       }
-      program { name: "highlight_off";
-         signal: "elm,highlight,off";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "highlight";
+      program { name: "slide_stop";
+         script {
+             ender(0);
+         }
       }
    }
 }
 
-group { name: "elm/toolbar/base/tabbar/item_horizontal";
+group { name: "elm/toolbar/base/tabbar/item_with_title";
    inherit: "elm/toolbar/base/tabbar";
+   images {
+      image: "00_sub_title_bg.png" COMP;
+   }
    parts {
-      part { name: "left_padding";
-         description {
-            state: "default" 0.0;
-            min: 34 0;
-         }
-      }
-      part { name: "right_padding";
+       part { name: "base_bg";
+         type: IMAGE;
+         scale: 1;
          description {
             state: "default" 0.0;
-            min: 34 0;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "base";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "base";
+            }
+            image {
+                normal: "00_sub_title_bg.png";
+                border: 8 8 35 35;
+                border_scale: 1;
+            }
          }
       }
    }
 }
 
-group { name: "elm/toolbar/item/tabbar/item_horizontal";
+group { name: "elm/toolbar/item/tabbar/item_with_title";
    inherit: "elm/toolbar/item/tabbar";
+   images {
+      image: "00_effect_tab_text_dim_left_02.png" COMP;
+      image: "00_effect_tab_text_dim_right_02.png" COMP;
+   }
    parts {
-      part { name: "bg";
+      part { name: "elm.text.dim.left";
          description { state: "default" 0.0;
-            min: 303 0;
+            image.normal: "00_effect_tab_text_dim_left_02.png";
          }
-         description { state: "icon_text" 0.0;
-            min: 404 0;
+         description { state: "show" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+         }
+      }
+      part { name: "elm.text.dim.right";
+         description { state: "default" 0.0;
+            image.normal: "00_effect_tab_text_dim_right_02.png";
+         }
+         description { state: "show" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+         }
+      }
+      part { name: "divider";
+         type: RECT;
+         scale: 1;
+         description { state: "default" 0.0;
+            min: 2 48;
+            max: 2 48;
+            fixed: 1 1;
+            rel1 {
+                relative: 1.0 0.5;
+            }
+            rel2 {
+                relative: 1.0 0.5;
+            }
+         }
+         description { state: "hidden" 0.0;
+            inherit: "default" 0.0;
+            visible: 0;
+         }
+      }
+      part { name: "divider_left";
+         type: RECT;
+         clip_to: "divider";
+         description { state: "default" 0.0;
+            color: TABBAR_ITEM_DIVIDER_LEFT_COLOR_INC;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "divider";
+            }
+            rel2 {
+                relative: 0.5 1.0;
+                to: "divider";
+            }
+         }
+      }
+      part { name: "divider_right";
+         type: RECT;
+         clip_to: "divider";
+         description { state: "default" 0.0;
+            color: TABBAR_ITEM_DIVIDER_RIGHT_COLOR_INC;
+            rel1 {
+                relative: 0.5 0.0;
+                to: "divider";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "divider";
+            }
          }
       }
    }