dali-toolkit/styles/2048x1080/dali-toolkit-default-theme.json

   1 /*
   2  * Copyright (c) 2019 Samsung Electronics Co., Ltd.
   3  *
   4  * This file is part of Dali Toolkit
   5  *
   6  * Licensed under the Apache License, Version 2.0 (the "License");
   7  * you may not use this file except in compliance with the License.
   8  * You may obtain a copy of the License at
   9  *
  10  * http://www.apache.org/licenses/LICENSE-2.0
  11  *
  12  * Unless required by applicable law or agreed to in writing, software
  13  * distributed under the License is distributed on an "AS IS" BASIS,
  14  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15  * See the License for the specific language governing permissions and
  16  * limitations under the License.
  17  */
  18
  19
  20 //******************************************************************************
  21 //
  22 // Default Reference style theme for a 2048x1080 (2K) resolution, Andriod xxxhdpi DPI.
  23 //
  24 //******************************************************************************
  25
  26 {
  27   "config":
  28   {
  29     "brokenImageUrl":"{DALI_IMAGE_DIR}broken.png",
  30     "alwaysShowFocus":true,
  31     "clearFocusOnEscape":false
  32   },
  33   "styles":
  34   {
  35     "Tooltip":
  36     {
  37       "tooltip":
  38       {
  39         "content":
  40         {
  41           "pointSize":6
  42         },
  43         "waitTime":0.5,
  44         "background":
  45         {
  46           "visual":"{DALI_IMAGE_DIR}tooltip.9.png",
  47           "border":[1,5,5,1]
  48         },
  49         "tail":
  50         {
  51           "visibility":false,
  52           "aboveVisual":"{DALI_IMAGE_DIR}tooltip-tail-above.png",
  53           "belowVisual":"{DALI_IMAGE_DIR}tooltip-tail-below.png"
  54         },
  55         "position":"BELOW",
  56         "hoverPointOffset":[10,10],
  57         "movementThreshold":5,
  58         "disappearOnMovement":false
  59       }
  60     },
  61     "TextLabel":
  62     {
  63       "pointSize":8,
  64       "enableAutoScroll":false,
  65       "autoScrollLoopCount":2,
  66       "autoScrollGap":50,
  67       "autoScrollSpeed":80,
  68       "ignoreSpacesAfterText":false
  69     },
  70
  71     "TextLabelFontSize0":
  72     {
  73       "pointSize":4
  74     },
  75     "TextLabelFontSize1":
  76     {
  77       "pointSize":6
  78     },
  79     "TextLabelFontSize2":
  80     {
  81       "pointSize":8
  82     },
  83     "TextLabelFontSize3":
  84     {
  85       "pointSize":10
  86     },
  87     "TextLabelFontSize4":
  88     {
  89       "pointSize":12
  90     },
  91
  92     "TextField":
  93     {
  94       "pointSize":8,
  95       "primaryCursorColor":[0.0,0.72,0.9,1.0],
  96       "secondaryCursorColor":[0.0,0.72,0.9,1.0],
  97       "cursorWidth":6,
  98       "selectionHighlightColor":[0.75,0.96,1.0,1.0],
  99       "grabHandleImage" : "{DALI_STYLE_IMAGE_DIR}cursor_handler_drop_center.png",
 100       "selectionHandleImageLeft" : {"filename":"{DALI_STYLE_IMAGE_DIR}selection_handle_drop_left.png" },
 101       "selectionHandleImageRight": {"filename":"{DALI_STYLE_IMAGE_DIR}selection_handle_drop_right.png" },
 102       "enableSelection":false
 103     },
 104
 105     "TextFieldFontSize0":
 106     {
 107       "pointSize":10
 108     },
 109     "TextFieldFontSize1":
 110     {
 111       "pointSize":10
 112     },
 113     "TextFieldFontSize2":
 114     {
 115       "pointSize":10
 116     },
 117     "TextFieldFontSize3":
 118     {
 119       "pointSize":10
 120     },
 121     "TextFieldFontSize4":
 122     {
 123       "pointSize":10
 124     },
 125     "TextSelectionPopup":
 126     {
 127       "popupMaxSize":[1700,100],
 128       "optionDividerSize":[2,0],
 129       "popupDividerColor":[0.23,0.72,0.8,0.11],
 130       "popupIconColor":[1.0,1.0,1.0,1.0],
 131       "popupPressedColor":[0.24,0.72,0.8,0.11],
 132       "background": {
 133         "rendererType": "image",
 134         "url": "{DALI_IMAGE_DIR}selection-popup-background.9.png"
 135         },
 136       "backgroundBorder": {
 137         "visualType": "IMAGE",
 138         "url": "{DALI_IMAGE_DIR}selection-popup-border.9.png",
 139         "mixColor":[0.24,0.72,0.8,1.0]
 140         },
 141       "popupFadeInDuration":0.25,
 142       "popupFadeOutDuration":0.25
 143     },
 144     "TextSelectionPopupButton":
 145     {
 146       "label":
 147       {
 148         "visualType":"TEXT",
 149         "pointSize":10
 150       },
 151       "unselectedBackgroundVisual":
 152       {
 153         "visualType": "IMAGE",
 154         "url": ""
 155       },
 156       "selectedBackgroundVisual":
 157       {
 158         "visualType": "IMAGE",
 159         "url": ""
 160       }
 161     },
 162     "TextSelectionToolbar":
 163     {
 164       "enableOvershoot":true,
 165       "enableScrollBar":true,
 166       "scrollView":
 167       {
 168         "overshootAnimationSpeed":360.0,
 169         "overshootSize":[2048.0,130.0]
 170       }
 171     },
 172     "TextSelectionScrollBar":
 173     {
 174       "indicatorShowDuration":0.25,
 175       "indicatorHideDuration":0.25,
 176       "indicatorTransientDuration":1.0
 177     },
 178     "TextSelectionScrollIndicator":
 179     {
 180       "image":
 181       {
 182         "visualType":"IMAGE",
 183         "url":"{DALI_IMAGE_DIR}text_selection_scroll_indicator.9.png"
 184       },
 185       "color":[0.0,0.72,0.9,0.7]
 186     },
 187     "ScrollView":
 188     {
 189       "overshootEffectColor":"B018",
 190       "overshootAnimationSpeed":960.0,
 191       "overshootSize":[2048.0,130.0]
 192     },
 193     "ItemView":
 194     {
 195       "overshootEffectColor":"B018",
 196       "overshootAnimationSpeed":960.0,
 197       "overshootSize":[2048.0,130.0]
 198     },
 199     "ScrollBar":
 200     {
 201       "indicatorShowDuration":0.25,
 202       "indicatorHideDuration":0.25,
 203       "color":[0.0,0.72,0.9,0.7]
 204     },
 205     "TextEditor":
 206     {
 207       "pointSize":8,
 208       "primaryCursorColor":[0.0,0.72,0.9,1.0],
 209       "secondaryCursorColor":[0.0,0.72,0.9,1.0],
 210       "cursorWidth":6,
 211       "selectionHighlightColor":[0.75,0.96,1.0,1.0],
 212       "grabHandleImage" : "{DALI_STYLE_IMAGE_DIR}cursor_handler_drop_center.png",
 213       "selectionHandleImageLeft" : {"filename":"{DALI_STYLE_IMAGE_DIR}selection_handle_drop_left.png" },
 214       "selectionHandleImageRight": {"filename":"{DALI_STYLE_IMAGE_DIR}selection_handle_drop_right.png" },
 215       "enableScrollBar":true,
 216       "scrollBarShowDuration":0.8,
 217       "scrollBarFadeDuration":0.5,
 218       "enableSelection":false
 219     },
 220     "ProgressBar":
 221     {
 222       "trackVisual":{
 223         "visualType":"IMAGE",
 224         "url":"{DALI_IMAGE_DIR}progress-bar-skin-track.9.png"
 225       },
 226       "progressVisual":{
 227         "visualType":"IMAGE",
 228         "url":"{DALI_IMAGE_DIR}progress-bar-skin-progress.9.png"
 229       },
 230       "secondaryProgressVisual":{
 231         "visualType":"IMAGE",
 232         "url":"{DALI_IMAGE_DIR}progress-bar-skin-secondary-progress.9.png"
 233       },
 234       "indeterminateVisual":{
 235         "visualType":"IMAGE",
 236         "pixelArea":[0.0, 0.0, 10.0, 1.0],
 237         "wrapModeU":"REPEAT",
 238         "url":"{DALI_IMAGE_DIR}progress-bar-skin-indeterminate.png"
 239       },
 240       "indeterminateVisualAnimation":
 241       [
 242         {
 243           "target":"indeterminateVisual",
 244           "property":"pixelArea",
 245           "initialValue":[0.0, 0.0, 10.0, 1.0],
 246           "targetValue":[-1.0, 0.0, 10.0, 1.0],
 247           "animator":
 248           {
 249             "alphaFunction":"DEFAULT",
 250             "timePeriod":
 251             {
 252               "duration":0.8,
 253               "delay":0
 254             }
 255           }
 256         }
 257       ],
 258       "labelVisual":{
 259         "visualType": "TEXT",
 260         "textColor": [ 1.0, 1.0, 1.0, 1.0 ],
 261         "pointSize" : 10.0, // Point size must always be provided to Text Visual
 262         "horizontalAlignment": "CENTER",
 263         "verticalAlignment": "CENTER"
 264       },
 265       "progressValue": 0.0,
 266       "secondaryProgressValue":0.0,
 267       "indeterminate": false
 268     },
 269     "CircularProgressBar":
 270     {
 271       "size":[64,64],
 272       "trackVisual":{
 273         "visualType":"ARC",
 274         "mixColor":[0.0,0.165,0.302,1.0],
 275         "thickness":4.0,
 276         "startAngle":0.0,
 277         "cap":"ROUND"
 278       },
 279       "progressVisual":{
 280         "visualType":"ARC",
 281         "mixColor":[0.0,0.549,1.0,1.0],
 282         "thickness":4.0,
 283         "startAngle":0.0,
 284         "cap":"ROUND"
 285       },
 286       "secondaryProgressVisual":{
 287         "visualType":"ARC",
 288         "mixColor":[0.0,0.549,1.0,0.3],
 289         "thickness":4.0,
 290         "startAngle":0.0,
 291         "cap":"ROUND"
 292       },
 293       "indeterminateVisual":{
 294         "visualType":"ARC",
 295         "mixColor":[0.02,0.71,0.525,1.0],
 296         "thickness":4.0,
 297         "startAngle":267.0,
 298         "sweepAngle":75.0,
 299         "cap":"ROUND"
 300       },
 301       "indeterminateVisualAnimation":
 302       [
 303         {
 304           "target":"trackVisual",
 305           "property":"opacity",
 306           "targetValue": 0,
 307           "animator":
 308           {
 309             "alphaFunction":"DEFAULT",
 310             "timePeriod":
 311             {
 312               "duration":0,
 313               "delay":0
 314             }
 315           }
 316         },
 317         {
 318           "target":"secondaryProgressVisual",
 319           "property":"opacity",
 320           "targetValue": 0,
 321           "animator":
 322           {
 323             "alphaFunction":"DEFAULT",
 324             "timePeriod":
 325             {
 326               "duration":0,
 327               "delay":0
 328             }
 329           }
 330         },
 331         {
 332           "target":"progressVisual",
 333           "property":"sweepAngle",
 334           "initialValue": 75,
 335           "targetValue": 180,
 336           "animator":
 337           {
 338             "alphaFunction":[0.439, 0.0, 0.718, 0.428],
 339             "timePeriod":
 340             {
 341               "duration":1.0,
 342               "delay":0.0
 343             }
 344           }
 345         },
 346         {
 347           "target":"progressVisual",
 348           "property":"sweepAngle",
 349           "targetValue": 75,
 350           "animator":
 351           {
 352             "alphaFunction":[0.224, 0.571, 0.53, 1.0],
 353             "timePeriod":
 354             {
 355               "duration":1.0,
 356               "delay":2.0
 357             }
 358           }
 359         },
 360         {
 361           "target":"progressVisual",
 362           "property":"startAngle",
 363           "initialValue": 87,
 364           "targetValue": 1887,
 365           "animator":
 366           {
 367             "alphaFunction":[0.33, 0.0, 0.3, 1.0],
 368             "timePeriod":
 369             {
 370               "duration":3.0,
 371               "delay":0.0
 372             }
 373           }
 374         },
 375         {
 376           "target":"indeterminateVisual",
 377           "property":"sweepAngle",
 378           "initialValue": 75,
 379           "targetValue": 180,
 380           "animator":
 381           {
 382             "alphaFunction":[0.439, 0.0, 0.718, 0.428],
 383             "timePeriod":
 384             {
 385               "duration":1.0,
 386               "delay":0.0
 387             }
 388           }
 389         },
 390         {
 391           "target":"indeterminateVisual",
 392           "property":"sweepAngle",
 393           "targetValue": 75,
 394           "animator":
 395           {
 396             "alphaFunction":[0.224, 0.571, 0.53, 1.0],
 397             "timePeriod":
 398             {
 399               "duration":1.0,
 400               "delay":2.0
 401             }
 402           }
 403         },
 404         {
 405           "target":"indeterminateVisual",
 406           "property":"startAngle",
 407           "initialValue": 267,
 408           "targetValue": 2067,
 409           "animator":
 410           {
 411             "alphaFunction":[0.33, 0.0, 0.3, 1.0],
 412             "timePeriod":
 413             {
 414               "duration":3.0,
 415               "delay":0.0
 416             }
 417           }
 418         }
 419       ],
 420       "labelVisual":{
 421         "visualType": "TEXT",
 422         "textColor": [ 1.0, 1.0, 1.0, 1.0 ],
 423         "pointSize" : 12.0, // Point size must always be provided to Text Visual
 424         "horizontalAlignment": "CENTER",
 425         "verticalAlignment": "CENTER"
 426       },
 427       "progressValue": 0.2,
 428       "secondaryProgressValue":0.4,
 429       "indeterminate": false
 430     },
 431     "Button":
 432     {
 433       "styles":["Tooltip"],
 434       "initialAutoRepeatingDelay":2.0,
 435       "nextAutoRepeatingDelay":0.9
 436       // Note: Visuals added to Button will be used in all derived buttons unless overridden.
 437     },
 438     "PushButton":
 439     {
 440       "styles":["Button"],
 441       "autoRepeating":false,
 442       "togglable":false,
 443       "labelPadding":[ 12.0, 12.0, 12.0, 12.0 ],
 444       "label":
 445        {
 446          "visualType": "TEXT",
 447          "horizontalAlignment": "CENTER",
 448          "pointSize" : 10.0, // Point size must always be provided to Text Visual
 449          "verticalAlignment": "CENTER"
 450        },
 451       "unselectedBackgroundVisual":
 452        {
 453          "visualType": "IMAGE",
 454          "url": "{DALI_IMAGE_DIR}button-up.9.png"
 455        },
 456        "selectedBackgroundVisual":
 457        {
 458          "visualType": "IMAGE",
 459          "url": "{DALI_IMAGE_DIR}button-down.9.png"
 460        },
 461        "disabledSelectedBackgroundVisual":
 462        {
 463          "visualType": "IMAGE",
 464          "url": "{DALI_IMAGE_DIR}button-down-disabled.9.png"
 465        },
 466        "disabledUnselectedBackgroundVisual":
 467        {
 468          "visualType": "IMAGE",
 469          "url": "{DALI_IMAGE_DIR}button-disabled.9.png"
 470        }
 471     },
 472     "ToggleButton":
 473     {
 474       "styles":["Button"]
 475     },
 476     "CheckBoxButton":
 477     {
 478       "styles":["Button"],
 479       "labelPadding":[ 12.0, 12.0, 0.0, 0.0 ],
 480       "label":
 481        {
 482          "visualType": "TEXT",
 483          "pointSize" : 10.0, // Point size must always be provided to Text Visual
 484          "verticalAlignment": "CENTER"
 485        },
 486       "unselectedVisual":
 487       {
 488         "visualType": "IMAGE",
 489         "url": "{DALI_IMAGE_DIR}checkbox-unselected.png"
 490       },
 491       "selectedVisual":
 492       {
 493         "visualType": "IMAGE",
 494         "url": "{DALI_IMAGE_DIR}checkbox-selected.png"
 495       },
 496       "disabledUnselectedVisual":
 497       {
 498         "visualType": "IMAGE",
 499         "url": "{DALI_IMAGE_DIR}checkbox-unselected-disabled.png"
 500       },
 501       "disabledSelectedVisual":
 502       {
 503         "visualType": "IMAGE",
 504         "url": "{DALI_IMAGE_DIR}checkbox-selected-disabled.png"
 505       }
 506     },
 507     "RadioButton":
 508     {
 509       "styles":["Button"],
 510       "labelPadding":[ 12.0, 12.0, 0.0, 0.0 ],
 511       "label":
 512        {
 513          "visualType": "TEXT",
 514          "pointSize" : 10.0, // Point size must always be provided to Text Visual
 515          "verticalAlignment": "CENTER"
 516        },
 517       "unselectedVisual":
 518       {
 519         "visualType": "IMAGE",
 520         "url": "{DALI_IMAGE_DIR}radio-button-unselected.png"
 521       },
 522       "selectedVisual":
 523       {
 524         "visualType": "IMAGE",
 525         "url": "{DALI_IMAGE_DIR}radio-button-selected.png"
 526       },
 527       "disabledUnselectedVisual":
 528       {
 529         "visualType": "IMAGE",
 530         "url": "{DALI_IMAGE_DIR}radio-button-unselected-disabled.png"
 531       },
 532       "disabledSelectedVisual":
 533       {
 534         "visualType": "IMAGE",
 535         "url": "{DALI_IMAGE_DIR}radio-button-selected-disabled.png"
 536       }
 537     }
 538   }
 539 }