From 428f9069dba91ab23dfc9debdc87e52c23666be4 Mon Sep 17 00:00:00 2001 From: Michal Skorupinski Date: Thu, 13 Apr 2017 18:43:45 +0200 Subject: [PATCH] [UI] Clock view updated according to 0.52 guide. Change-Id: I1f76d78989a17850ea9e1937cd5099352f9f7b0f Signed-off-by: Michal Skorupinski --- res/settings-theme.edc | 1 + res/view/system/clock.edc | 59 ++++-------- res/widget/datetime.edc | 217 +++++++++++++++++++++++++++++++++++++++++++ res/widget/spinner.edc | 52 +++-------- src/view/system/view_clock.c | 32 +++++-- 5 files changed, 277 insertions(+), 84 deletions(-) create mode 100644 res/widget/datetime.edc diff --git a/res/settings-theme.edc b/res/settings-theme.edc index 38f3124..f5ffb73 100644 --- a/res/settings-theme.edc +++ b/res/settings-theme.edc @@ -48,4 +48,5 @@ collections { #include "widget/entry.edc" #include "widget/radio.edc" #include "widget/spinner.edc" + #include "widget/datetime.edc" } diff --git a/res/view/system/clock.edc b/res/view/system/clock.edc index d2b0842..99cd263 100755 --- a/res/view/system/clock.edc +++ b/res/view/system/clock.edc @@ -19,20 +19,17 @@ #define CONTROLS_X1 0.36 #define LABELS_X2 0.32 -#define GUIDE_LABEL_Y1 TITLE_BG_Y2 -#define GUIDE_LABEL_Y2 0.20 - -#define DATE_ITEM_Y1 0.34 +#define DATE_ITEM_Y1 0.30 #define DATE_ITEM_Y2 0.40 -#define DATE_ITEM_X2 0.62 +#define DATE_ITEM_X2 0.80 -#define _24HOUR_ITEM_Y1 0.52 -#define _24HOUR_ITEM_Y2 0.56 -#define _24HOUR_ITEM_X2 0.55 +#define TIME_ITEM_Y1 0.50 +#define TIME_ITEM_Y2 0.60 +#define TIME_ITEM_X2 0.80 -#define TIME_ITEM_Y1 0.64 -#define TIME_ITEM_Y2 0.78 -#define TIME_ITEM_X2 0.62 +#define _24HOUR_ITEM_Y1 0.70 +#define _24HOUR_ITEM_Y2 0.80 +#define _24HOUR_ITEM_X2 0.55 group { @@ -78,22 +75,6 @@ group { } } part { - name, PART_GUIDE; - type, TEXT; - scale, 1; - description { - state, "default" 0.0; - color, 116 116 116 255; - rel1.relative, 0.0 GUIDE_LABEL_Y1; - rel2.relative, 1.0 GUIDE_LABEL_Y2; - text { - font, FONT_LIGHT; - size, 32; - align, 0.5 0.5; - } - } - } - part { name, PART_MAIN_LABEL_DATE; type, TEXT; scale, 1; @@ -121,14 +102,14 @@ group { } } part { - name, PART_MAIN_LABEL_24HOUR; + name, PART_MAIN_LABEL_TIME; type, TEXT; scale, 1; description { state, "default" 0.0; color, 116 116 116 255; - rel1.relative, 0.0 _24HOUR_ITEM_Y1; - rel2.relative, LABELS_X2 _24HOUR_ITEM_Y2; + rel1.relative, 0.0 TIME_ITEM_Y1; + rel2.relative, LABELS_X2 TIME_ITEM_Y2; text { font, FONT_LIGHT; size, 32; @@ -137,25 +118,25 @@ group { } } part { - name, PART_MAIN_ITEM_24HOUR; + name, PART_MAIN_ITEM_TIME; type, SWALLOW; scale, 1; description { state, "default" 0.0; align, 0.0 0.5; - rel1.relative, CONTROLS_X1 _24HOUR_ITEM_Y1; - rel2.relative, _24HOUR_ITEM_X2 _24HOUR_ITEM_Y2; + rel1.relative, CONTROLS_X1 TIME_ITEM_Y1; + rel2.relative, TIME_ITEM_X2 TIME_ITEM_Y2; } } part { - name, PART_MAIN_LABEL_TIME; + name, PART_MAIN_LABEL_24HOUR; type, TEXT; scale, 1; description { state, "default" 0.0; color, 116 116 116 255; - rel1.relative, 0.0 TIME_ITEM_Y1; - rel2.relative, LABELS_X2 TIME_ITEM_Y2; + rel1.relative, 0.0 _24HOUR_ITEM_Y1; + rel2.relative, LABELS_X2 _24HOUR_ITEM_Y2; text { font, FONT_LIGHT; size, 32; @@ -164,14 +145,14 @@ group { } } part { - name, PART_MAIN_ITEM_TIME; + name, PART_MAIN_ITEM_24HOUR; type, SWALLOW; scale, 1; description { state, "default" 0.0; align, 0.0 0.5; - rel1.relative, CONTROLS_X1 TIME_ITEM_Y1; - rel2.relative, TIME_ITEM_X2 TIME_ITEM_Y2; + rel1.relative, CONTROLS_X1 _24HOUR_ITEM_Y1; + rel2.relative, _24HOUR_ITEM_X2 _24HOUR_ITEM_Y2; } } part { diff --git a/res/widget/datetime.edc b/res/widget/datetime.edc new file mode 100644 index 0000000..9bbd4f4 --- /dev/null +++ b/res/widget/datetime.edc @@ -0,0 +1,217 @@ +#define SEPARATOR_WIDTH 50 + + +group { name: "elm/datetime/base/settings.datetime"; + parts { + part { name: "base_bg"; + type: RECT; + scale: 1; + description { state: "default" 0.0; + color: 250 0 0 64; + } + } + part { name: "base"; + type: SPACER; + scale: 1; + description { state: "default" 0.0; + } + } + part { name: "bg"; + type: RECT; + scale: 1; + description { state: "default" 0.0; + rel1 { + relative: 0.0 0.0; + to: ""; + } + rel2 { + relative: 1.0 1.0; + to: ""; + } + color: 250 250 250 255; + } + } + part { name: "right.padding"; + type: SPACER; + scale: 1; + description { state: "default" 0.0; + min: 0 0; + max: 0 -1; + fixed: 1 0; + rel2.to: "bg"; + rel1 { + relative: 1.0 0.0; + to: "bg"; + } + rel2 { + relative: 1.0 1.0; + to: "bg"; + } + align: 1.0 1.0; + } + } + DBG("field0", 255, 0, 0, 255) + part { name: "field0"; + type: SWALLOW; + scale: 1; + description { state: "default" 0.0; + fixed: 1 0; + min: 206 0; + + rel1.relative: 0.0 0.0; + rel2.relative: 0.0 1.0; + align: 0.0 0.5; + } + } + part { name: "center.padding1"; + type: SPACER; + scale: 1; + description { state: "default" 0.0; + fixed: 1 0; + min: SEPARATOR_WIDTH 0; + max: SEPARATOR_WIDTH -1; + rel1 { + relative: 1.0 0.0; + to: "field0"; + } + rel2.to: "field0"; + align: 0.0 0.5; + } + } + part { + name: "separator1"; + type: TEXT; + scale: 1; + description { state: "default" 0.0; + rel1.relative: 1.0 0.0; + rel1.to: "field0"; + rel2.relative: 0.0 1.0; + rel2.to: "field1"; + text { + size: 104; + text: "/"; + } + color: 0 0 0 255; + } + } + DBG("field1", 0, 255, 0, 255) + part { name: "field1"; + type: SWALLOW; + scale: 1; + description { state: "default" 0.0; + fixed: 1 0; + min: 206 0; + rel1 { + relative: 1.0 0.0; + to: "center.padding1"; + } + rel2 { + relative: 0.0 1.0; + to_x: "center.padding2"; + to_y: "center.padding1"; + } + } + } + part { name: "center.padding2"; + type: SPACER; + scale: 1; + description { state: "default" 0.0; + fixed: 1 0; + min: SEPARATOR_WIDTH 0; + max: SEPARATOR_WIDTH -1; + rel1.to: "field2"; + rel2 { + relative: 0.0 1.0; + to: "field2"; + } + align: 1.0 0.5; + } + } + part { + name: "separator2"; + type: TEXT; + scale: 1; + description { state: "default" 0.0; + rel1.relative: 1.0 0.0; + rel1.to: "field1"; + rel2.relative: 0.0 1.0; + rel2.to: "field2"; + text { + size: 104; + text: "/"; + } + color: 0 0 0 255; + } + } + + DBG("center.padding1", 0, 255, 255, 128) + DBG("center.padding2", 255, 0, 255, 128) + + part { name: "field2"; + type: SWALLOW; + scale: 1; + description { state: "default" 0.0; + fixed: 1 0; + min: 206 0; + rel1.to: "right.padding"; + rel2 { + relative: 0.0 1.0; + to: "right.padding"; + } + align: 1.0 0.5; + } + } + part { name: "field3"; + type: SWALLOW; + scale: 1; + description { state: "default" 0.0; + fixed: 1 1; + min: 0 0; + max: 0 0; + visible: 0; + } + } + part { name: "field4"; + type: SWALLOW; + scale: 1; + description { state: "default" 0.0; + fixed: 1 1; + min: 0 0; + max: 0 0; + visible: 0; + } + } + part { name: "field5"; + type: SWALLOW; + scale: 1; + description { state: "default" 0.0; + fixed: 1 1; + min: 0 0; + max: 0 0; + visible: 0; + } + } + part { + name: "event_area"; + type: RECT; + description { state: "default" 0.0; + color: 0 0 0 0; + visible: 0; + } + description { state: "visible" 0.0; + inherit: "default" 0.0; + visible: 1; + } + } + part { name: "access"; + type: RECT; + repeat_events: 1; + description { state: "default" 0.0; + fixed: 1 1; + rel1.to: "bg"; + rel2.to: "bg"; + color: 0 0 0 0; + } + } + } +} \ No newline at end of file diff --git a/res/widget/spinner.edc b/res/widget/spinner.edc index 8b971a5..bcc3ef6 100644 --- a/res/widget/spinner.edc +++ b/res/widget/spinner.edc @@ -1,7 +1,3 @@ -#define WIDTH 100 -#define BUTTON_HEIGHT 20 -#define TEXT_HEIGHT 60 - #define IMAGE_ICON_UP "btn_option_arrow_sel.png" #define IMAGE_ICON_DOWN "btn_option_arrow_sel.png" #define GLIDE_EASE_OUT(duration) CUBIC_BEZIER (duration) 0.25 0.46 0.45 1.0 @@ -22,11 +18,8 @@ group { name: "elm/button/base/spinner/increase/settings.datetime"; parts { part { name: "arrow.image.bg"; type: SPACER; - scale: 0; + scale: 1; description { state: "default" 0.0; - align: 0.5 1.0; - min: WIDTH BUTTON_HEIGHT; - max: WIDTH BUTTON_HEIGHT; } } part { name: "effect_spacer"; @@ -40,7 +33,7 @@ group { name: "elm/button/base/spinner/increase/settings.datetime"; part { name: "tizen_vg_shape"; type: SWALLOW; clip_to: "tizen_vg_shape_clipper"; - scale: 0; + scale: 1; description { state: "default" 0.0; fixed: 1 1; rel1.to: "effect_spacer"; @@ -50,7 +43,6 @@ group { name: "elm/button/base/spinner/increase/settings.datetime"; } description { state: "ready" 0.0; inherit: "default" 0.0; - min: 98 BUTTON_HEIGHT; } description { state: "pressed" 0.0; inherit: "default" 0.0; @@ -84,12 +76,10 @@ group { name: "elm/button/base/spinner/increase/settings.datetime"; } } part { name: "arrow.image"; - scale: 0; + scale: 1; description { state: "default" 0.0; rel1.to: "arrow.image.bg"; rel2.to: "arrow.image.bg"; - min: WIDTH BUTTON_HEIGHT; - max: WIDTH BUTTON_HEIGHT; color: 204 204 204 255; image.normal: IMAGE_ICON_UP; } @@ -104,7 +94,7 @@ group { name: "elm/button/base/spinner/increase/settings.datetime"; } part { name: "focus_image"; type: SPACER; - scale: 0; + scale: 1; description { state: "default" 0.0; align: 0.5 0.0; rel1.to: "arrow.image.bg"; @@ -331,20 +321,15 @@ group { name: "elm/button/base/spinner/decrease/settings.datetime"; parts { part { name: "arrow.image.bg"; type: SPACER; - scale: 0; + scale: 1; description { state: "default" 0.0; - align: 0.5 0.0; - min: WIDTH BUTTON_HEIGHT; - max: WIDTH BUTTON_HEIGHT; } } part { name: "arrow.image"; - scale: 0; + scale: 1; description { state: "default" 0.0; rel1.to: "arrow.image.bg"; rel2.to: "arrow.image.bg"; - min: WIDTH BUTTON_HEIGHT; - max: WIDTH BUTTON_HEIGHT; color: 204 204 204 255; image.normal: IMAGE_ICON_DOWN; map { @@ -374,15 +359,12 @@ group { name: "elm/button/base/spinner/settings.datetime"; type: SPACER; scale: 1; description { state: "default" 0.0; - min: WIDTH TEXT_HEIGHT; } } part { name: "elm.text"; type: TEXT; scale: 1; description { state: "default" 0.0; - min: 0 TEXT_HEIGHT; - max: -1 TEXT_HEIGHT; fixed: 1 1; color: 0 0 0 255; rel1.to: "bg"; @@ -568,7 +550,7 @@ group { name: "elm/spinner/base/settings.datetime"; parts { part { name: "bg"; type: SPACER; - scale: 0; + scale: 1; description { state: "default" 0.0; } } @@ -589,12 +571,11 @@ group { name: "elm/spinner/base/settings.datetime"; } part { name: "elm.swallow.inc_button"; type: SWALLOW; - scale: 0; + scale: 1; description { state: "default" 0.0; align: 0.5 1.0; rel1.relative: 0.0 0.0; - rel2.relative: 1.0 0.0; - rel2.to: "elm.swallow.text_button"; + rel2.relative: 1.0 0.2; visible: 0; } description { state: "active" 0.0; @@ -604,11 +585,10 @@ group { name: "elm/spinner/base/settings.datetime"; } part { name: "elm.swallow.dec_button"; type: SWALLOW; - scale: 0; + scale: 1; description { state: "default" 0.0; align: 0.5 0.0; - rel1.relative: 0.0 1.0; - rel1.to: "elm.swallow.text_button"; + rel1.relative: 0.0 0.8; rel2.relative: 1.0 1.0; visible: 0; } @@ -619,11 +599,12 @@ group { name: "elm/spinner/base/settings.datetime"; } part { name: "elm.swallow.text_button"; type: SWALLOW; - scale: 0; + scale: 1; description { state: "default" 0.0; visible: 1; - min: 0 TEXT_HEIGHT; - max: -1 TEXT_HEIGHT; + rel1.relative: 0.0 0.2; + rel2.relative: 1.0 0.8; + } description { state: "inactive" 0.0; inherit: "default" 0.0; @@ -636,9 +617,6 @@ group { name: "elm/spinner/base/settings.datetime"; visible: 0; rel1.to: "elm.swallow.text_button"; rel2.to: "elm.swallow.text_button"; - min: 0 TEXT_HEIGHT; - max: -1 TEXT_HEIGHT; - fixed: 1 1; } description { state: "active" 0.0; inherit: "default" 0.0; diff --git a/src/view/system/view_clock.c b/src/view/system/view_clock.c index df6a082..d791d8a 100755 --- a/src/view/system/view_clock.c +++ b/src/view/system/view_clock.c @@ -209,9 +209,17 @@ static input_handler date_time_handler = { .unfocused = _dt_unfocused_cb }; -static void _set_spinner_button_style(Evas_Object *spinner) +static void _set_spinner_button_style(Evas_Object *spinner, char *part_name, int height) { - elm_object_style_set(spinner, "settings.datetime"); + Evas_Object *part = NULL; + + if (part_name) + part = elm_object_part_content_get(spinner, part_name); + else + part = spinner; + + evas_object_size_hint_min_set(part, 0, height); + evas_object_size_hint_max_set(part, -1, height); } static void _dbg_datetime(Evas_Object *datetime) @@ -249,19 +257,27 @@ static void _dbg_datetime(Evas_Object *datetime) static void _set_spinner_style(Evas_Object *datetime) { int i; + Evas_Object *spinner; + + elm_object_style_set(datetime, "settings.datetime"); + for (i = 0; i < 10; ++i) { char buf[255]; snprintf(buf, 255, "field%d", i); - Evas_Object *part = elm_object_part_content_get(datetime, buf); - if (!part) { + spinner = elm_object_part_content_get(datetime, buf); + if (!spinner) { dlog_print(DLOG_ERROR, LOG_TAG, "[%s:%d] part(%s) == NULL", __FILE__, __LINE__, buf); continue; } - elm_spinner_editable_set(part, EINA_FALSE); - elm_object_style_set(datetime, "settings.datetime"); - _set_spinner_button_style(part); + elm_spinner_editable_set(spinner, EINA_FALSE); + elm_object_style_set(spinner, "settings.datetime"); + + _set_spinner_button_style(spinner, NULL, 100); + _set_spinner_button_style(spinner, "elm.swallow.inc_button", 20); + _set_spinner_button_style(spinner, "elm.swallow.dec_button", 20); + _set_spinner_button_style(spinner,"elm.swallow.text_button", 60); } } @@ -491,7 +507,7 @@ static bool _add_clock_setting(clock_view_priv_data *priv) settings_clock_set_min_max(priv->date_part); - elm_object_style_set(priv->date_part, "date_layout"); + elm_object_style_set(priv->date_part, "settings.datetime"); elm_datetime_format_set(priv->date_part, "%d/%b/%Y"); -- 2.7.4