ring: alarm ring layout

diff --git a/ring/project_def.prop b/ring/project_def.prop
index 75ca0b6..bcc186a 100644 (file)
--- a/ring/project_def.prop
+++ b/ring/project_def.prop
@@ -61,8 +61,8 @@ USER_EDCS_FONT_DIRS_ABS =
 USER_EXT_EDC_KEYS = EDC0 
 
 USER_EXT_EDC0_EDCS = res/edje/ring.edc 
-USER_EXT_EDC0_EDCS_IMAGE_DIRS = edje/images 
-USER_EXT_EDC0_EDCS_IMAGE_DIRS_ABS = 
+USER_EXT_EDC0_EDCS_IMAGE_DIRS = res/edje/images 
+USER_EXT_EDC0_EDCS_IMAGE_DIRS_ABS =
 USER_EXT_EDC0_EDCS_SOUND_DIRS = edje/sounds 
 USER_EXT_EDC0_EDCS_SOUND_DIRS_ABS = 
 USER_EXT_EDC0_EDCS_FONT_DIRS = edje/fonts 

diff --git a/ring/res/edje/color_classes.edc b/ring/res/edje/color_classes.edc
new file mode 100644 (file)
index 0000000..7761aba
--- /dev/null
+++ b/ring/res/edje/color_classes.edc
@@ -0,0 +1,18 @@
+color_classes {
+       color_class {
+               name: "AO003";
+               color: 224 34 34 255;
+       }
+       color_class {
+               name: "AO003P";
+               color: 135 20 20 255;
+       }
+       color_class {
+               name: "AO004";
+               color: 255 179 0 255;
+       }
+       color_class {
+               name: "AO004P";
+               color: 166 116 0 255;
+       }
+}

diff --git a/ring/res/edje/images/alarm_btn_bg.png b/ring/res/edje/images/alarm_btn_bg.png
new file mode 100644 (file)
index 0000000..a9909ef
Binary files /dev/null and b/ring/res/edje/images/alarm_btn_bg.png differ

diff --git a/ring/res/edje/images/alarm_btn_circle_drag.png b/ring/res/edje/images/alarm_btn_circle_drag.png
new file mode 100644 (file)
index 0000000..0971827
Binary files /dev/null and b/ring/res/edje/images/alarm_btn_circle_drag.png differ

diff --git a/ring/res/edje/images/alarm_btn_circle_line.png b/ring/res/edje/images/alarm_btn_circle_line.png
new file mode 100644 (file)
index 0000000..9330235
Binary files /dev/null and b/ring/res/edje/images/alarm_btn_circle_line.png differ

diff --git a/ring/res/edje/images/alarm_btn_ic_dismiss.png b/ring/res/edje/images/alarm_btn_ic_dismiss.png
new file mode 100644 (file)
index 0000000..7e35c04
Binary files /dev/null and b/ring/res/edje/images/alarm_btn_ic_dismiss.png differ

diff --git a/ring/res/edje/images/alarm_btn_ic_snooze.png b/ring/res/edje/images/alarm_btn_ic_snooze.png
new file mode 100644 (file)
index 0000000..3c7d9f2
Binary files /dev/null and b/ring/res/edje/images/alarm_btn_ic_snooze.png differ

diff --git a/ring/res/edje/ring.edc b/ring/res/edje/ring.edc
index 083dc42..a661930 100644 (file)
--- a/ring/res/edje/ring.edc
+++ b/ring/res/edje/ring.edc
@@ -1,14 +1,382 @@
+#include "color_classes.edc"
+
+#define ALARM_TITLE_HEIGHT 69
+#define ALARM_TITLE_AMPM_PADDING_HEIGHT 100
+#define ALARM_TITLE_HOUR_PADDING_HEIGHT 127
+
 collections {
-   group { name: "main";
-      parts {
-         part { name: "txt_title";
-            type: TEXT;
-            mouse_events: 0;
-            description { state: "default" 0.0;
-               text { text: "Hello Tizen"; font: "Tizen:style=regular"; size: 20; min: 1 1; align: 0.5 0; ellipsis: -1; }
-               color: 0 0 0 255;
-            }
-         }
-      }
-   }
+
+       styles {
+               style {
+                       name: "ATO006";
+                       base: "font=Tizen:style=Light color=#FAFAFA wrap=none font_size=52 align=center";
+               }
+               style {
+                       name: "ATO007";
+                       base: "font=Tizen:style=Thin color=#FAFAFA wrap=none font_size=183 align=center";
+               }
+               style {
+                       name: "ATO008";
+                       base: "font=Tizen:style=Light color=#FAFAFA wrap=none font_size=48 align=center";
+               }
+       }
+
+       images {
+               image: "alarm_btn_bg.png" COMP;
+               image: "alarm_btn_ic_dismiss.png" COMP;
+               image: "alarm_btn_ic_snooze.png" COMP;
+               image: "alarm_btn_circle_line.png" COMP;
+               image: "alarm_btn_circle_drag.png" COMP;
+       }
+
+       base_scale: 2.6;
+
+       group { "main";
+               parts {
+                       rect { "bg"; scale; nomouse;
+                               desc { "default";
+                                       color: 20 107 147 255;
+                                       align: 0.0 0.0;
+                                       rel1 { relative: 0.0 0.0; }
+                                       rel2 { relative: 1.0 0.0; to_y: "sw.swipe.area"; }
+                               }
+                       }
+                       spacer { "pd.top"; scale; nomouse;
+                               desc { "default";
+                                       min: 0 120;
+                                       max: -1 120;
+                                       align: 0.5 0.0;
+                                       rel1.to: "bg";
+                                       rel2.to: "bg";
+                               }
+                       }
+                       spacer { "pd.bottom"; scale; nomouse;
+                               desc { "default";
+                                       min: 0 120+60;
+                                       max: -1 120+60;
+                                       align: 0.0 1.0;
+                                       rel1.to: "bg";
+                                       rel2.to: "bg";
+                               }
+                       }
+                       textblock { "txt.title"; scale; nomouse;
+                               effect: FAR_SOFT_SHADOW;
+                               desc { "default";
+                                       fixed: 1 1;
+                                       min: 0 ALARM_TITLE_HEIGHT;
+                                       max: -1 ALARM_TITLE_HEIGHT;
+                                       align: 0.5 0.0;
+                                       rel1 { relative: 0.0 1.0; to_y: "pd.top"; }
+                                       text { style: "ATO006"; }
+                               }
+                       }
+                       textblock { "txt.ampm"; scale; nomouse;
+                               effect: FAR_SOFT_SHADOW;
+                               desc { "default";
+                                       min: 0 ALARM_TITLE_HEIGHT;
+                                       max: -1 ALARM_TITLE_HEIGHT;
+                                       align: 0.5 0.0;
+                                       rel1 { relative: 0.0 1.0; to_y: "pd.top";
+                                               offset: 0 ALARM_TITLE_HEIGHT+ALARM_TITLE_AMPM_PADDING_HEIGHT; }
+                                       text { style: "ATO006"; }
+                               }
+                       }
+                       textblock { "txt.time"; scale; nomouse;
+                               effect: FAR_SOFT_SHADOW;
+                               desc { "default";
+                                       min: 0 230;
+                                       max: -1 230;
+                                       align: 0.5 0.0;
+                                       rel1 { relative: 0.0 1.0; to_y: "pd.top";
+                                               offset: 0 ALARM_TITLE_HEIGHT+ALARM_TITLE_HOUR_PADDING_HEIGHT; }
+                                       text { style: "ATO007"; }
+                               }
+                       }
+                       textblock { "txt.date"; scale; nomouse;
+                               effect: FAR_SOFT_SHADOW;
+                               desc { "default";
+                                       min: 0 64;
+                                       max: -1 64;
+                                       align: 0.5 1.0;
+                                       rel2 { to_y: "pd.bottom"; relative: 1.0 0.0; }
+                                       text { style: "ATO008"; }
+                               }
+                       }
+                       swallow { "sw.swipe.area";
+                               desc { "default";
+                                       fixed: 1 1;
+                                       min: 0 438;
+                                       max: -1 438;
+                                       align: 0.0 1.0;
+                                       rel1 { relative: 0.0 1.0; to: "bg"; }
+                                       rel2 { relative: 1.0 1.0; }
+                               }
+                       }
+               }
+       }
+       group {
+               name: "swipe_area";
+               parts {
+                       rect { "bg"; scale; nomouse;
+                               desc {
+                                       state: "default" 0.0;
+                                       color: 255 255 255 255;
+                               }
+                       }
+                       spacer { "left.padding";
+                               desc { "default";
+                                       min: 36 0;
+                                       max: 36 -1;
+                                       align: 0.0 0.5;
+                               }
+                       }
+                       spacer { "right.padding";
+                               desc { "default";
+                                       min: 36 0;
+                                       max: 36 -1;
+                                       align: 1.0 0.5;
+                               }
+                       }
+                       swallow { "swipe.left.button"; scale;
+                               desc { "default";
+                                       fixed: 1 1;
+                                       align: 0.0 0.5;
+                                       rel1 { relative: 1.0 0.0; to_x: "left.padding"; }
+                                       rel2 { relative: 1.0 1.0; }
+                               }
+                       }
+                       swallow { "swipe.right.button"; scale;
+                               desc { "default";
+                                       fixed: 1 1;
+                                       align: 1.0 0.5;
+                                       rel1 { relative: 0.0 0.0; }
+                                       rel2 { relative: 0.0 1.0; to_x: "right.padding"; }
+                               }
+                       }
+               }
+       }
+       group { "button_dismiss";
+               parts {
+                       image { "ic.circle.line"; nomouse;
+                               desc { "default";
+                                       hid;
+                                       fixed: 1 1;
+                                       max: 180 180;
+                                       rel1 { relative: -0.2 -0.2; to: "bg"; }
+                                       rel2 { relative: 1.2 1.2; to: "bg"; }
+                                       color_class: "AO003P";
+                                       image.normal: "alarm_btn_circle_line.png";
+                               }
+                               desc {
+                                       "pressed";
+                                       inherit: "default";
+                                       vis;
+                                       min: 612 612;
+                                       max: -1 -1;
+                               }
+                       }
+                       image { "ic.circle.fill"; nomouse;
+                               desc { "default";
+                                       hid;
+                                       max: 180 180;
+                                       rel1 { relative: -0.2 -0.2; to: "bg"; }
+                                       rel2 { relative: 1.2 1.2; to: "bg"; }
+                                       color_class: "AO003";
+                                       image.normal: "alarm_btn_circle_drag.png";
+                               }
+                               desc { "pressed";
+                                       inherit: "default";
+                                       vis;
+                               }
+                       }
+                       image { "bg"; scale;
+                               desc { "default";
+                                       fixed: 1 1;
+                                       min: 180 180;
+                                       max: 180 180;
+                                       align: 0.0 0.5;
+                                       color_class: "AO003";
+                                       image.normal: "alarm_btn_bg.png";
+                               }
+                               desc { "pressed";
+                                       inherit: "default" 0.0;
+                                       color_class: "AO003P";
+                               }
+                       }
+                       image { "ic.dismiss"; nomouse;
+                               desc { "default";
+                                       max: 80 80;
+                                       align: 0.5 0.5;
+                                       rel1.to: "bg";
+                                       rel2.to: "bg";
+                                       image.normal: "alarm_btn_ic_dismiss.png";
+                               }
+                       }
+                       program {
+                               signal: "mouse,down,*";
+                               source: "bg";
+                               action: STATE_SET "pressed";
+                               transition: DECEL 0.3;
+                               target: "bg";
+                               target: "ic.circle.line";
+                       }
+                       program {
+                               name: "button,drag,finished";
+                               action: STATE_SET "default";
+                               transition: DECEL 0.3;
+                               target: "bg";
+                               target: "ic.circle.line";
+                               target: "ic.circle.fill";
+                       }
+                       program {
+                               signal: "mouse,move";
+                               source: "bg";
+                               script {
+                                       new mx,my,x,y,w,h;
+                                       get_mouse(mx, my);
+
+                                       get_geometry(PART:"bg", x, y, w, h);
+
+                                       new cx, cy;
+                                       cx = x + w/2;
+                                       cy = y + h/2;
+
+                                       new Float:dx = abs(cx - mx) * 2;
+                                       new Float:dy = abs(cy - my) * 2;
+
+                                       new min = round(sqrt((dx * dx) + (dy * dy)));
+
+                                       new lx, ly, lw, lh;
+                                       get_geometry(PART:"ic.circle.line", lx, ly, lw, lh);
+
+                                       if (min >= lw) {
+                                               emit("button,swipe,accept", "button");
+                                               run_program(PROGRAM:"button,drag,finished");
+                                       } else {
+                                               custom_state(PART:"ic.circle.fill", "pressed", 0.0);
+                                               set_state_val(PART:"ic.circle.fill", STATE_MIN, min, min);
+                                               set_state_val(PART:"ic.circle.fill", STATE_MAX, min, min);
+                                               set_state(PART:"ic.circle.fill", "custom", 0.0);
+                                       }
+                               }
+                       }
+                       program {
+                               signal: "mouse,up,*";
+                               source: "bg";
+                               after: "button,drag,finished";
+                       }
+               }
+       }
+       group { "button_snooze";
+               parts {
+                       image { "ic.circle.line"; nomouse;
+                               desc { "default";
+                                       hid;
+                                       fixed: 1 1;
+                                       max: 180 180;
+                                       rel1 { relative: -0.2 -0.2; to: "bg"; }
+                                       rel2 { relative: 1.2 1.2; to: "bg"; }
+                                       color_class: "AO004P";
+                                       image.normal: "alarm_btn_circle_line.png";
+                               }
+                               desc {
+                                       "pressed";
+                                       inherit: "default";
+                                       vis;
+                                       min: 612 612;
+                                       max: -1 -1;
+                               }
+                       }
+                       image { "ic.circle.fill"; nomouse;
+                               desc { "default";
+                                       hid;
+                                       max: 180 180;
+                                       rel1 { relative: -0.2 -0.2; to: "bg"; }
+                                       rel2 { relative: 1.2 1.2; to: "bg"; }
+                                       color_class: "AO004";
+                                       image.normal: "alarm_btn_circle_drag.png";
+                               }
+                               desc { "pressed";
+                                       inherit: "default";
+                                       vis;
+                               }
+                       }
+                       image { "bg"; scale;
+                               desc { "default";
+                                       fixed: 1 1;
+                                       min: 180 180;
+                                       max: 180 180;
+                                       align: 1.0 0.5;
+                                       color_class: "AO004";
+                                       image.normal: "alarm_btn_bg.png";
+                               }
+                               desc { "pressed";
+                                       inherit: "default" 0.0;
+                                       color_class: "AO004P";
+                               }
+                       }
+                       image { "ic.dismiss"; nomouse;
+                               desc { "default";
+                                       max: 80 80;
+                                       align: 0.5 0.5;
+                                       rel1.to: "bg";
+                                       rel2.to: "bg";
+                                       image.normal: "alarm_btn_ic_snooze.png";
+                               }
+                       }
+                       program {
+                               signal: "mouse,down,*";
+                               source: "bg";
+                               action: STATE_SET "pressed";
+                               transition: DECEL 0.3;
+                               target: "bg";
+                               target: "ic.circle.line";
+                       }
+                       program {
+                               name: "button,drag,finished";
+                               action: STATE_SET "default";
+                               transition: DECEL 0.3;
+                               target: "bg";
+                               target: "ic.circle.line";
+                               target: "ic.circle.fill";
+                       }
+                       program {
+                               signal: "mouse,move";
+                               source: "bg";
+                               script {
+                                       new mx,my,x,y,w,h;
+                                       get_mouse(mx, my);
+
+                                       get_geometry(PART:"bg", x, y, w, h);
+
+                                       new cx, cy;
+                                       cx = x + w/2;
+                                       cy = y + h/2;
+
+                                       new Float:dx = abs(cx - mx) * 2;
+                                       new Float:dy = abs(cy - my) * 2;
+
+                                       new min = round(sqrt((dx * dx) + (dy * dy)));
+
+                                       new lx, ly, lw, lh;
+                                       get_geometry(PART:"ic.circle.line", lx, ly, lw, lh);
+
+                                       if (min >= lw) {
+                                               emit("button,swipe,accept", "button");
+                                               run_program(PROGRAM:"button,drag,finished");
+                                       } else {
+                                               custom_state(PART:"ic.circle.fill", "pressed", 0.0);
+                                               set_state_val(PART:"ic.circle.fill", STATE_MIN, min, min);
+                                               set_state_val(PART:"ic.circle.fill", STATE_MAX, min, min);
+                                               set_state(PART:"ic.circle.fill", "custom", 0.0);
+                                       }
+                               }
+                       }
+                       program {
+                               signal: "mouse,up,*";
+                               source: "bg";
+                               after: "button,drag,finished";
+                       }
+               }
+       }
 }

diff --git a/ring/src/ring.c b/ring/src/ring.c
index 7e9fd72..0e83cbc 100644 (file)
--- a/ring/src/ring.c
+++ b/ring/src/ring.c
@@ -73,6 +73,35 @@ create_base_gui(appdata_s *ad)
        /* Show window after base gui is set up */
        evas_object_show(ad->win);
 
+       Evas_Object *swipe_area = elm_layout_add(ad->win);
+       elm_layout_file_set(swipe_area, edj_path, "swipe_area");
+       evas_object_size_hint_weight_set(swipe_area, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+
+       elm_object_part_content_set(ad->layout, "sw.swipe.area", swipe_area);
+
+       evas_object_show(swipe_area);
+
+       Evas_Object *btn_dismiss = elm_layout_add(ad->win);
+       elm_layout_file_set(btn_dismiss, edj_path, "button_dismiss");
+       evas_object_size_hint_weight_set(btn_dismiss, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+
+       elm_object_part_content_set(swipe_area, "swipe.left.button", btn_dismiss);
+
+       evas_object_show(btn_dismiss);
+
+       Evas_Object *btn_snooze = elm_layout_add(ad->win);
+       elm_layout_file_set(btn_snooze, edj_path, "button_snooze");
+       evas_object_size_hint_weight_set(btn_snooze, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+
+       elm_object_part_content_set(swipe_area, "swipe.right.button", btn_snooze);
+
+       evas_object_show(btn_snooze);
+
+       elm_object_part_text_set(ad->layout, "txt.time", "7:00");
+       elm_object_part_text_set(ad->layout, "txt.ampm", "AM");
+       elm_object_part_text_set(ad->layout, "txt.title", "Morning alarm");
+       elm_object_part_text_set(ad->layout, "txt.date", "Wed, 1 December");
+
 }
 
 static bool