button: Add bg and effect color classes for naviframe button styles.submit/tizen_3.0/20161028.092323submit/tizen_3.0/20161028.062323submit/tizen/20161026.101032submit/tizen/20161026.063315submit/tizen/20161026.040418accepted/tizen/mobile/20161026.133538accepted/tizen/3.0/mobile/20161028.150530

Bg and effect color classes for the following button styles are added.
"naviframe/title_left"
"naviframe/title_right"
"naviframe/back_btn"

Change-Id: I7e4477cd83ac12b642c64ac32463ee0665473165

2 files changed, 66 insertions, 50 deletions

diff --git a/mobile/color_classes.edc b/mobile/color_classes.edc
index b26bc602..4332c284 100644
--- a/mobile/color_classes.edc
+++ b/mobile/color_classes.edc
@@ -251,6 +251,18 @@ color_classes {
    color_class { "button/naviframe/title_right/effect";
       color: 0 0 0 77;
    }
+   color_class { "button/naviframe/back_btn/bg";
+      color: 0 0 0 0;
+   }
+   color_class { "button/naviframe/back_btn/bg_pressed";
+      color: 0 0 0 0;
+   }
+   color_class { "button/naviframe/back_btn/bg_disabled";
+      color: 0 0 0 0;
+   }
+   color_class { "button/naviframe/back_btn/effect";
+      color: 0 0 0 77;
+   }
    color_class { "floatingbutton/default/bg";
       color: 0 0 0 0;
    }
diff --git a/mobile/widgets/button.edc b/mobile/widgets/button.edc
index 5943ed8a..26060766 100644
--- a/mobile/widgets/button.edc
+++ b/mobile/widgets/button.edc
@@ -159,7 +159,7 @@
       }
    }
    #define BUTTON_VECTOR_PART(min_size, ratio, vector_base, clipper_vector_base, left_top, right_top, mid, left_bottom, right_bottom) \
-         vector { "bg_effect_top_left"; \
+         vector { vector_base"_top_left"; \
             clip: clipper_vector_base; \
             desc { "default"; \
                align: 0.0 0.0; \
@@ -178,7 +178,7 @@
                inherit: "ready"; \
             } \
          } \
-         vector { "bg_effect_top_right"; \
+         vector { vector_base"_top_right"; \
             clip: clipper_vector_base; \
             desc { "default"; \
                align: 1.0 0.0; \
@@ -197,12 +197,12 @@
                inherit: "ready"; \
             } \
          } \
-         vector { "bg_effect_top_mid"; \
+         vector { vector_base"_top_mid"; \
             clip: clipper_vector_base; \
             desc { "default"; \
-               rel1.to: "bg_effect_top_left"; \
+               rel1.to: vector_base"_top_left"; \
                rel1.relative: 1.0 0.0; \
-               rel2.to: "bg_effect_top_right"; \
+               rel2.to: vector_base"_top_right"; \
                rel2.relative: 0.0 1.0; \
                image.normal: mid; \
             } \
@@ -213,12 +213,12 @@
                inherit: "ready"; \
             } \
          } \
-         vector { "bg_effect_mid"; \
+         vector { vector_base"_mid"; \
             clip: clipper_vector_base; \
             desc { "default"; \
-               rel1.to: "bg_effect_top_left"; \
+               rel1.to: vector_base"_top_left"; \
                rel1.relative: 0.0 1.0; \
-               rel2.to: "bg_effect_bottom_right"; \
+               rel2.to: vector_base"_bottom_right"; \
                rel2.relative: 1.0 0.0; \
                image.normal: mid; \
             } \
@@ -229,7 +229,7 @@
                inherit: "ready"; \
             } \
          } \
-         vector { "bg_effect_bottom_left"; \
+         vector { vector_base"_bottom_left"; \
             clip: clipper_vector_base; \
             desc { "default"; \
                align: 0.0 1.0; \
@@ -248,7 +248,7 @@
                inherit: "ready"; \
             } \
          } \
-         vector { "bg_effect_bottom_right"; \
+         vector { vector_base"_bottom_right"; \
             clip: clipper_vector_base; \
             desc { "default"; \
                align: 1.0 1.0; \
@@ -267,12 +267,12 @@
                inherit: "ready"; \
             } \
          } \
-         vector { "bg_effect_bottom_mid"; \
+         vector { vector_base"_bottom_mid"; \
             clip: clipper_vector_base; \
             desc { "default"; \
-               rel1.to: "bg_effect_bottom_left"; \
+               rel1.to: vector_base"_bottom_left"; \
                rel1.relative: 1.0 0.0; \
-               rel2.to: "bg_effect_bottom_right"; \
+               rel2.to: vector_base"_bottom_right"; \
                rel2.relative: 0.0 1.0; \
                image.normal: mid; \
             } \
@@ -2722,12 +2722,18 @@ group { "elm/button/base/contacts";
                max: BUTTON_NAVIFRAME_TITLE_LEFT_BUTTON_EFFECT_SIZE_INC;
             }
          }
-         rect { "bg";
+         BUTTON_VECTOR_PART(NAVIFRAME_TITLE_BUTTON_CORNER_RADIUS
+                           , 0.7
+                           , "bg", "clipper_bg"
+                           , "core_press_top_left.svg", "core_press_top_right.svg"
+                           , "core_press_center.svg"
+                           , "core_press_bottom_left.svg", "core_press_bottom_right.svg");
+         swallow { "bg";
             scale;
             nomouse;
+            clip: "clipper_bg";
             desc { "default";
                rel.to: "bg_spacer";
-               hid;
             }
          }
          rect { "clipper_bg";
@@ -2916,17 +2922,19 @@ group { "elm/button/base/contacts";
             signal: "elm,state,enabled";
             source: "elm";
             script {
-              set_int(disabled, 0);
-              set_state(PART:"elm.text", "default", 0.0);
+               set_int(disabled, 0);
+               set_state(PART:"clipper_bg", "default", 0.0);
+               set_state(PART:"elm.text", "default", 0.0);
             }
          }
          program { "on_disabled";
             signal: "elm,state,disabled";
             source: "elm";
             script {
-              set_int(disabled, 1);
-              if (get_int(animate) == 1) return;
-              set_state(PART:"elm.text", "disabled", 0.0);
+               set_int(disabled, 1);
+               if (get_int(animate) == 1) return;
+               set_state(PART:"clipper_bg", "disabled", 0.0);
+               set_state(PART:"elm.text", "disabled", 0.0);
             }
          }
          program { "pressed_effect";
@@ -2954,6 +2962,7 @@ group { "elm/button/base/contacts";
          }
          program { "pressed_effect3";
             script {
+               set_state(PART:"clipper_bg", "pressed", 0.0);
                set_int(animate, 0);
             }
          }
@@ -2997,6 +3006,7 @@ group { "elm/button/base/contacts";
          program { "finished_animation";
             action: STATE_SET "default";
             target: "bg_effect";
+            target: "clipper_bg";
             target: "clipper_bg_effect";
             target_groups: "bg_effect_vector";
          }
@@ -3061,14 +3071,6 @@ group { "elm/button/base/contacts";
                max: BUTTON_NAVIFRAME_TITLE_RIGHT_BUTTON_EFFECT_SIZE_INC;
             }
          }
-         rect { "bg";
-            scale;
-            nomouse;
-            desc { "default";
-               rel.to: "bg_spacer";
-               hid;
-            }
-         }
          rect { "clipper_bg";
             scale;
             desc { "default";
@@ -3081,12 +3083,6 @@ group { "elm/button/base/contacts";
                color_class: "button/naviframe/title_right/bg_disabled";
             }
          }
-         spacer { "effect_spacer";
-            scale;
-            desc { "default";
-               rel.to: "bg";
-            }
-         }
          //Effect Shape Part
          rect { "clipper_bg_effect";
             desc { "default";
@@ -3198,24 +3194,30 @@ group { "elm/button/base/contacts";
                max: BUTTON_NAVIFRAME_BACK_BUTTON_EFFECT_MAX_SIZE_INC;
             }
          }
-         rect { "bg";
+         BUTTON_VECTOR_PART(BUTTON_NAVIFRAME_BACK_CORNER_RADIUS
+                           , 0.7
+                           , "bg", "clipper_bg"
+                           , "core_press_top_left.svg", "core_press_top_right.svg"
+                           , "core_press_center.svg"
+                           , "core_press_bottom_left.svg", "core_press_bottom_right.svg");
+         swallow { "bg";
             scale;
             nomouse;
+            clip: "clipper_bg";
             desc { "default";
                rel.to: "bg_spacer";
-               hid;
             }
          }
          rect { "clipper_bg";
             scale;
             desc { "default";
-               color: 0 0 0 0;
+               color_class: "button/naviframe/back_btn/bg";
             }
             desc { "pressed";
-               color: 0 0 0 0;
+               color_class: "button/naviframe/back_btn/bg_pressed";
             }
             desc { "disabled";
-               color: 0 0 0 0;
+               color_class: "button/naviframe/back_btn/bg_disabled";
             }
          }
          spacer { "effect_spacer";
@@ -3252,25 +3254,22 @@ group { "elm/button/base/contacts";
          }
          rect { "clipper_bg_effect";
             desc { "default";
-               color: 0 0 0 0;
-               hid;
                fixed: 1 1;
                rel.to: "bg_effect";
+               color: 255 255 255 0;
+               color_class: "button/naviframe/back_btn/effect";
+               hid;
             }
             desc { "ready";
                inherit: "default";
                vis;
-               fixed: 1 1;
             }
             desc { "pressed";
-               color: 0 0 0 77;
-               fixed: 1 1;
-               rel.to: "bg_effect";
+               inherit: "ready";
+               color: 255 255 255 255;
             }
             desc { "disabled";
-               color: 0 0 0 77;
-               fixed: 1 1;
-               rel.to: "bg_effect";
+               inherit: "ready";
             }
          }
          image { "icon";
@@ -3362,12 +3361,15 @@ group { "elm/button/base/contacts";
          }
          program { "on_enabled";
             script {
-              set_int(disabled, 0);
+               set_int(disabled, 0);
+               set_state(PART:"clipper_bg", "default", 0.0);
             }
          }
          program { "on_disabled";
             script {
-              set_int(disabled, 1);
+               set_int(disabled, 1);
+               if (get_int(animate) == 1) return;
+               set_state(PART:"clipper_bg", "disabled", 0.0);
             }
          }
          program { "pressed_effect";
@@ -3394,6 +3396,7 @@ group { "elm/button/base/contacts";
          }
          program { "pressed_effect3";
             script {
+               set_state(PART:"clipper_bg", "pressed", 0.0);
                set_int(animate, 0);
             }
          }
@@ -3415,6 +3418,7 @@ group { "elm/button/base/contacts";
          program { "unpressed_effect3";
             action: STATE_SET "default";
             target: "bg_effect";
+            target: "clipper_bg";
             target: "clipper_bg_effect";
             target_groups: "bg_effect_vector";
          }