git.iko.soy/unity8
on xenial help sign in
Move luminance calculation out to Utils.Style
f4a7f03Michał Sawicz
plugins/Dash/CardCreator.js+4−3
compare with xenial
unifiedsplit
@@ -29,7 +29,7 @@ var kBackgroundLoaderCode = 'Loader {\n\
29 gradientColor: getColor(1) || color; \n\
29 gradientColor: getColor(1) || color; \n\
30 anchors.fill: parent; \n\
30 anchors.fill: parent; \n\
31 image: backgroundImage.source ? backgroundImage : null; \n\
31 image: backgroundImage.source ? backgroundImage : null; \n\
32− property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b; \n\
32+ property real luminance: Style.luminance(color); \n\
33 property Image backgroundImage: Image { \n\
33 property Image backgroundImage: Image { \n\
34 objectName: "backgroundImage"; \n\
34 objectName: "backgroundImage"; \n\
35 source: { \n\
35 source: { \n\
@@ -108,7 +108,7 @@ var kOverlayLoaderCode = 'Loader { \n\
108 sourceComponent: ShaderEffect { \n\
108 sourceComponent: ShaderEffect { \n\
109 id: overlay; \n\
109 id: overlay; \n\
110 height: (fixedHeaderHeight > 0 ? fixedHeaderHeight : headerHeight) + units.gu(2); \n\
110 height: (fixedHeaderHeight > 0 ? fixedHeaderHeight : headerHeight) + units.gu(2); \n\
111− property real luminance: 0.2126 * overlayColor.r + 0.7152 * overlayColor.g + 0.0722 * overlayColor.b; \n\
111+ property real luminance: Style.luminance(overlayColor); \n\
112 property color overlayColor: cardData && cardData["overlayColor"] || "#99000000"; \n\
112 property color overlayColor: cardData && cardData["overlayColor"] || "#99000000"; \n\
113 property var source: ShaderEffectSource { \n\
113 property var source: ShaderEffectSource { \n\
114 id: shaderSource; \n\
114 id: shaderSource; \n\
@@ -649,7 +649,8 @@ function cardString(template, components) {
649function createCardComponent(parent, template, components) {
649function createCardComponent(parent, template, components) {
650 var imports = 'import QtQuick 2.2; \n\
650 var imports = 'import QtQuick 2.2; \n\
651 import Ubuntu.Components 1.1; \n\
651 import Ubuntu.Components 1.1; \n\
652− import Dash 0.1;\n';
652+ import Dash 0.1;\n\
653+ import Utils 0.1;\n';
653 var card = cardString(template, components);
654 var card = cardString(template, components);
654 var code = imports + 'Component {\n' + card + '}\n';
655 var code = imports + 'Component {\n' + card + '}\n';
655
656
plugins/Dash/ScopeStyle.qml+6−13
@@ -15,6 +15,7 @@
15 */
15 */
16
16
17import QtQuick 2.2
17import QtQuick 2.2
18+import Utils 0.1
18
19
19/*! \brief Helper for processing scope customization options.
20/*! \brief Helper for processing scope customization options.
20
21
@@ -27,25 +28,17 @@ QtObject {
27 /// Style object passed from the scope
28 /// Style object passed from the scope
28 property var style: Object()
29 property var style: Object()
29
30
30− /*! \brief Calculate luminance of the passed color
31−
32− \note If not fully opaque, luminance is dependant on blending.
33− */
34− function luminance(color) {
35− return 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;
36− }
37−
38 /// Color used for text and symbolic icons
31 /// Color used for text and symbolic icons
39 readonly property color foreground: "foreground-color" in style ? style["foreground-color"] : d.defaultDark
32 readonly property color foreground: "foreground-color" in style ? style["foreground-color"] : d.defaultDark
40
33
41 /// Luminance of the foreground color
34 /// Luminance of the foreground color
42− readonly property real foregroundLuminance: foreground ? luminance(foreground) : d.defaultForegroundLuminance
35+ readonly property real foregroundLuminance: foreground ? Style.luminance(foreground) : d.defaultForegroundLuminance
43
36
44 /// Color used for the overall background
37 /// Color used for the overall background
45 readonly property color background: "background-color" in style ? style["background-color"] : "transparent"
38 readonly property color background: "background-color" in style ? style["background-color"] : "transparent"
46
39
47− /// Luminance of the foreground color
40+ /// Luminance of the background color
48− readonly property real backgroundLuminance: background ? luminance(background) : d.defaultBackgroundLuminance
41+ readonly property real backgroundLuminance: background ? Style.luminance(background) : d.defaultBackgroundLuminance
49
42
50 /*! \brief Luminance threshold for switching between fore and background color
43 /*! \brief Luminance threshold for switching between fore and background color
51
44
@@ -97,8 +90,8 @@ QtObject {
97 // FIXME: should be taken from the theme
90 // FIXME: should be taken from the theme
98 readonly property color defaultLight: "white"
91 readonly property color defaultLight: "white"
99 readonly property color defaultDark: Theme.palette.normal.baseText
92 readonly property color defaultDark: Theme.palette.normal.baseText
100− readonly property real defaultLightLuminance: luminance(defaultLight)
93+ readonly property real defaultLightLuminance: Style.luminance(defaultLight)
101− readonly property real defaultDarkLuminance: luminance(defaultDark)
94+ readonly property real defaultDarkLuminance: Style.luminance(defaultDark)
102
95
103 readonly property var headerStyle: "page-header" in style ? style["page-header"] : { }
96 readonly property var headerStyle: "page-header" in style ? style["page-header"] : { }
104 }
97 }
plugins/Utils/Style.jsnew file+33
@@ -0,0 +1,33 @@
1+/*
2+ * Copyright (C) 2014 Canonical, Ltd.
3+ *
4+ * This program is free software; you can redistribute it and/or modify
5+ * it under the terms of the GNU General Public License as published by
6+ * the Free Software Foundation; version 3.
7+ *
8+ * This program is distributed in the hope that it will be useful,
9+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
10+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11+ * GNU General Public License for more details.
12+ *
13+ * You should have received a copy of the GNU General Public License
14+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
15+ */
16+
17+.pragma library
18+
19+/*! \brief Calculate average luminance of the passed colors
20+
21+ \note If not fully opaque, luminance is dependant on blending.
22+ */
23+function luminance() {
24+ var sum = 0;
25+ for (var k in arguments) {
26+ // only way to convert string to color
27+ var c = Qt.lighter(arguments[k], 1.0);
28+
29+ sum += 0.2126 * c.r + 0.7152 * c.g + 0.0722 * c.b;
30+ }
31+
32+ return sum / arguments.length;
33+}
plugins/Utils/qmldir+1
@@ -1,3 +1,4 @@
1module Utils
1module Utils
2plugin Utils-qml
2plugin Utils-qml
3typeinfo Utils.qmltypes
3typeinfo Utils.qmltypes
4+Style 0.1 Style.js
tests/plugins/Dash/cardcreator/2.res+1−1
@@ -26,7 +26,7 @@ Loader {
26 gradientColor: getColor(1) || color;
26 gradientColor: getColor(1) || color;
27 anchors.fill: parent;
27 anchors.fill: parent;
28 image: backgroundImage.source ? backgroundImage : null;
28 image: backgroundImage.source ? backgroundImage : null;
29− property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;
29+ property real luminance: Style.luminance(color);
30 property Image backgroundImage: Image {
30 property Image backgroundImage: Image {
31 objectName: "backgroundImage";
31 objectName: "backgroundImage";
32 source: {
32 source: {
tests/plugins/Dash/cardcreator/5.res+1−1
@@ -69,7 +69,7 @@ Loader {
69 sourceComponent: ShaderEffect {
69 sourceComponent: ShaderEffect {
70 id: overlay;
70 id: overlay;
71 height: (fixedHeaderHeight > 0 ? fixedHeaderHeight : headerHeight) + units.gu(2);
71 height: (fixedHeaderHeight > 0 ? fixedHeaderHeight : headerHeight) + units.gu(2);
72− property real luminance: 0.2126 * overlayColor.r + 0.7152 * overlayColor.g + 0.0722 * overlayColor.b;
72+ property real luminance: Style.luminance(overlayColor);
73 property color overlayColor: cardData && cardData["overlayColor"] || "#99000000";
73 property color overlayColor: cardData && cardData["overlayColor"] || "#99000000";
74 property var source: ShaderEffectSource {
74 property var source: ShaderEffectSource {
75 id: shaderSource;
75 id: shaderSource;
tests/plugins/Dash/cardcreator/6.res+1−1
@@ -26,7 +26,7 @@ Loader {
26 gradientColor: getColor(1) || color;
26 gradientColor: getColor(1) || color;
27 anchors.fill: parent;
27 anchors.fill: parent;
28 image: backgroundImage.source ? backgroundImage : null;
28 image: backgroundImage.source ? backgroundImage : null;
29− property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;
29+ property real luminance: Style.luminance(color);
30 property Image backgroundImage: Image {
30 property Image backgroundImage: Image {
31 objectName: "backgroundImage";
31 objectName: "backgroundImage";
32 source: {
32 source: {
tests/plugins/Dash/cardcreator/7.res+1−1
@@ -26,7 +26,7 @@ Loader {
26 gradientColor: getColor(1) || color;
26 gradientColor: getColor(1) || color;
27 anchors.fill: parent;
27 anchors.fill: parent;
28 image: backgroundImage.source ? backgroundImage : null;
28 image: backgroundImage.source ? backgroundImage : null;
29− property real luminance: 0.2126 * color.r + 0.7152 * color.g + 0.0722 * color.b;
29+ property real luminance: Style.luminance(color);
30 property Image backgroundImage: Image {
30 property Image backgroundImage: Image {
31 objectName: "backgroundImage";
31 objectName: "backgroundImage";
32 source: {
32 source: {
tests/plugins/Dash/tst_ScopeStyle.qml+1−21
@@ -18,6 +18,7 @@ import QtQuick 2.2
18import QtTest 1.0
18import QtTest 1.0
19import Dash 0.1
19import Dash 0.1
20import Ubuntu.Components 1.1
20import Ubuntu.Components 1.1
21+import Utils 0.1
21
22
22Rectangle {
23Rectangle {
23 width: units.gu(40)
24 width: units.gu(40)
@@ -49,27 +50,6 @@ Rectangle {
49 testCase.color = "transparent";
50 testCase.color = "transparent";
50 }
51 }
51
52
52− function test_luminance_data() {
53− return [
54− { tag: "#F00", luminance: 0.2126 },
55− { tag: "#0F0", luminance: 0.7152 },
56− { tag: "#00F", luminance: 0.0722 },
57− { tag: "white", luminance: 1.0 },
58− { tag: "black", luminance: 0.0 },
59− { tag: "lightgrey", luminance: 0.8275 },
60− { tag: "grey", luminance: 0.5020 },
61− { tag: "darkgrey", luminance: 0.6627 },
62− { tag: "red", luminance: 0.2126 },
63− { tag: "green", luminance: 0.3590 },
64− { tag: "blue", luminance: 0.0722 },
65− ];
66− }
67−
68− function test_luminance(data) {
69− testCase.color = data.tag;
70− compare(tool.luminance(testCase.color).toFixed(4), data.luminance.toFixed(4));
71− }
72−
73 function test_foreground_data() {
53 function test_foreground_data() {
74 return [
54 return [
75 { tag: "default", index: 0, foreground: Theme.palette.normal.foreground, luminance: 0.5725 },
55 { tag: "default", index: 0, foreground: Theme.palette.normal.foreground, luminance: 0.5725 },
tests/plugins/Utils/CMakeLists.txt+5
@@ -27,3 +27,8 @@ run_tests(
27 qsortfilterproxymodeltest
27 qsortfilterproxymodeltest
28 timeformattertest
28 timeformattertest
29 )
29 )
30+
31+# plain qml test
32+set(qmltest_DEFAULT_TARGETS qmltests)
33+set(qmltest_DEFAULT_PROPERTIES ENVIRONMENT "QT_QPA_PLATFORM=minimal")
34+add_qml_test(. UtilsStyle IMPORT_PATHS ${CMAKE_BINARY_DIR}/plugins)
tests/plugins/Utils/tst_UtilsStyle.qmlnew file+47
@@ -0,0 +1,47 @@
1+/*
2+ * Copyright (C) 2014 Canonical, Ltd.
3+ *
4+ * This program is free software; you can redistribute it and/or modify
5+ * it under the terms of the GNU General Public License as published by
6+ * the Free Software Foundation; version 3.
7+ *
8+ * This program is distributed in the hope that it will be useful,
9+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
10+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11+ * GNU General Public License for more details.
12+ *
13+ * You should have received a copy of the GNU General Public License
14+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
15+ */
16+
17+import QtQuick 2.2
18+import QtTest 1.0
19+import Utils 0.1
20+
21+TestCase {
22+ id: testCase
23+ name: "UtilsStyle"
24+
25+ property color color
26+
27+ function test_luminance_data() {
28+ return [
29+ { tag: "#F00", luminance: 0.2126 },
30+ { tag: "#0F0", luminance: 0.7152 },
31+ { tag: "#00F", luminance: 0.0722 },
32+ { tag: "white", luminance: 1.0 },
33+ { tag: "black", luminance: 0.0 },
34+ { tag: "lightgrey", luminance: 0.8275 },
35+ { tag: "grey", luminance: 0.5020 },
36+ { tag: "darkgrey", luminance: 0.6627 },
37+ { tag: "red", luminance: 0.2126 },
38+ { tag: "green", luminance: 0.3590 },
39+ { tag: "blue", luminance: 0.0722 },
40+ ];
41+ }
42+
43+ function test_luminance(data) {
44+ testCase.color = data.tag;
45+ compare(Style.luminance(testCase.color).toFixed(4), data.luminance.toFixed(4));
46+ }
47+}