add gengrid item style for song contents

Change-Id: I3d42352b9bc6c9fc4d630d83c6fc7a316c8fdeff
Signed-off-by: Jehun Lim <jehun.lim@samsung.com>

diff --git a/include/define.h b/include/define.h
index a924abf..dc8be89 100644 (file)
--- a/include/define.h
+++ b/include/define.h
@@ -39,17 +39,23 @@
 #define COLOR_TEXT_MENU 104 104 104 255
 #define COLOR_TEXT_INDEX 77 77 77 255
 #define COLOR_TEXT_NORMAL 87 87 87 255
+#define COLOR_TEXT_INFO 153 153 153 255
 #define COLOR_TEXT_FOCUS 255 255 255 255
 #define COLOR_TEXT_SELECTED 64 136 211 255
 #define COLOR_TEXT_DISABLED 87 87 87 128
-#define COLOR_ITEM_BG 113 128 147 255
+#define COLOR_TEXT_BG 113 128 147 255
+#define COLOR_ITEM_BG 255 255 255 255
+#define COLOR_ITEM_DEFAULT 119 169 202 255
 #define COLOR_ITEM_FOCUS 0 119 246 255
 #define COLOR_ITEM_FOCUS_0 0 119 246 0
 #define COLOR_ITEM_SELECTED 64 136 211 255
 #define COLOR_ITEM_BAR 190 190 190 255
+#define COLOR_ITEM_BORDER 194 194 194 255
 
 /* part */
 #define PART_ELM_TEXT_TITLE "elm.text.title"
+#define PART_ELM_TEXT_ARTIST "elm.text.artist"
+#define PART_ELM_TEXT_ALBUM "elm.text.album"
 #define PART_ELM_TEXT_PLAYTIME "elm.text.playtime"
 #define PART_ELM_SWALLOW_THUMBNAIL "elm.swallow.thumbnail"
 #define PART_ELM_SWALLOW_VIDEO "elm.swallow.video"

diff --git a/include/view/base.h b/include/view/base.h
index 2ddd8ef..23422cb 100644 (file)
--- a/include/view/base.h
+++ b/include/view/base.h
@@ -36,6 +36,7 @@
 /* images */
 #define IMAGE_PREVIEW_PLAY "ic_preview_play.png"
 #define IMAGE_THUMBNAIL_PICTURE "ic_thumbnail_picture.png"
+#define IMAGE_THUMBNAIL_SONG "ic_thumbnail_song.png"
 #define IMAGE_THUMBNAIL_PLAY IMAGEDIR"/ic_thumbnail_play.png"
 
 /* style */

diff --git a/res/edc/images/ic_thumbnail_song.png b/res/edc/images/ic_thumbnail_song.png
new file mode 100644 (file)
index 0000000..5022801
Binary files /dev/null and b/res/edc/images/ic_thumbnail_song.png differ

diff --git a/res/edc/widgets/gengrid.edc b/res/edc/widgets/gengrid.edc
index 261c141..b298f33 100644 (file)
--- a/res/edc/widgets/gengrid.edc
+++ b/res/edc/widgets/gengrid.edc
@@ -264,7 +264,7 @@ group {
                                rel2.to: "bg";
                                min: 0 82;
                                align: 0.5 1.0;
-                               color: COLOR_ITEM_BG;
+                               color: COLOR_TEXT_BG;
                                fixed: 0 1;
                                map {
                                        perspective_on: 1;
@@ -287,7 +287,7 @@ group {
                                state: "default" 0.0;
                                rel1.to: "defaultbg_text";
                                rel2.to: "defaultbg_text";
-                               color: COLOR_ITEM_BG;
+                               color: COLOR_TEXT_BG;
                                map {
                                        perspective_on: 1;
                                        perspective: "map";
@@ -524,7 +524,7 @@ group {
                                state : "default" 0.0;
                                rel1.to: "bg";
                                rel2.to: "bg";
-                               color: 119 169 202 255;
+                               color: COLOR_ITEM_DEFAULT;
                                map {
                                        perspective_on: 1;
                                        perspective: "map";
@@ -881,3 +881,656 @@ group {
                }
        }
 }
+
+group {
+       name: "elm/gengrid/item/song_item/default";
+       data.item: "selectraise" "on";
+       data.item: "texts" "elm.text.title elm.text.artist elm.text.album";
+       data.item: "contents" "elm.swallow.thumbnail";
+       data.item: "focus_highlight" "on";
+       images {
+               image: IMAGE_THUMBNAIL_SONG COMP;
+       }
+       parts {
+               part {
+                       name: "elm.padding.bottom_right";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1.relative: 1.0 1.0;
+                               min: 26 26;
+                               align: 1.0 1.0;
+                               fixed: 1 1;
+                       }
+               }
+               part {
+                       name: "map";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               perspective {
+                                       zplane: 0;
+                                       focal: 1000;
+                               }
+                               visible: 0;
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               perspective.zplane: -100;
+                       }
+               }
+               part {
+                       name: "bg";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel2 {
+                                       to: "elm.padding.bottom_right";
+                                       relative: 0.0 0.0;
+                               }
+                               fixed: 1 1;
+                               visible: 0;
+                       }
+               }
+               part {
+                       name: "defaultbg";
+                       type: RECT;
+                       scale: 1;
+                       mouse_events: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1.to: "bg";
+                               rel2 {
+                                       to: "elm.bg.text";
+                                       relative: 0.0 1.0;
+                               }
+                               color: COLOR_ITEM_DEFAULT;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               map.on: 1;
+                       }
+               }
+               part {
+                       name: "default_image";
+                       type: IMAGE;
+                       scale: 1;
+                       mouse_events: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "defaultbg";
+                                       relative: 0.5 0.5;
+                               }
+                               rel2 {
+                                       to: "defaultbg";
+                                       relative: 0.5 0.5;
+                               }
+                               image.normal: IMAGE_THUMBNAIL_SONG;
+                               min: 80 80;
+                               fixed: 1 1;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               map.on: 1;
+                       }
+               }
+               part {
+                       name: PART_ELM_SWALLOW_THUMBNAIL;
+                       type: SWALLOW;
+                       scale: 1;
+                       mouse_events: 1;
+                       description {
+                               state : "default" 0.0;
+                               rel1.to: "defaultbg";
+                               rel2.to: "defaultbg";
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               map.on: 1;
+                       }
+               }
+               part {
+                       name: "part_focus1";
+                       type: RECT;
+                       mouse_events: 0;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1.to: "bg";
+                               rel2 {
+                                       to: "elm.bg.text";
+                                       relative: 0.0 0.0;
+                               }
+                               min: 0 6;
+                               align: 0.5 0.0;
+                               color: COLOR_ITEM_FOCUS;
+                               fixed: 0 1;
+                               visible: 0;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               map.on: 1;
+                               visible: 1;
+                       }
+                       description {
+                               state: "selected_0" 0.0;
+                               inherit: "default" 0.0;
+                               visible: 1;
+                               color: COLOR_ITEM_FOCUS_0;
+                       }
+               }
+               part {
+                       name: "part_focus2";
+                       type: RECT;
+                       mouse_events: 0;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "part_focus1";
+                                       relative: 0.0 1.0;
+                               }
+                               rel2 {
+                                       to: "bg";
+                                       relative: 0.0 1.0;
+                               }
+                               min: 6 0;
+                               align: 0.0 0.5;
+                               color: COLOR_ITEM_FOCUS;
+                               fixed: 1 0;
+                               visible: 0;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               map.on: 1;
+                               visible: 1;
+                       }
+                       description {
+                               state: "selected_0" 0.0;
+                               inherit: "default" 0.0;
+                               visible: 1;
+                               color: COLOR_ITEM_FOCUS_0;
+                       }
+               }
+               part {
+                       name: "part_focus3";
+                       type: RECT;
+                       mouse_events: 0;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "part_focus2";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2 {
+                                       to: "elm.bg.text";
+                                       relative: 0.0 1.0;
+                               }
+                               min: 0 6;
+                               align: 0.5 1.0;
+                               color: COLOR_ITEM_FOCUS;
+                               fixed: 1 0;
+                               visible: 0;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               map.on: 1;
+                               visible: 1;
+                       }
+                       description {
+                               state: "selected_0" 0.0;
+                               inherit: "default" 0.0;
+                               visible: 1;
+                               color: COLOR_ITEM_FOCUS_0;
+                       }
+               }
+               part {
+                       name: "defaultbg_text";
+                       type: RECT;
+                       mouse_events: 0;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "bg";
+                                       relative: 1.0 0.0;
+                               }
+                               rel2.to: "bg";
+                               min: 354 0;
+                               align: 1.0 0.5;
+                               color: COLOR_ITEM_BG;
+                               fixed: 1 0;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: COLOR_ITEM_FOCUS;
+                               map.on: 1;
+                       }
+               }
+               part {
+                       name: "elm.bg.text";
+                       type: RECT;
+                       mouse_events: 0;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1.to: "defaultbg_text";
+                               rel2.to: "defaultbg_text";
+                               color: COLOR_ITEM_BG;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: COLOR_ITEM_FOCUS;
+                               map.on: 1;
+                       }
+                       description {
+                               state: "selected_0" 0.0;
+                               inherit: "default" 0.0;
+                               color: COLOR_ITEM_FOCUS_0;
+                       }
+               }
+               part {
+                       name: "elm.padding.title.left";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1.to: "elm.bg.text";
+                               rel2 {
+                                       to: "elm.bg.text";
+                                       relative: 0.0 0.0;
+                               }
+                               min: 28 22;
+                               align: 0.0 0.0;
+                               fixed: 1 1;
+                       }
+               }
+               part {
+                       name: "elm.padding.title.right";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "elm.bg.text";
+                                       relative: 1.0 0.0;
+                               }
+                               rel2 {
+                                       to: "elm.bg.text";
+                                       relative: 1.0 0.0;
+                               }
+                               min: 102 22;
+                               align: 1.0 0.0;
+                               fixed: 1 1;
+                       }
+               }
+               part {
+                       name: PART_ELM_TEXT_TITLE;
+                       type: TEXT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "elm.padding.title.left";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2 {
+                                       to: "elm.padding.title.right";
+                                       relative: 0.0 1.0;
+                               }
+                               text {
+                                       font: FONT_LIGHT;
+                                       size: 28;
+                                       align: 0.0 0.5;
+                               }
+                               min: 0 28;
+                               align: 0.5 0.0;
+                               color: COLOR_TEXT_TITLE;
+                               fixed: 0 1;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: COLOR_TEXT_FOCUS;
+                               map.on: 1;
+                       }
+                       description {
+                               state: "selected_0" 0.0;
+                               inherit: "selected" 0.0;
+                       }
+               }
+               part {
+                       name: "elm.padding.artist.left";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: PART_ELM_TEXT_TITLE;
+                                       relative: 0.0 1.0;
+                               }
+                               rel2 {
+                                       to: PART_ELM_TEXT_TITLE;
+                                       relative: 0.0 1.0;
+                               }
+                               min: 0 14;
+                               align: 0.0 0.0;
+                               fixed: 1 1;
+                       }
+               }
+               part {
+                       name: "elm.padding.artist.right";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: PART_ELM_TEXT_TITLE;
+                                       relative: 1.0 1.0;
+                               }
+                               rel2.to: PART_ELM_TEXT_TITLE;
+                               min: 78 14;
+                               align: 0.0 0.0;
+                               fixed: 1 1;
+                       }
+               }
+               part {
+                       name: PART_ELM_TEXT_ARTIST;
+                       type: TEXT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "elm.padding.artist.left";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2.to: "elm.padding.artist.right";
+                               text {
+                                       font: FONT_LIGHT;
+                                       size: 24;
+                                       align: 0.0 0.5;
+                               }
+                               min: 0 24;
+                               align: 0.5 0.0;
+                               color: COLOR_TEXT_INFO;
+                               fixed: 0 1;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: COLOR_TEXT_FOCUS;
+                               map.on: 1;
+                       }
+                       description {
+                               state: "selected_0" 0.0;
+                               inherit: "selected" 0.0;
+                       }
+               }
+               part {
+                       name: "elm.padding.album";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: PART_ELM_TEXT_ARTIST;
+                                       relative: 0.0 1.0;
+                               }
+                               rel2.to: PART_ELM_TEXT_ARTIST;
+                               min: 0 4;
+                               align: 0.5 0.0;
+                               fixed: 0 1;
+                       }
+               }
+               part {
+                       name: PART_ELM_TEXT_ALBUM;
+                       type: TEXT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "elm.padding.album";
+                                       relative: 0.0 1.0;
+                               }
+                               rel2.to: "elm.padding.album";
+                               text {
+                                       font: FONT_LIGHT;
+                                       size: 24;
+                                       align: 0.0 0.5;
+                               }
+                               min: 0 24;
+                               align: 0.5 0.0;
+                               color: COLOR_TEXT_INFO;
+                               fixed: 0 1;
+                               map {
+                                       perspective_on: 1;
+                                       perspective: "map";
+                               }
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: COLOR_TEXT_FOCUS;
+                               map.on: 1;
+                       }
+                       description {
+                               state: "selected_0" 0.0;
+                               inherit: "selected";
+                       }
+               }
+               part {
+                       name: "border_up";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1.to: "bg";
+                               rel2 {
+                                       to: "bg";
+                                       relative: 1.0 0.0;
+                               }
+                               min: 0 1;
+                               align: 0.5 0.0;
+                               color: COLOR_ITEM_BORDER;
+                               fixed: 0 1;
+                       }
+               }
+               part {
+                       name: "border_left";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "border_up";
+                                       relative: 0.0 1.0;
+                               }
+                               rel2 {
+                                       to: "bg";
+                                       relative: 0.0 1.0;
+                               }
+                               min: 1 0;
+                               align: 0.0 0.5;
+                               color: COLOR_ITEM_BORDER;
+                               fixed: 1 0;
+                       }
+               }
+               part {
+                       name: "border_right";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "border_up";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2.to: "bg";
+                               min: 1 0;
+                               align: 1.0 0.5;
+                               color: COLOR_ITEM_BORDER;
+                               fixed: 1 0;
+                       }
+               }
+               part {
+                       name: "border_down";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "border_left";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2 {
+                                       to: "border_right";
+                                       relative: 0.0 1.0;
+                               }
+                               min: 0 1;
+                               align: 0.5 1.0;
+                               color: COLOR_ITEM_BORDER;
+                               fixed: 0 1;
+                       }
+               }
+       }
+       programs {
+               program {
+                       name: "go_active";
+                       signal: "elm,state,focused";
+                       source: "elm";
+                       action: STATE_SET "selected_0" 0.0;
+                       target: "part_focus1";
+                       target: "part_focus2";
+                       target: "part_focus3";
+                       target: "elm.bg.text";
+                       target: PART_ELM_TEXT_TITLE;
+                       target: PART_ELM_TEXT_ARTIST;
+                       target: PART_ELM_TEXT_ALBUM;
+                       after: "focus,in,anim";
+               }
+               program {
+                       name: "focus,in,anim";
+                       action: STATE_SET "selected" 0.0;
+                       target: "defaultbg";
+                       target: PART_ELM_SWALLOW_THUMBNAIL;
+                       target: "default_image";
+                       target: "part_focus1";
+                       target: "part_focus2";
+                       target: "part_focus3";
+                       target: "elm.bg.text";
+                       transition: LINEAR 0.17;
+                       after: "focus,in,anim,2";
+               }
+               program {
+                       name: "focus,in,anim,2";
+                       action: STATE_SET "selected" 0.0;
+                       target: "defaultbg_text";
+               }
+               program {
+                       name: "go_passive";
+                       signal: "elm,state,unfocused";
+                       source: "elm";
+                       action: STATE_SET "default" 0.0;
+                       target: PART_ELM_TEXT_TITLE;
+                       target: PART_ELM_TEXT_ARTIST;
+                       target: PART_ELM_TEXT_ALBUM;
+                       target: "defaultbg_text";
+                       after: "focus,out,anim";
+               }
+               program {
+                       name: "focus,out,anim";
+                       action: STATE_SET "selected_0" 0.0;
+                       target: "part_focus1";
+                       target: "part_focus2";
+                       target: "part_focus3";
+                       target: "elm.bg.text";
+                       transition: LINEAR 0.17;
+                       after: "focus,out,anim,2";
+               }
+               program {
+                       name: "focus,out,anim,2";
+                       action: STATE_SET "default" 0.0;
+                       target: PART_ELM_SWALLOW_THUMBNAIL;
+                       target: "default_image";
+                       target: "defaultbg";
+                       target: "part_focus1";
+                       target: "part_focus2";
+                       target: "part_focus3";
+                       target: "elm.bg.text";
+               }
+               program {
+                       name: "selected";
+                       signal: "elm,state,selected";
+                       source: "elm";
+                       action: STATE_SET "selected" 0.0;
+                       target: "map";
+                       transition: DECELERATE 0.2;
+                       after: "after_selected";
+               }
+               program {
+                       name: "after_selected";
+                       action: STATE_SET "default" 0.0;
+                       target: "map";
+                       transition: DECELERATE 0.2;
+                       after: "item_selected";
+               }
+               program {
+                       name: "item_selected";
+                       action: SIGNAL_EMIT SIG_ITEM_SELECTED SIG_SOURCE_EDC;
+               }
+       }
+}