Tizen IDE中使用Edje颜色类
本教程演示了如何改变的颜色使用Edje颜色类2个或更多的部分。如果一部分被分配一个颜色类,设置颜色值这类会导致所有这些部分乘以颜色值。 设置值类影响在所有部分颜色类在流程级别,而在对象级别,它只影响部分在一个指定的对象。
创建一个简单的应用程序菜单和单独为每个Edje屏幕动画功能:
Tizen IDE > UI应用/ UI application> EDC Tizen本地项目 并创建一个新项目命名 colorclass 。
打开 colorclass 。 edc 文件并把它换成下面的代码:
rel2.relative: 0.2 0.4;
color2: 255 255 255 255;
color3: 255 255 255 255;
text
{
text: "B:";
size: 44;
}
}
}
part
{
name: "textC";
type: TEXT;
effect: OUTLINE_SHADOW;
description
{
state: "default" 0.0;
color_class: "C";
rel1.relative: 0.0 0.4;
rel2.relative: 0.2 0.6;
color2: 255 255 255 255;
color3: 255 255 255 255;
text
{
text: "C:";
size: 44;
}
}
}
part
{
name: "rect1";
type: RECT;
description
{
state: "default" 0.0;
color_class: "A";
rel1.relative: 0.2 0.0;
rel2.relative: 0.4 0.2;
}
}
part
{
name: "rect2";
type: RECT;
description
{
state: "default" 0.0;
color_class: "B";
rel1.relative: 0.4 0.2;
rel2.relative: 0.6 0.4;
}
}
part
{
name: "rect3";
type: RECT;
description
{
state: "default" 0.0;
color_class: "A";
rel1.relative: 0.6 0.0;
rel2.relative: 0.8 0.2;
}
}
part
{
name: "rect4";
type: RECT;
description
{
state: "default" 0.0;
color_class: "B";
rel1.relative: 0.8 0.2;
rel2.relative: 1.0 0.4;
}
}
part
{
name: "rect5";
type: RECT;
description
{
state: "default" 0.0;
color: 125 0 0 255;
color_class: "C";
rel1.relative: 0.6 0.4;
rel2.relative: 0.8 0.6;
}
}
part
{
name: "rect6";
type: RECT;
description
{
state: "default" 0.0;
color: 255 255 255 255;
color_class: "C";
rel1.relative: 0.8 0.4;
rel2.relative: 1.0 0.6;
}
}
part
{
name: "swallow.btn1";
type: SWALLOW;
description
{
state: "default" 0.0;
rel1.relative: 0.0 0.8;
rel2.relative: 0.45 1.0;
}
}
part
{
name: "swallow.btn2";
type: SWALLOW;
description
{
state: "default" 0.0;
rel1.relative: 0.55 0.8;
rel2.relative: 1.0 1.0;
}
}
}
}
}
设置颜色的一部分 color_class 颜色color 值。 看到颜色类如何影响阴影和轮廓颜色,这些颜色可以设置为白色的部分:
color2: 255 255 255 255;
color3: 255 255 255 255;
部分与 color_class “C” 有不同的颜色,因为他们的基本颜色是不同的。
3.取代 create_base_gui () 函数使用以下代码:
static void
btn1_cb(void *data, Evas_Object *obj, void *event_info)
{
edje_color_class_set("A", rand()%255, rand()%255, rand()%255, 255,
rand()%255, rand()%255, rand()%255, 255,
rand()%255, rand()%255, rand()%255, 255);
}
static void
btn2_cb(void *data, Evas_Object *obj, void *event_info)
{
edje_color_class_set("B", rand()%255, rand()%255, rand()%255, 255,
rand()%255, rand()%255, rand()%255, 255,
rand()%255, rand()%255, rand()%255, 255);
}
static void
create_base_gui(appdata_s *ad)
{
char edj_path = {0, };
// Window
ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE);
elm_win_conformant_set(ad->win, EINA_TRUE);
elm_win_autodel_set(ad->win, EINA_TRUE);
if (elm_win_wm_rotation_supported_get(ad->win))
{
int rots = { 0, 90, 180, 270 };
elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4);
}
evas_object_smart_callback_add(ad->win, "delete,request", win_delete_request_cb, NULL);
// Conformant
ad->conform = elm_conformant_add(ad->win);
elm_win_indicator_mode_set(ad->win, ELM_WIN_INDICATOR_SHOW);
elm_win_indicator_opacity_set(ad->win, ELM_WIN_INDICATOR_OPAQUE);
evas_object_size_hint_weight_set(ad->conform, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
elm_win_resize_object_add(ad->win, ad->conform);
evas_object_show(ad->conform);
// Base layout
app_get_resource(EDJ_FILE, edj_path, (int)PATH_MAX);
ad->layout = elm_layout_add(ad->win);
elm_layout_file_set(ad->layout, edj_path, GRP_MAIN);
evas_object_size_hint_weight_set(ad->layout, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
eext_object_event_callback_add(ad->layout, EEXT_CALLBACK_BACK, layout_back_cb, ad);
elm_object_content_set(ad->conform, ad->layout);
// Buttons
ad->btn1 = elm_button_add(ad->win);
elm_object_part_content_set(ad->layout, "swallow.btn1", ad->btn1);
evas_object_smart_callback_add(ad->btn1, "clicked", btn1_cb, ad);
elm_object_part_text_set(ad->btn1, NULL, "Change A");
ad->btn2 = elm_button_add(ad->win);
elm_object_part_content_set(ad->layout, "swallow.btn2", ad->btn2);
evas_object_smart_callback_add(ad->btn2, "clicked", btn2_cb, ad);
elm_object_part_text_set(ad->btn2, NULL, "Change B");
// Show the window
evas_object_show(ad->win);
}
按下 改变一个 按钮颜色变化的所有部分 color_class 设置为 “A” 但不影响其他部分。 实际的 color , color2 , color3 值保持不变但颜色类值变化。
您可以省略的颜色类声明 .edc 文件和部分地区仍然使用它。 没有视觉效果,除非你改变颜色类的代码。 例如,您可以注释掉颜色类 “B” 当你按下,看看会发生什么 改变B 按钮。
图:Edje colorclass应用程序
页:
[1]