themes/widgets/colorselector.edc

   1 /*
   2  * efl-theme-tizen
   3  * Copyright (c) 2012-2013 Samsung Electronics Co., Ltd.
   4  *
   5  * Licensed under the Apache License, Version 2.0 (the License);
   6  * you may not use this file except in compliance with the License.
   7  * You may obtain a copy of the License at
   8  *
   9  *     http://www.apache.org/licenses/LICENSE-2.0
  10  *
  11  * Unless required by applicable law or agreed to in writing, software
  12  * distributed under the License is distributed on an AS IS BASIS,
  13  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14  * See the License for the specific language governing permissions and
  15  * limitations under the License.
  16  */
  17
  18    sounds {
  19       sample {
  20          name: "touch_sound" AS_IS;
  21          source: "S_Touch_30ms.wav";
  22       }
  23    }
  24
  25 group {
  26    name: "elm/colorselector/palette/default";
  27    data.item: "horizontal_pad" COLORSELECTOR_PORTRAIT_HOR_PAD_INC;
  28    data.item: "vertical_pad" COLORSELECTOR_PORTRAIT_VER_PAD_INC;
  29    parts {
  30       part { name: "base";
  31          type: RECT;
  32          scale: 1;
  33          mouse_events: 1;
  34          description { state: "default" 0.0;
  35             visible: 0;
  36             align: 0.0 0.0;
  37          }
  38       }
  39       part { name: "palette";
  40          type: SWALLOW;
  41          scale: 1;
  42          mouse_events: 1;
  43          description { state: "default" 0.0;
  44             align: 0.0 0.0;
  45             fixed: 0 1;
  46             rel1 {
  47                relative: 0.0 0.0;
  48                to: "base";
  49             }
  50             rel2 {
  51                relative: 1.0 0.0;
  52                to: "base";
  53             }
  54          }
  55       }
  56       part{ name: "bottom_padding";
  57          type: RECT;
  58          scale: 1;
  59          description { state: "default" 0.0;
  60             visible: 0;
  61             min: 0 20;
  62             fixed: 0 1;
  63             rel1.relative: 0.0 1.0;
  64             rel1.to: "palette";
  65             rel2.to: "palette";
  66             align: 0.0 0.0;
  67          }
  68       }
  69       part { name: "selector";
  70          type: SWALLOW;
  71          scale: 1;
  72          mouse_events: 1;
  73          description { state: "default" 0.0;
  74             align: 0.0 1.0;
  75             rel1 {
  76                relative: 0.0 1.0;
  77                to: "bottom_padding";
  78             }
  79             rel2 {
  80                relative: 1.0 1.0;
  81                to: "base";
  82             }
  83          }
  84       }
  85    }
  86 }
  87
  88 group {
  89    name: "elm/colorselector/palette/landscape";
  90    data.item: "horizontal_pad" COLORSELECTOR_LANDSCAPE_HOR_PAD_INC;
  91    data.item: "vertical_pad" COLORSELECTOR_LANDSCAPE_VER_PAD_INC;
  92    parts {
  93       part { name: "base";
  94          type: RECT;
  95          scale: 1;
  96          mouse_events: 1;
  97          description { state: "default" 0.0;
  98             visible: 0;
  99             align: 0.0 0.0;
 100          }
 101       }
 102       part { name: "palette";
 103          type: SWALLOW;
 104          scale: 1;
 105          mouse_events: 1;
 106          description { state: "default" 0.0;
 107             align: 0.0 0.0;
 108             fixed: 0 1;
 109             rel1 {
 110                relative: 0.0 0.0;
 111                to: "base";
 112             }
 113             rel2 {
 114                relative: 1.0 0.0;
 115                to: "base";
 116             }
 117          }
 118       }
 119       part{ name: "bottom_padding";
 120          type: RECT;
 121          scale: 1;
 122          description { state: "default" 0.0;
 123             visible: 0;
 124             min: 0 20;
 125             fixed: 0 1;
 126             rel1.relative: 0.0 1.0;
 127             rel1.to: "palette";
 128             rel2.to: "palette";
 129             align: 0.0 0.0;
 130          }
 131       }
 132       part { name: "selector";
 133          type: SWALLOW;
 134          scale: 1;
 135          mouse_events: 1;
 136          description { state: "default" 0.0;
 137             align: 0.0 1.0;
 138             rel1 {
 139                relative: 0.0 1.0;
 140                to: "bottom_padding";
 141             }
 142             rel2 {
 143                relative: 1.0 1.0;
 144                to: "base";
 145             }
 146          }
 147       }
 148    }
 149 }
 150
 151 group{
 152    name: "elm/colorselector/bg/default";
 153    parts{
 154       part{
 155          name: "bg_rect";
 156          type: RECT;
 157          mouse_events: 1;
 158          scale: 1;
 159          description{
 160             state: "default" 0.0;
 161             min: COLORSELECTOR_MIN_W_INC COLORSELECTOR_MIN_H_INC;
 162             color: 0 0 0 0;
 163          }
 164       }
 165       part{ name: "top_padding";
 166          type: RECT;
 167          scale: 1;
 168          ignore_flags: ON_HOLD;
 169          description {
 170             state: "default" 0.0;
 171             min: 1 1;
 172             fixed: 1 1;
 173             color: COLORSELECTOR_PADDING_COLOR_INC;
 174             rel2.relative: 1.0 0.0;
 175             rel1.to: "bg_rect";
 176             rel2.to: "bg_rect";
 177             align: 0.0 0.0;
 178          }
 179       }
 180       part{
 181          name: "elm.colorbar_0";
 182          type: SWALLOW;
 183          mouse_events: 1;
 184          scale: 1;
 185          description{
 186             state: "default" 0.0;
 187             min: 1 COLORSELECTOR_COLORBAR_HEIGHT;
 188             max: COLORSELECTOR_MAX_W_INC COLORSELECTOR_COLORBAR_HEIGHT;
 189             fixed: 0 1;
 190             rel1.relative: 0.0 1.0;
 191             rel1.to_y: "top_padding";
 192             rel2.to_y: "top_padding";
 193             align: 0.5 0.0;
 194          }
 195       }
 196       part{
 197          name: "bottom_padding";
 198          type: RECT;
 199          scale: 1;
 200          ignore_flags: ON_HOLD;
 201          description {
 202             state: "default" 0.0;
 203             visible: 1;
 204             min: 1 1;
 205             fixed: 1 1;
 206             color: COLORSELECTOR_PADDING_COLOR_INC;
 207             rel1.relative: 0.0 1.0;
 208             rel1.to_y: "elm.colorbar_0";
 209             rel2.to_y: "elm.colorbar_0";
 210             align: 0.0 0.0;
 211          }
 212       }
 213       part{
 214          name: "elm.colorbar_1";
 215          type: SWALLOW;
 216          mouse_events: 1;
 217          scale: 1;
 218          description{
 219             state: "default" 0.0;
 220             min: 1 COLORSELECTOR_COLORBAR_HEIGHT;
 221             max: COLORSELECTOR_MAX_W_INC COLORSELECTOR_COLORBAR_HEIGHT;
 222             fixed: 0 1;
 223             rel1.relative: 0.0 1.0;
 224             rel1.to_y: "bottom_padding";
 225             rel2.to_y: "bottom_padding";
 226             align: 0.5 0.0;
 227          }
 228       }
 229       part {
 230          name: "bottom_padding1";
 231          type: RECT;
 232          scale: 1;
 233          ignore_flags: ON_HOLD;
 234          description {
 235             state: "default" 0.0;
 236             visible: 1;
 237             min: 1 1;
 238             fixed: 1 1;
 239             color: COLORSELECTOR_PADDING_COLOR_INC;
 240             rel1.relative: 0.0 1.0;
 241             rel1.to_y: "elm.colorbar_1";
 242             rel2.to_y: "elm.colorbar_1";
 243             align: 0.0 0.0;
 244          }
 245       }
 246       part{
 247          name: "elm.colorbar_2";
 248          type: SWALLOW;
 249          mouse_events: 1;
 250          scale: 1;
 251          description{
 252             state: "default" 0.0;
 253             min: 1 COLORSELECTOR_COLORBAR_HEIGHT;
 254             max: COLORSELECTOR_MAX_W_INC COLORSELECTOR_COLORBAR_HEIGHT;
 255             fixed: 0 1;
 256             rel1.relative: 0.0 1.0;
 257             rel1.to_y: "bottom_padding1";
 258             rel2.to_y: "bottom_padding1";
 259             align: 0.5 0.0;
 260          }
 261       }
 262       part {
 263          name: "bottom_padding2";
 264          type: RECT;
 265          scale: 1;
 266          ignore_flags: ON_HOLD;
 267          description {
 268             state: "default" 0.0;
 269             visible: 1;
 270             min: 1 1;
 271             fixed: 1 1;
 272             color: COLORSELECTOR_PADDING_COLOR_INC;
 273             rel1.relative: 0.0 1.0;
 274             rel1.to_y: "elm.colorbar_2";
 275             rel2.to_y: "bg_rect";
 276             align: 0.0 0.0;
 277          }
 278       }
 279    }
 280 }
 281
 282 group{
 283    name: "elm/colorselector/base/default";
 284    parts{
 285       part{
 286          name: "bg_rect";
 287          type: RECT;
 288          scale: 1;
 289          mouse_events: 1;
 290          description{
 291             state: "default" 0.0;
 292             color: 0 0 0 0;
 293          }
 294       }
 295       part{
 296          name: "bar_bg_padding_rect_l";
 297          type: RECT;
 298          scale: 1;
 299          description{
 300             state: "default" 0.0;
 301             visible: 0;
 302             min: COLORSELECTOR_COLORBAR_LEFT_PADDING 0;
 303             fixed: 1 0;
 304             rel1.relative: 0.0 0.5;
 305             rel2.relative: 0.0 0.5;
 306             align: 0.0 0.5;
 307          }
 308       }
 309       part{
 310          name: "bar_bg_padding_rect_r";
 311          type: RECT;
 312          scale: 1;
 313          description{
 314             state: "default" 0.0;
 315             visible: 0;
 316             min: COLORSELECTOR_COLORBAR_RIGHT_PADDING 0;
 317             fixed: 1 0;
 318             rel1.relative: 1.0 0.5;
 319             rel2.relative: 1.0 0.5;
 320             align: 1.0 0.5;
 321          }
 322       }
 323       part {
 324          name: "button_top_padding";
 325          type: RECT;
 326          scale: 1;
 327          ignore_flags: ON_HOLD;
 328          description {
 329             state: "default" 0.0;
 330             visible: 0;
 331             min: 0 COLORSELECTOR_BUTTON_TOP_PADDING;
 332             fixed: 1 1;
 333             rel1.relative: 0.0 0.0;
 334             rel2.relative: 1.0 0.0;
 335             align: 0.5 0;
 336          }
 337       }
 338       part{
 339          name: "elm.bar_bg";
 340          type: SWALLOW;
 341          mouse_events: 1;
 342          description{
 343             state: "default" 0.0;
 344             rel1 {relative: 1.0 (16/70); to_x: "bar_bg_padding_rect_l";}
 345             rel2 {relative: 0.0 (54/70); to_x: "bar_bg_padding_rect_r";}
 346          }
 347       }
 348       part{
 349          name: "elm.bar";
 350          type: SWALLOW;
 351          mouse_events: 1;
 352          description{
 353             state: "default" 0.0;
 354             rel1.to: "elm.bar_bg";
 355             rel2.to: "elm.bar_bg";
 356          }
 357       }
 358       part{
 359          name: "arrow_bg_padding_rect_l";
 360          type: RECT;
 361          scale: 1;
 362          description{
 363             state: "default" 0.0;
 364             visible: 0;
 365             min: COLORSELECTOR_ARROW_BG_LEFT_PADDING 0;
 366             fixed: 1 0;
 367             rel2.relative: 0.0 1.0;
 368             align: 0.0 0.5;
 369          }
 370       }
 371       part{
 372          name: "arrow_bg_padding_rect_r";
 373          type: RECT;
 374          scale: 1;
 375          description{
 376             state: "default" 0.0;
 377             visible: 0;
 378             min: COLORSELECTOR_ARROW_BG_RIGHT_PADDING 0;
 379             fixed: 1 0;
 380             rel1.relative: 1.0 0.0;
 381             align: 1.0 0.5;
 382          }
 383       }
 384       part{
 385          name: "elm.arrow_bg";
 386          type: SWALLOW;
 387          mouse_events: 1;
 388          description{
 389             state: "default" 0.0;
 390             rel1 {relative: 1.0 (10/70); to_x: "arrow_bg_padding_rect_l";}
 391             rel2 {relative: 0.0 (60/70); to_x: "arrow_bg_padding_rect_r";}
 392          }
 393       }
 394       part{
 395          name: "elm.arrow";
 396          type: RECT;
 397          mouse_events: 0;
 398          scale: 1;
 399          description{
 400             state: "default" 0.0;
 401             min: COLORSELECTOR_ARROW_MIN_WIDTH COLORSELECTOR_ARROW_MIN_HEIGHT;
 402             fixed: 1 1;
 403             align: 0 0.5;
 404             visible: 0;
 405             rel1 {relative: 0.0 0.0; to_y: "elm.arrow_bg";}
 406             rel2 {relative: 0.0 1.0; to_y: "elm.arrow_bg";}
 407          }
 408          dragable{
 409             confine: "elm.arrow_bg";
 410             x: 1 1 0;
 411             y: 0 0 0;
 412          }
 413       }
 414       part{
 415          name: "elm.arrow_icon";
 416          type: SWALLOW;
 417          mouse_events: 0;
 418          scale: 1;
 419          description{
 420             state: "default" 0.0;
 421             fixed: 1 1;
 422             align: 0.5 0.5;
 423             rel1 {
 424                to: "elm.arrow";
 425                offset: COLORSELECTOR_ARROW_REL1_OFFSET;
 426             }
 427             rel2 {
 428                to: "elm.arrow";
 429                offset: COLORSELECTOR_ARROW_REL2_OFFSET;
 430             }
 431          }
 432       }
 433       part{
 434          name: "event";
 435          type: RECT;
 436          scale: 1;
 437          description{
 438             state: "default" 0.0;
 439             min: COLORSELECTOR_DRAGGABLE_EVENT_AREA;
 440             fixed: 1 1;
 441             rel1.to: "elm.arrow_icon";
 442             rel2.to: "elm.arrow_icon";
 443             color: 0 0 0 0;
 444          }
 445          dragable{
 446             events: "elm.arrow";
 447          }
 448       }
 449       part{
 450          name: "l_button_padding_rect";
 451          type: RECT;
 452          mouse_events: 0;
 453          scale: 1;
 454          description{
 455             state: "default" 0.0;
 456             visible: 0;
 457             min: COLORSELECTOR_BUTTON_LEFT_PADDING 0;
 458             fixed: 1 0;
 459             rel2.relative: 0.0 1.0;
 460             align: 0.0 0.5;
 461          }
 462       }
 463       part{
 464          name: "r_button_padding_rect";
 465          type: RECT;
 466          mouse_events: 0;
 467          scale: 1;
 468          description{
 469             state: "default" 0.0;
 470             visible: 0;
 471             min: COLORSELECTOR_BUTTON_RIGHT_PADDING 0;
 472             fixed: 1 0;
 473             rel1.relative: 1.0 0.0;
 474             align: 1.0 0.5;
 475          }
 476       }
 477       part{
 478          name: "elm.l_button";
 479          type: SWALLOW;
 480          mouse_events: 1;
 481          scale: 1;
 482          description{
 483             state: "default" 0.0;
 484             min: COLORSELECTOR_BUTTON_WIDTH COLORSELECTOR_BUTTON_HEIGHT;
 485             fixed: 1 1;
 486             rel1 {relative: 1.0 1.0; to_x: "l_button_padding_rect"; to_y: "button_top_padding";}
 487             rel2 {relative: 1.0 1.0; to_x: "l_button_padding_rect"; to_y: "button_top_padding";}
 488             align: 0.0 0.0;
 489          }
 490       }
 491       part{
 492          name: "elm.r_button";
 493          type: SWALLOW;
 494          mouse_events: 1;
 495          scale: 1;
 496          description{
 497             state: "default" 0.0;
 498             min: COLORSELECTOR_BUTTON_WIDTH COLORSELECTOR_BUTTON_HEIGHT;
 499             fixed: 1 1;
 500             rel1 {relative: 0.0 1.0; to_x: "r_button_padding_rect"; to_y: "button_top_padding";}
 501             rel2 {relative: 0.0 1.0; to_x: "r_button_padding_rect"; to_y: "button_top_padding";}
 502             align: 1.0 0.0;
 503          }
 504       }
 505    }
 506 }
 507
 508 group{
 509    name: "elm/colorselector/image/colorbar_0/default";
 510    images{
 511       image: "00_color_picker_color.png" COMP;
 512    }
 513    parts{
 514       part{
 515          name: "bg";
 516          type: RECT;
 517          mouse_events: 1;
 518          scale: 1;
 519          description{
 520             state: "default" 0.0;
 521             visible: 1;
 522             rel1 {relative: 0.0 0.0; offset: 0 0;}
 523             rel2 {relative: 1.0 1.0; offset: 0 0;}
 524             color: 0 0 0 0;
 525          }
 526       }
 527       part{
 528          name: "colorbar_0_image";
 529          type: IMAGE;
 530          mouse_events: 1;
 531          description{
 532             state: "default" 0.0;
 533             visible: 1;
 534             rel1 {relative: 0.0 0.0; offset: 0 0; to: "bg"; }
 535             rel2 {relative: 1.0 1.0; offset: -1 -1; to: "bg"; }
 536             image.normal:  "00_color_picker_color.png";
 537          }
 538       }
 539    }
 540 }
 541
 542 group{
 543    name: "elm/colorselector/image/colorbar_1/default";
 544    images{
 545       image: "00_color_picker_saturation.png" COMP;
 546    }
 547    parts{
 548       part{
 549          name: "bg";
 550          type: RECT;
 551          scale: 1;
 552          mouse_events: 1;
 553          description{
 554             state: "default" 0.0;
 555             visible: 1;
 556             rel1 {relative: 0.0 0.0; offset: 0 0;}
 557             rel2 {relative: 1.0 1.0; offset: 0 0;}
 558             color: 0 0 0 0;
 559          }
 560       }
 561       part{
 562          name: "colorbar_1_image";
 563          type: IMAGE;
 564          mouse_events: 1;
 565          description{
 566             state: "default" 0.0;
 567             visible: 1;
 568             rel1 {relative: 0.0 0.0; offset: 0 0; to: "bg"; }
 569             rel2 {relative: 1.0 1.0; offset: -1 -1; to: "bg"; }
 570             image.normal:  "00_color_picker_saturation.png";
 571          }
 572       }
 573    }
 574 }
 575
 576 group{
 577    name: "elm/colorselector/image/colorbar_2/default";
 578    images{
 579       image: "00_color_picker_brightness.png" COMP;
 580    }
 581    parts{
 582       part{
 583          name: "bg";
 584          type: RECT;
 585          mouse_events: 1;
 586          scale: 1;
 587          description{
 588             state: "default" 0.0;
 589             visible: 1;
 590             rel1 {relative: 0.0 0.0; offset: 0 0;}
 591             rel2 {relative: 1.0 1.0; offset: 0 0;}
 592             color: 0 0 0 0;
 593          }
 594       }
 595       part{
 596          name: "colorbar_2_image";
 597          type: IMAGE;
 598          mouse_events: 1;
 599          description{
 600             state: "default" 0.0;
 601             visible: 1;
 602             rel1 {relative: 0.0 0.0; offset: 0 0; to: "bg"; }
 603             rel2 {relative: 1.0 1.0; offset: -1 -1; to: "bg"; }
 604             image.normal:  "00_color_picker_brightness.png";
 605          }
 606       }
 607    }
 608 }
 609
 610 group{
 611    name: "elm/colorselector/arrow/default";
 612    images{
 613       image:"00_color_picker_handler.png" COMP;
 614    }
 615    parts{
 616       part{
 617          name: arrow_image;
 618          scale: 1;
 619          type: IMAGE;
 620          mouse_events: 1;
 621          description{
 622             state: "default" 0.0;
 623             image.normal: "00_color_picker_handler.png";
 624          }
 625       }
 626    }
 627 }
 628
 629 group {
 630    name: "elm/colorselector/item/default";
 631    images {
 632       image: "00_color_picker_palette_focus.png" COMP;
 633    }
 634    parts {
 635       part {
 636          name: "color_bg";
 637          type: RECT;
 638          mouse_events:1;
 639          scale: 1;
 640          description {
 641             state: "default" 0.0;
 642             min: COLORSELECTOR_PALETTE_COLORBG_MIN_WIDTH_INC COLORSELECTOR_PALETTE_COLORBG_MIN_HEIGHT_INC;
 643             visible: 0;
 644          }
 645       }
 646       part { name: "color_obj";
 647          type: SWALLOW;
 648          mouse_events: 1;
 649          scale: 1;
 650          description { state: "default" 0.0;
 651             rel1.to: "color_bg";
 652             rel2.to: "color_bg";
 653          }
 654       }
 655       part {
 656          name: "focus_image";
 657          mouse_events:1;
 658          scale: 1;
 659          description {
 660             state: "default" 0.0;
 661             visible: 0;
 662             min: COLORSELECTOR_PALETTE_COLORBG_FOCUS_MIN_WIDTH_INC COLORSELECTOR_PALETTE_COLORBG_FOCUS_MIN_HEIGHT_INC;
 663             image.normal: "00_color_picker_palette_focus.png";
 664             image.border: COLORSELECTOR_PALETTE_BORDER_INC;
 665             image.border_scale: 1;
 666             rel1.to: "color_bg";
 667             rel2.to: "color_bg";
 668          }
 669          description {
 670             state: "focused" 0.0;
 671             inherit: "default" 0.0;
 672             visible: 1;
 673          }
 674       }
 675       part { name: "over1";
 676          type: RECT;
 677          scale: 1;
 678          repeat_events: 1;
 679          description {
 680             state: "default" 0.0;
 681             rel1.to: "color_bg";
 682             rel2.to: "color_bg";
 683             color: 0 0 0 0;
 684          }
 685       }
 686    }
 687    programs {
 688       program { name: "item_focus";
 689          source: "elm";
 690          signal: "elm,state,selected";
 691          action: STATE_SET "focused" 0.0;
 692          target: "focus_image";
 693       }
 694       program { name: "item_unfocus";
 695          source: "elm";
 696          signal: "elm,state,unselected";
 697          action: STATE_SET "default" 0.0;
 698          target: "focus_image";
 699       }
 700       program { name: "touch_snd";
 701          signal: "mouse,clicked,1";
 702          source: "over1";
 703          action: PLAY_SAMPLE "touch_sound" 1.0;
 704       }
 705    }
 706 }
 707
 708 group {
 709    name: "elm/colorselector/item/color/default";
 710    images {
 711       image: "00_color_picker_palette_bg.png" COMP;
 712    }
 713    parts {
 714       part {
 715          name: "color_rect";
 716          type: IMAGE;
 717          mouse_events: 1;
 718          scale: 1;
 719          description{
 720             state: "default" 0.0;
 721             image.normal: "00_color_picker_palette_bg.png";
 722             image.border: COLORSELECTOR_PALETTE_BORDER_INC;
 723             image.border_scale: 1;
 724          }
 725       }
 726    }
 727 }
 728