diff --git a/README.md b/README.md index 3201631..74affe9 100644 --- a/README.md +++ b/README.md @@ -66,6 +66,10 @@ Before running make install as normal: $ gbs build -A [TARGET_ARCH] --define "%enable_debug 1" +### Raspberry Pi builds + + $ gbs build -A [TARGET_ARCH] --define "%rpi_style 1" + # Creating an example - Make a directory in the "examples" directory. Only one example will be created per directory. diff --git a/build/tizen/CMakeLists.txt b/build/tizen/CMakeLists.txt index e3bda7d..e03c7fb 100644 --- a/build/tizen/CMakeLists.txt +++ b/build/tizen/CMakeLists.txt @@ -181,6 +181,7 @@ ENDFOREACH(flag) #Create resources location file CONFIGURE_FILE( resources-location.in ${DEMO_SHARED}/resources-location.cpp ) +MESSAGE("Installing from: ${LOCAL_STYLE_DIR}") FILE(GLOB LOCAL_STYLES_LIST "${LOCAL_STYLE_DIR}/*.json") FOREACH(flag ${LOCAL_STYLES_LIST}) INSTALL(FILES ${flag} DESTINATION ${STYLE_DIR}) diff --git a/packaging/com.samsung.dali-demo.spec b/packaging/com.samsung.dali-demo.spec index 3d2c1ed..dccf5b5 100755 --- a/packaging/com.samsung.dali-demo.spec +++ b/packaging/com.samsung.dali-demo.spec @@ -43,7 +43,12 @@ of the capability of the toolkit. %define dali_app_res_dir %{dali_app_ro_dir}/res/ %define dali_app_exe_dir %{dali_app_ro_dir}/bin/ %define locale_dir %{dali_app_res_dir}/locale + +%if 0%{?rpi_style} +%define local_style_dir ../../resources/style/rpi +%else %define local_style_dir ../../resources/style/mobile +%endif ############################## # Build diff --git a/resources/style/rpi/animated-gradient-call-active-style.json b/resources/style/rpi/animated-gradient-call-active-style.json new file mode 100644 index 0000000..d73dc38 --- /dev/null +++ b/resources/style/rpi/animated-gradient-call-active-style.json @@ -0,0 +1,76 @@ +{ + "styles": { + "IncomeBackground": { + "background": { + "visualType": "ANIMATED_GRADIENT", + "gradientType": "RADIAL", + "unitType": "USER_SPACE", + "startPosition": [0.0, 0.0], + "endPosition": [180.0, 0.0], + "startColor": [0.1333, 0.1647, 0.2941, 1.0], + "endColor": [0.0784, 0.3961, 0.4863, 1.0], + "rotateCenter": [0.0, 0.0], + "rotateAmount": 0.0, + "offset": { + "startValue": 0.0, + "targetValue": 2.0, + "directionType": "BACKWARD", + "duration": 1.25, + "delay": 0.0, + "repeat": -1, + "repeatDelay": 0.0, + "motionType": "LOOP", + "easingType": "LINEAR" + } + } + }, + "ActiveBackground":{ + "background":{ + "visualType": "ANIMATED_GRADIENT", + "gradientType": "RADIAL", + "unitType": "USER_SPACE", + "startPosition": [0.0, 0.0], + "endPosition": [180.0, 0.0], + "startColor": [0.1066, 0.1318, 0.2353, 1.0], + "endColor": [0.0627, 0.3169, 0.3890, 1.0], + "rotateCenter": [0.0, 0.0], + "rotateAmount": 0.0, + "offset": { + "startValue": 0.0, + "targetValue": 2.0, + "directionType": "BACKWARD", + "duration": 4.0, + "delay": 0.0, + "repeat": -1, + "repeatDelay": 0.0, + "motionType": "LOOP", + "easingType": "LINEAR" + } + } + }, + "DeclineButton":{ + "background":{ + "visualType": "ANIMATED_GRADIENT", + "gradientType": "LINEAR", + "unitType": "USER_SPACE", + "startPosition": [-180.0, 0.0], + "endPosition": [180.0, 0.0], + "startColor": [0.8941, 0.0078, 0.0078, 1.0], + "endColor": [1.0000, 0.5961, 0.0000, 1.0], + "rotateCenter": [0.0, 0.0], + "rotateAmount": 0.78539816, + "offset": { + "startValue": 0.0, + "targetValue": 2.0, + "directionType": "FORWARD", + "duration": 1.8, + "delay": -1.2, + "repeat": -1, + "repeatDelay": 1.2, + "motionType": "LOOP", + "easingType": "IN_OUT" + } + } + } + } +} diff --git a/resources/style/rpi/base-theme.json b/resources/style/rpi/base-theme.json new file mode 100644 index 0000000..d8400b3 --- /dev/null +++ b/resources/style/rpi/base-theme.json @@ -0,0 +1,194 @@ +/* + * Copyright (c) 2019 Samsung Electronics Co., Ltd + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +{ + "styles": + { + "CustomPopupStyle":{ + "popupBackgroundImage":"{APPLICATION_RESOURCE_PATH}/images/popup.9.png", + "popupBackgroundBorder":[0,4,4,0], + "tailUpImage":"{APPLICATION_RESOURCE_PATH}/images/popup-tail-up.png", + "tailDownImage":"{APPLICATION_RESOURCE_PATH}/images/popup-tail-down.png", + "tailLeftImage":"{APPLICATION_RESOURCE_PATH}/images/popup-tail-left.png", + "tailRightImage":"{APPLICATION_RESOURCE_PATH}/images/popup-tail-right.png" + }, + + "DemoTileBase": + { + "states": + { + "NORMAL": + { + "color":[0.4, 0.6, 0.9, 0.6], + "visuals": + { + "image": + { + "url":"{APPLICATION_RESOURCE_PATH}/images/demo-tile-texture.9.png", +// TILE_BACKGROUND_ALPHA +// This shader takes a texture. +// An alpha discard is performed. +// The shader uses the tiles position within the scroll-view page and the scroll-views rotation position to create a parallax effect. + "shader": + { + "fragmentShader":[ + " varying mediump vec2 vTexCoord;", + " uniform lowp vec4 uColor;", + " uniform sampler2D sTexture;", + " uniform mediump vec3 uCustomPosition;", + "", + " void main()", + " {", + " if( texture2D( sTexture, vTexCoord ).a <= 0.0001 )", + " {", + " discard;", + " }", + "", + " mediump vec2 wrapTexCoord = vec2( ( vTexCoord.x / 4.0 ) + ( uCustomPosition.x / 4.0 ) + ( uCustomPosition.z / 2.0 ), vTexCoord.y / 4.0 );", + " mediump vec4 color = texture2D( sTexture, wrapTexCoord );", + " mediump float positionWeight = ( uCustomPosition.y + 0.3 ) * color.r * 2.0;", + "", + " gl_FragColor = vec4( positionWeight, positionWeight, positionWeight, 0.9 ) * uColor + vec4( uColor.xyz, 0.0 );", + " }" + ] + } + } + } + }, + "FOCUSED": + { + "color":[0.3, 0.5, 0.8, 0.5], + "visuals": + { + "image": + { + "url":"{APPLICATION_RESOURCE_PATH}/images/demo-tile-texture-focused.9.png", +// TILE_BACKGROUND_ALPHA +// This shader takes a texture. +// An alpha discard is performed. +// The shader uses the tiles position within the scroll-view page and the scroll-views rotation position to create a parallax effect. + "shader": + { + "fragmentShader":[ + " varying mediump vec2 vTexCoord;", + " uniform lowp vec4 uColor;", + " uniform sampler2D sTexture;", + " uniform mediump vec3 uCustomPosition;", + "", + " void main()", + " {", + " if( texture2D( sTexture, vTexCoord ).a <= 0.0001 )", + " {", + " discard;", + " }", + "", + " mediump vec2 wrapTexCoord = vec2( ( vTexCoord.x / 4.0 ) + ( uCustomPosition.x / 4.0 ) + ( uCustomPosition.z / 2.0 ), vTexCoord.y / 4.0 );", + " mediump vec4 color = texture2D( sTexture, wrapTexCoord );", + " mediump float positionWeight = ( uCustomPosition.y + 0.3 ) * color.r * 2.0;", + "", + " gl_FragColor = vec4( positionWeight, positionWeight, positionWeight, 0.9 ) * uColor + vec4( uColor.xyz, 0.0 );", + " }" + ] + } + } + } + } + } + }, + "FocusActor": + { + "visuals": + { + "image": + { + "url":"{APPLICATION_RESOURCE_PATH}/images/tile-focus.9.png" + } + } + }, + "DemoTileBorder": + { + "visuals": + { + "image": + { + "url":"{APPLICATION_RESOURCE_PATH}/images/item-background.9.png" // TILE_BACKGROUND + } + } + }, + "TextLabelRosemary": + { + "fontFamily":"Rosemary" + }, + "TextLabel": + { + "fontStyle":{"weight":"normal"}, + "pointSize":24 + }, + "TextLabelFontSize0": + { + "pointSize":24 + }, + "TextLabelFontSize1": + { + "pointSize":28 + }, + "TextLabelFontSize2": + { + "pointSize":32 + }, + "TextLabelFontSize3": + { + "pointSize":34 + }, + "TextLabelFontSize4": + { + "pointSize":36 + }, + + "Launcherlabel": + { + "pointSize":24 + }, + + "ToolbarLabel": + { + "pointSize":24 + }, + + "BuilderLabel": + { + "pointSize":24 + }, + + "ScrollView": + { + "overshootEffectColor":"B018" + }, + + "GroupLabel": + { + "pointSize":24 + }, + + "ChangeLayoutButton": + { + "label":{ + "pointSize":24 + } + } + } +} diff --git a/resources/style/rpi/basic-light-theme.json b/resources/style/rpi/basic-light-theme.json new file mode 100644 index 0000000..ae863f2 --- /dev/null +++ b/resources/style/rpi/basic-light-theme.json @@ -0,0 +1,44 @@ +/* + * Copyright (c) 2000-2017 Samsung Electronics Co., Ltd + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +{ + "styles": + { + // + // Simple Visuals Application styling + // + "BasicLightButton": + { + "states": + { + "NORMAL": + { + "unselectedBackgroundVisual": + { + "url":"{APPLICATION_RESOURCE_PATH}/images/button-white-up.9.png" + } + }, + "FOCUSED": + { + "unselectedBackgroundVisual": + { + "url":"{APPLICATION_RESOURCE_PATH}/images/button-white-up.9.png" + } + } + } + } + } +} diff --git a/resources/style/rpi/contact-cards-example-theme.json b/resources/style/rpi/contact-cards-example-theme.json new file mode 100644 index 0000000..03ece78 --- /dev/null +++ b/resources/style/rpi/contact-cards-example-theme.json @@ -0,0 +1,35 @@ +/* + * Copyright (c) 2016 Samsung Electronics Co., Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +{ + "styles": + { + "ContactNameTextLabel": + { + "textColor": [ 0, 0, 0, 1 ], + "horizontalAlignment": "CENTER", + "pointSize": 7 + }, + + "ContactDetailTextLabel": + { + "textColor": [ 0, 0, 0, 1 ], + "multiLine": true, + "pointSize": 13 + } + } +} diff --git a/resources/style/rpi/examples-theme.json b/resources/style/rpi/examples-theme.json new file mode 100644 index 0000000..f6e1c6b --- /dev/null +++ b/resources/style/rpi/examples-theme.json @@ -0,0 +1,71 @@ +/* + * Copyright (c) 2019 Samsung Electronics Co., Ltd + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +{ + "includes": + [ + "{APPLICATION_RESOURCE_PATH}/style/base-theme.json" + ], + + "styles": + { + "DemoTile": + { + "styles": ["DemoTileBase"], + "states": + { + "NORMAL": + { + "color":[0.9, 0.4, 0.4, 0.6] + } + } + }, + + "LauncherBackground": + { + "background": + { + "visualType": "GRADIENT", + "center": [360, 640], + "radius": 1468, + "units": "USER_SPACE", + "stopColor": [[0,0,0,1.0],[0.556863,0.054902,0,1.0]] + } + }, + + "BubbleColor1": + { + "color": [ 0.8255, 0.2412, 0.1353, 0.32 ] + }, + + "BubbleColor2": + { + "color": [ 0.8647, 0.4569, 0.3157, 0.32 ] + }, + + "BubbleColor3": + { + "color": [ 0.9804, 0.5412, 0.5510, 0.32 ] + }, + + "BubbleColor4": + { + "color": [ 1, 0, 0, 0.13 ] + } + + } +} diff --git a/resources/style/rpi/images/CheckBg.png b/resources/style/rpi/images/CheckBg.png new file mode 100644 index 0000000..960f947 --- /dev/null +++ b/resources/style/rpi/images/CheckBg.png diff --git a/resources/style/rpi/images/Tick.png b/resources/style/rpi/images/Tick.png new file mode 100644 index 0000000..72bf93e --- /dev/null +++ b/resources/style/rpi/images/Tick.png diff --git a/resources/style/rpi/images/radio-button-selected.png b/resources/style/rpi/images/radio-button-selected.png new file mode 100644 index 0000000..96411bc --- /dev/null +++ b/resources/style/rpi/images/radio-button-selected.png diff --git a/resources/style/rpi/images/radio-button-unselected-disabled.png b/resources/style/rpi/images/radio-button-unselected-disabled.png new file mode 100644 index 0000000..d2d8d24 --- /dev/null +++ b/resources/style/rpi/images/radio-button-unselected-disabled.png diff --git a/resources/style/rpi/images/radio-button-unselected.png b/resources/style/rpi/images/radio-button-unselected.png new file mode 100644 index 0000000..bdf4abd --- /dev/null +++ b/resources/style/rpi/images/radio-button-unselected.png diff --git a/resources/style/rpi/images/shadowButtonBg.9.png b/resources/style/rpi/images/shadowButtonBg.9.png new file mode 100644 index 0000000..996f965 --- /dev/null +++ b/resources/style/rpi/images/shadowButtonBg.9.png diff --git a/resources/style/rpi/images/slider-skin-progress-blue.9.png b/resources/style/rpi/images/slider-skin-progress-blue.9.png new file mode 100644 index 0000000..9477280 --- /dev/null +++ b/resources/style/rpi/images/slider-skin-progress-blue.9.png diff --git a/resources/style/rpi/images/slider-skin-progress-green.9.png b/resources/style/rpi/images/slider-skin-progress-green.9.png new file mode 100644 index 0000000..6738075 --- /dev/null +++ b/resources/style/rpi/images/slider-skin-progress-green.9.png diff --git a/resources/style/rpi/images/slider-skin-progress-red.9.png b/resources/style/rpi/images/slider-skin-progress-red.9.png new file mode 100644 index 0000000..6c8cdbb --- /dev/null +++ b/resources/style/rpi/images/slider-skin-progress-red.9.png diff --git a/resources/style/rpi/progress-bar-example-theme.json b/resources/style/rpi/progress-bar-example-theme.json new file mode 100644 index 0000000..92d0f7f --- /dev/null +++ b/resources/style/rpi/progress-bar-example-theme.json @@ -0,0 +1,58 @@ +/* + * Copyright (c) 2016 Samsung Electronics Co., Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ +{ + "styles": + { + "ProgressBar": + { + "trackVisual":{ + "url":"{APPLICATION_RESOURCE_PATH}/images/new-progress-bar-track.9.png" + }, + "progressVisual":{ + "url":"{APPLICATION_RESOURCE_PATH}/images/new-progress-bar-progress.9.png" + }, + "secondaryProgressVisual":{ + "url":"{APPLICATION_RESOURCE_PATH}/images/new-progress-bar-secondary-progress.9.png" + } + }, + "CircularProgressBar": + { + "trackVisual":{ + "visualType":"ARC", + "mixColor":[1.0, 0.898, 0.769, 1.0], + "thickness":8.0 + }, + "progressVisual":{ + "visualType":"ARC", + "mixColor":[0.965, 0.494, 0.49, 1.0], + "thickness":8.0 + }, + "secondaryProgressVisual":{ + "visualType":"ARC", + "mixColor":[1.0, 0.757, 0.655, 1.0], + "thickness":8.0 + }, + "indeterminateVisual":{ + "visualType":"ARC", + "mixColor":[0.49, 0.478, 0.635, 1.0], + "thickness":8.0, + "startAngle":267.0, + "sweepAngle":75.0 + } + } + } +} diff --git a/resources/style/rpi/simple-example-theme.json b/resources/style/rpi/simple-example-theme.json new file mode 100644 index 0000000..d2b68e5 --- /dev/null +++ b/resources/style/rpi/simple-example-theme.json @@ -0,0 +1,50 @@ +/* + * Copyright (c) 2000-2017 Samsung Electronics Co., Ltd + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +{ + "styles": + { + // + // Simple Visuals Application styling + // + "MyControl": + { + "states": + { + "NORMAL": + { + "visuals": + { + "iconVisual": + { + "url":"{APPLICATION_RESOURCE_PATH}/images/application-icon-13.png" + } + } + }, + "FOCUSED": + { + "visuals": + { + "iconVisual": + { + "url":"{APPLICATION_RESOURCE_PATH}/images/application-icon-83.png" + } + } + } + } + } + } +} diff --git a/resources/style/rpi/style-example-theme-one.json b/resources/style/rpi/style-example-theme-one.json new file mode 100644 index 0000000..74025d2 --- /dev/null +++ b/resources/style/rpi/style-example-theme-one.json @@ -0,0 +1,467 @@ +{ + "constants": + { + "STYLE_DIR":"{APPLICATION_RESOURCE_PATH}/style" + }, + "styles": + { + "Title":{ + "textColor":"#0000ff", + "background": + { + "visualType":"COLOR", + "mixColor": [ 1.0, 1.0, 1.0, 1.0 ] + } + }, + "TableView":{ + "background": + { + "visualType":"COLOR", + "mixColor": [ 1.0, 1.0, 1.0, 0.03 ] + } + }, + "FlexContainer":{ + "background": + { + "visualType":"COLOR", + "mixColor": [ 1.0, 1.0, 1.0, 0.1 ] + } + }, + "RadioButton":{ + "label":{ + "textColor": [1,1,1,1] + } + }, + "CheckBoxButton":{ + "label":{ + "textColor": [1,1,1,1] + } + }, + "ColorLabel1":{ + "textColor": [1,0,0,1] + }, + "ColorLabel2":{ + "textColor": [0,1,0,1] + }, + "ColorLabel3":{ + "textColor": [0.3,0.3,1,1] + }, + "ThemeLabel":{ + "textColor":[0,1,1,1] + }, + "PopupTitle":{ + "textColor":[1,1,1,1] + }, + "PopupBody":{ + "textColor":[1,1,0,1] + }, + "TextLabel":{ + "textColor":[0,0,0,1] + }, + "ColorSlider1":{ + "styles":["Slider"] + }, + "ColorSlider2":{ + "styles":["slider"] + }, + "ColorSlider3":{ + "styles":["slider"] + }, + "ImageChannelControl": + { + "enableVisibilityTransition": + [ + { + "target":"imageVisual", + "property":"opacity", + "initialValue":0, + "targetValue":1, + "animator": + { + "alphaFunction":"EASE_IN_OUT", + "timePeriod": + { + "duration":0.25, + "delay":0 + } + } + }, + { + "target":"imageVisual", + "property":"size", + "targetValue":[1,1] + } + ], + "disableVisibilityTransition": + [ + { + "target":"imageVisual", + "property":"opacity", + "targetValue":0, + "animator": + { + "alphaFunction":"EASE_IN_OUT", + "timePeriod": + { + "duration":0.25, + "delay":0 + } + } + }, + { + "target":"imageVisual", + "property":"size", + "targetValue":[1,1,1] + } + ] + }, + "ShadowButton": + { + "states": + { + "NORMAL": + { + "visuals": + { + "backgroundVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/shadowButtonBg.9.png", + "depthIndex":0 + }, + + "checkboxBgVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/CheckBg.png", + "transform":{ + "size":[0.12, 0.37], + "offset":[30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_BEGIN", + "anchorPoint":"CENTER_BEGIN" + }, + "depthIndex":1 + }, + + "labelVisual":{ + "visualType":"TEXT", + "text":"Don't show again", + "pointSize":8, + "horizontalAlignment":"END", + "verticalAlignment":"CENTER", + "textColor":[1,1,1,1], + "mixColor":[0,0,0,1], + "transform":{ + "size":[0.9, 0.9], + "offset":[-30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_END", + "anchorPoint":"CENTER_END" + }, + "depthIndex":1 + } + }, + + "states": + { + "CHECKED": + { + "visuals": + { + "checkboxFgVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/Tick.png", + "transform":{ + "size":[0.12, 0.37], + "offset":[30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_BEGIN", + "anchorPoint":"CENTER_BEGIN" + }, + "depthIndex":2 + } + }, + "entryTransition": + [ + { + "target":"checkboxFgVisual", + "property":"pixelArea", + "initialValue":[0.0, 0.0, 0.0, 1.0], + "targetValue":[0.0, 0.0, 1.0, 1.0], + "animator": + { + "alphaFunction":"EASE_IN", + "timePeriod": + { + "duration":0.4, + "delay":0 + } + } + }, + { + "target":"checkboxFgVisual", + "property":"size", + "initialValue":[0.0, 0.37], + "targetValue":[0.12, 0.37], + "animator": + { + "alphaFunction":"EASE_IN", + "timePeriod": + { + "duration":0.4, + "delay":0 + } + } + } + ], + "exitTransition": + [ + { + "target":"checkboxFgVisual", + "property":"pixelArea", + "initialValue":[0.0, 0.0, 1.0, 1.0], + "targetValue":[0.0, 0.0, 0.0, 1.0], + "animator": + { + "alphaFunction":"EASE_OUT", + "timePeriod": + { + "duration":0.4, + "delay":0 + } + } + }, + { + "target":"checkboxFgVisual", + "property":"size", + "targetValue":[0.0, 0.37], + "animator": + { + "alphaFunction":"EASE_OUT", + "timePeriod": + { + "duration":0.4, + "delay":0 + } + } + } + ] + }, + "UNCHECKED": + { + } + } + }, + //"FOCUSED" + "DISABLED": + { + "visuals": + { + "checkboxBgVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/CheckBg.png", + "transform":{ + "size":[0.09, 0.28], + "offset":[30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_BEGIN", + "anchorPoint":"CENTER_BEGIN" + }, + "depthIndex":0 + }, + + "checkboxFgVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/Tick.png", + "transform":{ + "size":[0.09, 0.28], + "offset":[30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_BEGIN", + "anchorPoint":"CENTER_BEGIN" + }, + "depthIndex":1 + }, + + "labelVisual":{ + "visualType":"TEXT", + "text":"Don't show again", + "pointSize":8, + "horizontalAlignment":"END", + "verticalAlignment":"CENTER", + "textColor":[1,1,1,1], + "mixColor":[0.3, 0.3, 0.3, 1], + "transform":{ + "size":[0.9, 0.9], + "offset":[-30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_END", + "anchorPoint":"CENTER_END" + }, + "depthIndex":1 + } + }, + "states": + { + "CHECKED": + { + "visuals": + { + "checkboxFgVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/Tick.png", + "transform":{ + "size":[0.09, 0.28], + "offset":[30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_BEGIN", + "anchorPoint":"CENTER_BEGIN" + }, + "depthIndex":2 + } + } + }, + "UNCHECKED": + { + } + } + } + }, + "transitions": + [ + { + "from":"DISABLED", + "to":"NORMAL", + "visualName":"backgroundVisual", + "effect":"FADE_IN", + "animator": + { + "alphaFunction":"EASE_OUT_BACK", + "duration":0.8 + } + }, + { + "from":"DISABLED", + "to":"NORMAL", + "visualName":"*", + "effect":"CROSSFADE", + "animator": + { + "alphaFunction":"EASE_OUT_BACK", + "duration":0.8 + } + }, + { + "from":"NORMAL", + "to":"DISABLED", + "visualName":"backgroundVisual", + "effect":"FADE_OUT", + "animator": + { + "alphaFunction":"EASE_OUT_BACK", + "duration":0.8 + } + }, + { + "from":"NORMAL", + "to":"DISABLED", + "visualName":"*", + "effect":"CROSSFADE", + "animator": + { + "alphaFunction":"EASE_OUT_BACK", + "duration":0.8 + } + } + ] + }, + "BeatControl": + { + "beatVisual":{ + "visualType":"IMAGE", + "url":"{APPLICATION_RESOURCE_PATH}/images/Logo-for-demo.png" + }, + + "bounceTransition": + [ + { + "target":"beatVisual", + "property":"size", + "initialValue":[0.5, 0.5], + "targetValue":[0.75, 0.75], + "animator": + { + "alphaFunction":"BOUNCE", + "timePeriod": + { + "duration":0.5, + "delay":0 + } + } + } + ], + + "leftTransition": + [ + { + "target":"beatVisual", + "property":"offset", + "initialValue":[0, 0], + "targetValue":[0.25, 0], + "animator": + { + "alphaFunction":"BOUNCE", + "timePeriod": + { + "duration":0.5, + "delay":0 + } + } + } + ], + + "upTransition": + [ + { + "target":"beatVisual", + "property":"offset", + "initialValue":[0, 0], + "targetValue":[0, 0.25], + "animator": + { + "alphaFunction":"BOUNCE", + "timePeriod": + { + "duration":0.5, + "delay":0 + } + } + } + ], + + "fadeTransition": + [ + { + "target":"beatVisual", + "property":"opacity", + "targetValue":0, + "animator": + { + "alphaFunction":"BOUNCE", + "timePeriod": + { + "duration":0.8, + "delay":0 + } + } + } + ] + } + } +} diff --git a/resources/style/rpi/style-example-theme-three.json b/resources/style/rpi/style-example-theme-three.json new file mode 100644 index 0000000..f77d957 --- /dev/null +++ b/resources/style/rpi/style-example-theme-three.json @@ -0,0 +1,109 @@ +{ + "styles": + { + "Title":{ + "textColor":"#0000ff", + "background": + { + "visualType":"COLOR", + "mixColor": [ 1.0, 1.0, 1.0, 1.0 ] + } + }, + "TableView":{ + "background": + { + "visualType":"COLOR", + "mixColor": [ 1.0, 1.0, 1.0, 0.03 ] + } + }, + "RadioButton":{ + "label":{ + "textColor": [1,1,1,1] + } + }, + "CheckboxButton":{ + "label":{ + "textColor": [1,1,1,1] + } + }, + "ColorLabel1":{ + "textColor": [1,0,0,1] + }, + "ColorLabel2":{ + "textColor": [0,1,0,1] + }, + "ColorLabel3":{ + "textColor": [0.3,0.3,1,1] + }, + "ThemeLabel":{ + "textColor":[0,1,1,1] + }, + "PopupTitle":{ + "textColor":[1,1,1,1] + }, + "PopupBody":{ + "textColor":[1,1,0,1] + }, + "TextLabel":{ + "textColor":[0,0,0,1] + }, + "ImageChannelControl": + { + "enableVisibilityTransition": + [ + { + "target":"imageVisual", + "property":"size", + "initialValue":[0.1,0.1], + "targetValue":[1,1], + "animator": + { + "alphaFunction":"EASE_IN", + "timePeriod": + { + "duration":0.3, + "delay":0.1 + } + } + }, + { + "target":"imageVisual", + "property":"mixColor", + "targetValue":[1,1,1,1] + } + ], + "disableVisibilityTransition": + [ + { + "target":"imageVisual", + "property":"size", + "initialValue":[1,1], + "targetValue":[0.1,0.1], + "animator": + { + "alphaFunction":"EASE_OUT", + "timePeriod": + { + "duration":0.3, + "delay":0.0 + } + } + }, + { + "target":"imageVisual", + "property":"mixColor", + "targetValue":[1,1,1,0], + "animator": + { + "alphaFunction":"EASE_OUT", + "timePeriod": + { + "duration":0.3, + "delay":0.0 + } + } + } + ] + } + } +} diff --git a/resources/style/rpi/style-example-theme-two.json b/resources/style/rpi/style-example-theme-two.json new file mode 100644 index 0000000..fa8ed33 --- /dev/null +++ b/resources/style/rpi/style-example-theme-two.json @@ -0,0 +1,235 @@ +{ + "constants": + { + "STYLE_DIR":"{APPLICATION_RESOURCE_PATH}/style" + }, + "styles": + { + "Title":{ + "textColor":"#0000ff", + "background": + { + "visualType":"COLOR", + "mixColor": [ 1.0, 1.0, 1.0, 1.0 ] + } + }, + "TableView":{ + "background": + { + "visualType":"GRADIENT", + "startPosition": [0,-1], + "endPosition": [0,1], + "stopColor": [ [ 1.0, 0.0, 1.0, 0.03 ], [1.0,0.0,1.0,0.15] ] + } + }, + + // Change an icon size, see if it gets properly re-sized + "RadioButton":{ + "unselectedVisual": + { + "visualType": "IMAGE", + "url": "{STYLE_DIR}/images/radio-button-unselected.png" + }, + "selectedVisual": + { + "visualType": "IMAGE", + "url": "{STYLE_DIR}/images/radio-button-selected.png" + }, + "label":{ + "textColor": [0.1,1,1,1] + } + }, + "checkboxbutton":{ + "label":{ + "textColor": [1,1,1,1] + } + }, + "colorLabel1":{ + "textColor": [1,0,0,1] + }, + "colorLabel2":{ + "textColor": [0,1,0,1] + }, + "colorLabel3":{ + "textColor": [0.3,0.3,1,1] + }, + "themelabel":{ + "textColor":[0,1,1,1] + }, + "popupTitle":{ + "textColor":[1,1,1,1] + }, + "popupBody":{ + "textColor":[1,1,0,1] + }, + + // Note, this overrides any non-renamed label styles, e.g. those in a button. + "TextLabel":{ + //"textColor":[0,0,0,1] + }, + + "ThinSlider":{ + "styles": ["slider"], + "showPopup":true, + "showValue":false, + "valuePrecision":0, + "handleVisual":{ + "size":[48,48] + }, + "trackVisual":{ + "size":[10, 10] + }, + "enabled":true + }, + "ColorSlider1":{ + "styles":["ThinSlider"], + "progressVisual":{ + "url":"{STYLE_DIR}/images/slider-skin-progress-red.9.png" + } + }, + "ColorSlider2":{ + "styles":["ThinSlider"], + "progressVisual":{ + "url":"{STYLE_DIR}/images/slider-skin-progress-green.9.png" + } + }, + "ColorSlider3":{ + "styles":["thinslider"], + "progressVisual":{ + "url":"{STYLE_DIR}/images/slider-skin-progress-blue.9.png" + } + }, + "ImageChannelControl": + { + "enableVisibilityTransition": + [ + { + "target":"imageVisual", + "property":"mixColor", + "initialValue":[1,1,1,0], + "targetValue":[1,1,1,1], + "animator": + { + "alphaFunction":"EASE_IN_OUT", + "timePeriod": + { + "duration":0.4, + "delay":0 + } + } + }, + { + "target":"imageVisual", + "property":"size", + "targetValue":[1,1] + } + ], + "disableVisibilityTransition": + [ + { + "target":"imageVisual", + "property":"mixColor", + "targetValue":[1,1,1,0], + "animator": + { + "alphaFunction":"EASE_IN_OUT", + "timePeriod": + { + "duration":0.4, + "delay":0.2 + } + } + }, + { + "target":"imageVisual", + "property":"size", + "targetValue":[1,1] + } + ] + }, + "ShadowButton": + { + "backgroundVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/shadowButtonBg.9.png" + }, + "checkboxBgVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/CheckBg.png", + "transform":{ + "size":[0.09, 0.28], + "offset":[30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_BEGIN", + "anchorPoint":"CENTER_BEGIN" + } + }, + "checkboxFgVisual":{ + "visualType":"IMAGE", + "url":"{STYLE_DIR}/images/Tick.png", + "transform":{ + "size":[0.09, 0.28], + "offset":[30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_BEGIN", + "anchorPoint":"CENTER_BEGIN" + } + }, + "labelVisual":{ + "visualType":"TEXT", + "text":"Don't show again", + "pointSize":8, + "horizontalAlignment":"END", + "verticalAlignment":"CENTER", + "textColor":[1,1,1,1], + "mixColor":[0.3, 0.3, 0.3, 1], + "transform":{ + "size":[0.9, 0.9], + "offset":[-30,0], + "offsetPolicy":["ABSOLUTE", "ABSOLUTE"], + "sizePolicy":["RELATIVE", "RELATIVE"], + "origin":"CENTER_END", + "anchorPoint":"CENTER_END" + } + }, + "activeTransition": + [ + { + "target":"checkboxBgVisual", + "property":"size", + "initialValue":[0.09, 0.28], + "targetValue":[0.12, 0.37], + "animator": + { + "alphaFunction":"EASE_OUT_BACK", + "timePeriod": + { + "duration":0.8, + "delay":0 + } + } + } + ], + "inactiveTransition": + [ + { + "target":"checkboxBgVisual", + "property":"size", + "initialValue":[0.12, 0.37], + "targetValue":[0.09, 0.28], + "animator": + { + "alphaFunction":"EASE_OUT_BACK", + "timePeriod": + { + "duration":0.8, + "delay":0 + } + } + } + ] + } + } +} diff --git a/resources/style/rpi/tests-theme.json b/resources/style/rpi/tests-theme.json new file mode 100644 index 0000000..90d8049 --- /dev/null +++ b/resources/style/rpi/tests-theme.json @@ -0,0 +1,70 @@ +/* + * Copyright (c) 2019 Samsung Electronics Co., Ltd + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +{ + "includes": + [ + "{APPLICATION_RESOURCE_PATH}/style/base-theme.json" + ], + + "styles": + { + "DemoTile": + { + "styles": ["DemoTileBase"], + "states": + { + "NORMAL": + { + "color":[0.6, 0.4, 0.9, 0.6] + } + } + }, + + "LauncherBackground": + { + "background": + { + "visualType": "GRADIENT", + "center": [360, 640], + "radius": 1468, + "units": "USER_SPACE", + "stopColor": [[0.392157,0.254902,0.647059,1.0],[0.164706,0.0313725,0.270588,1.0]] + } + }, + + "BubbleColor1": + { + "color": [ 0.8255, 0.2412, 0.9353, 0.32 ] + }, + + "BubbleColor2": + { + "color": [ 0.8647, 0.4569, 0.8157, 0.32 ] + }, + + "BubbleColor3": + { + "color": [ 0.9804, 0.5412, 0.9510, 0.32 ] + }, + + "BubbleColor4": + { + "color": [ 1, 1, 1, 0.13 ] + } + + } +} diff --git a/resources/style/rpi/text-editor-example-theme.json b/resources/style/rpi/text-editor-example-theme.json new file mode 100644 index 0000000..48470b4 --- /dev/null +++ b/resources/style/rpi/text-editor-example-theme.json @@ -0,0 +1,34 @@ +/* + * Copyright (c) 2000-2017 Samsung Electronics Co., Ltd + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +{ + "styles": + { + "ScrollBar": + { + "indicatorShowDuration":1.0, + "indicatorHideDuration":1.0, + "background": { + "rendererType": "image", + "url": "{APPLICATION_RESOURCE_PATH}/images/button-disabled.9.png" + } + }, + "ScrollBarIndicator": + { + "resourceUrl":"{APPLICATION_RESOURCE_PATH}/images/button-white-up.9.png" + } + } +} diff --git a/resources/style/rpi/tooltip-example-theme.json b/resources/style/rpi/tooltip-example-theme.json new file mode 100644 index 0000000..aa2cfb5 --- /dev/null +++ b/resources/style/rpi/tooltip-example-theme.json @@ -0,0 +1,85 @@ +/* + * Copyright (c) 2016 Samsung Electronics Co., Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * + */ + +{ + "styles": + { + "TooltipTextOnly" : + { + "tooltip": "Using defaults defined in the Toolkit stylesheet" + }, + + "TooltipArray" : + { + "tooltip" : + { + "content" : + [ + { + "visualType" : "IMAGE", + "url" : "{APPLICATION_RESOURCE_PATH}/images/application-icon-0.png", + "desiredWidth" : 75, + "desiredHeight" : 75 + }, + { + "visualType" : "TEXT", + "text" : "An icon on the left and\nmulti-line text on the right", + "multiLine" : true, + "pointSize" : 16 + } + ], + "tail" : true + } + }, + + "TooltipCustom" : + { + "tooltip": + { + "content": + { + "visualType" : "TEXT", + "textColor" : [1,1,1,1], + "text" : "Completely custom style\nthat disappears on movement", + "multiLine" : true, + "pointSize" : 16 + }, + "waitTime":0.5, + "background": + { + "visual":"{APPLICATION_RESOURCE_PATH}/images/tooltip.9.png", + "border":[1,5,5,1] + }, + "tail": + { + "visibility":true, + "aboveVisual":"{APPLICATION_RESOURCE_PATH}/images/tooltip-tail-above.png", + "belowVisual":"{APPLICATION_RESOURCE_PATH}/images/tooltip-tail-below.png" + }, + "position":"ABOVE", + "hoverPointOffset":[10,10], + "movementThreshold":5, + "disappearOnMovement":true + } + }, + + "TableView" : + { + "cellPadding" : [ 5.0, 5.0 ] + } + } +}