Merge lp:~zsombi/ubuntu-ui-toolkit/app-theming into lp:ubuntu-ui-toolkit/rtm

[Zsombor Egri]

Fixing application theming discarded due to auto-theming from MainViewStyle.
Auto-theming moved into MainView and it is applied only on system themes.
Binding loops caused by the auto-theming fixed.
Support for the deprecated SuruGradient theme removed. SuruDark or Ambiance should be used in all appropriate cases.

[Cris Dywan (kalikiana)]

I like it. Not only is the binding loop gone, the colors are also applied consistently on start-up as well as later at runtime.

One thing: the example like that won't be easily importable into QtCreator. But no reason to block on that, to be honest we're not having much of a policy with regard to that anyway and it'll need more discussion.

review: Approve

[Tim Peeters (tpeeters)]

nice!

review: Approve (quick look)

[lp:~zsombi/ubuntu-ui-toolkit/app-theming]

1134. By Zsombor Egri on 2014-12-03

roll back unnecessary change on theme not found warning

Unmerged revisions

1134. By Zsombor Egri on 2014-12-03

roll back unnecessary change on theme not found warning

1133. By Zsombor Egri on 2014-11-27

more tests added

1132. By Zsombor Egri on 2014-11-27

fixing application theme loading; automatic theme change from style transferred to MainView and made system theme dependent, fixed binding loops and ones detected by Valgrind, also causing application themes to be discarded.

=== added directory 'examples/customtheme'
=== added file 'examples/customtheme/customtheme.apparmor'
--- examples/customtheme/customtheme.apparmor	1970-01-01 00:00:00 +0000
+++ examples/customtheme/customtheme.apparmor	2014-12-03 06:57:14 +0000
@@ -0,0 +1,8 @@
+{
+    "policy_groups": [
+        "networking"
+    ],
+    "policy_version": 1.2
+}
+
+

=== added file 'examples/customtheme/customtheme.desktop'
--- examples/customtheme/customtheme.desktop	1970-01-01 00:00:00 +0000
+++ examples/customtheme/customtheme.desktop	2014-12-03 06:57:14 +0000
@@ -0,0 +1,8 @@
+[Desktop Entry]
+Name=customtheme
+Exec=qmlscene $@ main.qml
+Icon=customtheme.png
+Terminal=false
+Type=Application
+X-Ubuntu-Touch=true
+

=== added file 'examples/customtheme/customtheme.png'
Binary files examples/customtheme/customtheme.png	1970-01-01 00:00:00 +0000 and examples/customtheme/customtheme.png	2014-12-03 06:57:14 +0000 differ
=== added file 'examples/customtheme/customtheme.qmlproject'
--- examples/customtheme/customtheme.qmlproject	1970-01-01 00:00:00 +0000
+++ examples/customtheme/customtheme.qmlproject	2014-12-03 06:57:14 +0000
@@ -0,0 +1,59 @@
+import QmlProject 1.1
+
+Project {
+    mainFile: "main.qml"
+
+    /* Include .qml, .js, and image files from current directory and subdirectories */
+    QmlFiles {
+        directory: "."
+    }
+    JavaScriptFiles {
+        directory: "."
+    }
+    ImageFiles {
+        directory: "."
+    }
+    Files {
+        filter: "*.desktop"
+    }
+    Files {
+        filter: "www/*.html"
+    }
+    Files {
+        filter: "Makefile"
+    }
+    Files {
+        filter: "*.apparmor"
+    }
+    Files {
+        directory: "."
+        paths: ["manifest.json",".excludes"]
+    }
+    Files {
+        directory: "www"
+        filter: "*"
+    }
+    Files {
+        directory: "www/img/"
+        filter: "*"
+    }
+    Files {
+        directory: "www/css/"
+        filter: "*"
+    }
+    Files {
+        directory: "www/js/"
+        filter: "*"
+    }
+    Files {
+        directory: "tests/"
+        filter: "*"
+    }
+    Files {
+        directory: "debian"
+        filter: "*"
+    }
+    /* List of plugin directories passed to QML runtime */
+    importPaths: [ "." ,"/usr/bin","/usr/lib/x86_64-linux-gnu/qt5/qml" ]
+}
+

=== added file 'examples/customtheme/main.qml'
--- examples/customtheme/main.qml	1970-01-01 00:00:00 +0000
+++ examples/customtheme/main.qml	2014-12-03 06:57:14 +0000
@@ -0,0 +1,103 @@
+/*
+ * Copyright 2014 Canonical Ltd.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation; version 3.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.0
+import Ubuntu.Components 1.1
+
+/*!
+    \brief MainView with a Label and Button elements.
+*/
+
+MainView {
+    id: mainView
+    // objectName for functional testing purposes (autopilot-qt5)
+    objectName: "mainView"
+
+    // Note! applicationName needs to match the "name" field of the click manifest
+    applicationName: "customtheme"
+
+    /*
+     This property enables the application to change orientation
+     when the device is rotated. The default is false.
+    */
+    //automaticOrientation: true
+
+    // Removes the old toolbar and enables new features of the new header.
+    useDeprecatedToolbar: false
+
+    width: units.gu(100)
+    height: units.gu(75)
+
+    Component.onCompleted: Theme.name = "theme"
+
+    Page {
+        title: i18n.tr("Theme sample")
+
+        Column {
+            spacing: units.gu(1)
+            anchors {
+                margins: units.gu(2)
+                fill: parent
+            }
+
+            Label {
+                text: i18n.tr("Theme.name:") + " " + Theme.name
+            }
+
+            Button {
+                width: parent.width
+                text: i18n.tr("Light background")
+
+                onClicked: {
+                    mainView.backgroundColor = "white";
+                }
+            }
+            Button {
+                width: parent.width
+                text: i18n.tr("Dark background")
+
+                onClicked: {
+                    mainView.backgroundColor = "blue";
+                }
+            }
+            Button {
+                width: parent.width
+                text: i18n.tr("Set Ambiance theme")
+
+                onClicked: {
+                    Theme.name = "Ubuntu.Components.Themes.Ambiance";
+                }
+            }
+            Button {
+                width: parent.width
+                text: i18n.tr("Set SuruDark theme")
+
+                onClicked: {
+                    Theme.name = "Ubuntu.Components.Themes.SuruDark";
+                }
+            }
+            Button {
+                width: parent.width
+                text: i18n.tr("Application theme")
+
+                onClicked: {
+                    Theme.name = "theme";
+                }
+            }
+        }
+    }
+}
+

=== added file 'examples/customtheme/manifest.json'
--- examples/customtheme/manifest.json	1970-01-01 00:00:00 +0000
+++ examples/customtheme/manifest.json	2014-12-03 06:57:14 +0000
@@ -0,0 +1,15 @@
+{
+    "architecture": "all",
+    "description": "description of customtheme",
+    "framework": "ubuntu-sdk-14.10-dev2",
+    "hooks": {
+        "customtheme": {
+            "apparmor": "customtheme.apparmor",
+            "desktop": "customtheme.desktop"
+        }
+    },
+    "maintainer": "Zsombor Egri <[e-mail]>",
+    "name": "customtheme",
+    "title": "customtheme",
+    "version": "0.1"
+}

=== added directory 'examples/customtheme/theme'
=== added file 'examples/customtheme/theme/Palette.qml'
--- examples/customtheme/theme/Palette.qml	1970-01-01 00:00:00 +0000
+++ examples/customtheme/theme/Palette.qml	2014-12-03 06:57:14 +0000
@@ -0,0 +1,24 @@
+/*
+ * Copyright 2014 Canonical Ltd.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation; version 3.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.0
+import Ubuntu.Components 1.1
+import Ubuntu.Components.Themes.SuruDark 1.1 as Suru
+
+Suru.Palette {
+    normal.background: "#A21E1C"
+    selected.backgroundText: "lightblue"
+}

=== added file 'examples/customtheme/theme/parent_theme'
--- examples/customtheme/theme/parent_theme	1970-01-01 00:00:00 +0000
+++ examples/customtheme/theme/parent_theme	2014-12-03 06:57:14 +0000
@@ -0,0 +1,1 @@
+Ubuntu.Components.Themes.SuruDark

=== modified file 'modules/Ubuntu/Components/MainView.qml'
--- modules/Ubuntu/Components/MainView.qml	2014-10-06 13:55:39 +0000
+++ modules/Ubuntu/Components/MainView.qml	2014-12-03 06:57:14 +0000
@@ -207,6 +207,22 @@
         property color headerColor: backgroundColor
         property color backgroundColor: Theme.palette.normal.background
         property color footerColor: backgroundColor
+
+        /*
+          As we don't know the order the property bindings and onXXXChanged signals are evaluated
+          we should rely only on one property when changing the theme to avoid intermediate
+          theme changes due to properties being evaluated separately.
+
+          Qt bug: https://bugreports.qt-project.org/browse/QTBUG-11712
+          */
+        property string theme: (ColorUtils.luminance(backgroundColor) >= 0.85) ?
+                                   "Ambiance" : "SuruDark"
+        onThemeChanged: {
+            // only change the theme if the current one is a system one.
+            if (theme !== "" && (Theme.name.search("Ubuntu.Components.Themes") >= 0)) {
+                Theme.name = "Ubuntu.Components.Themes.%1".arg(theme);
+            }
+        }
     }
 
     /*!

=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/MainViewStyle.qml'
--- modules/Ubuntu/Components/Themes/Ambiance/MainViewStyle.qml	2014-08-21 19:40:18 +0000
+++ modules/Ubuntu/Components/Themes/Ambiance/MainViewStyle.qml	2014-12-03 06:57:14 +0000
@@ -55,22 +55,5 @@
         id: internals
         property bool isGradient: styledItem.backgroundColor != styledItem.headerColor ||
                                   styledItem.backgroundColor != styledItem.footerColor
-        /*
-          As we don't know the order the property bindings and onXXXChanged signals are evaluated
-          we should rely only on one property when changing the theme to avoid intermediate
-          theme changes due to properties being evaluated separately.
-
-          Qt bug: https://bugreports.qt-project.org/browse/QTBUG-11712
-          */
-        property string theme: (ColorUtils.luminance(styledItem.backgroundColor) >= 0.85) ? "Ambiance" :
-                                (isGradient ? "SuruGradient" : "SuruDark")
-    }
-
-    // automatically select the appropriate theme depending on the background colors
-    Binding {
-        target: Theme
-        property: "name"
-        value: "Ubuntu.Components.Themes.%1".arg(internals.theme)
-        when: internals.theme !== ""
     }
 }

=== modified file 'modules/Ubuntu/Components/plugin/uctheme.cpp'
--- modules/Ubuntu/Components/plugin/uctheme.cpp	2014-06-26 15:24:06 +0000
+++ modules/Ubuntu/Components/plugin/uctheme.cpp	2014-12-03 06:57:14 +0000
@@ -101,6 +101,8 @@
     }
     // append standard QML2_IMPORT_PATH value
     result << QLibraryInfo::location(QLibraryInfo::Qml2ImportsPath);
+    // prepend current folder
+    result.prepend(QDir::currentPath());
     return result;
 }
 
@@ -134,7 +136,7 @@
 
     QStringList paths = themeSearchPath();
     Q_FOREACH(const QString &path, paths) {
-        if (QDir(path).exists()) {
+        if (QDir(path).exists() && !m_engine->importPathList().contains(path)) {
             m_engine->addImportPath(path);
         }
     }
@@ -230,7 +232,7 @@
     QString parentTheme;
     QUrl themePath = pathFromThemeName(themeName);
     if (!themePath.isValid()) {
-        qWarning() << UbuntuI18n::instance().tr("Theme not found: ") << themeName;
+        qWarning() << UbuntuI18n::instance().tr("Theme not found: \"%1\"").arg(themeName);
     } else {
         QFile file(themePath.resolved(PARENT_THEME_FILE).toLocalFile());
         if (file.open(QIODevice::ReadOnly | QIODevice::Text)) {

=== added file 'tests/unit_x11/tst_components/tst_theming.qml'
--- tests/unit_x11/tst_components/tst_theming.qml	1970-01-01 00:00:00 +0000
+++ tests/unit_x11/tst_components/tst_theming.qml	2014-12-03 06:57:14 +0000
@@ -0,0 +1,60 @@
+/*
+ * Copyright 2012 Canonical Ltd.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation; version 3.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.0
+import QtTest 1.0
+import Ubuntu.Components 1.1
+import Ubuntu.Test 1.0
+
+MainView {
+    id: mainView
+    width: units.gu(50)
+    height: units.gu(10)
+
+    useDeprecatedToolbar: false
+
+    UbuntuTestCase {
+        when: windowShown
+
+        SignalSpy {
+            id: themeSpy
+            signalName: "paletteChanged"
+            target: Theme
+        }
+
+        function cleanup() {
+            themeSpy.clear();
+        }
+
+        function test_backgroundcolor_change_data() {
+            return [
+                {tag: "Light color", oldTheme: "Ubuntu.Components.Themes.SuruDark", newTheme: "Ubuntu.Components.Themes.Ambiance", color: "white"},
+                {tag: "Dark color", oldTheme: "Ubuntu.Components.Themes.Ambiance", newTheme: "Ubuntu.Components.Themes.SuruDark", color: "blue"},
+            ];
+        }
+        function test_backgroundcolor_change(data) {
+            if (data.oldTheme !== Theme.name) {
+                Theme.name = data.oldTheme;
+                themeSpy.wait();
+            }
+            // change color;
+            themeSpy.clear();
+            mainView.backgroundColor = data.color;
+            themeSpy.wait();
+            compare(Theme.name, data.newTheme, "Theme not chnaged");
+        }
+    }
+}

=== added directory 'tests/unit_x11/tst_theme_engine/AppTheme'
=== added file 'tests/unit_x11/tst_theme_engine/AppTheme/Palette.qml'
--- tests/unit_x11/tst_theme_engine/AppTheme/Palette.qml	1970-01-01 00:00:00 +0000
+++ tests/unit_x11/tst_theme_engine/AppTheme/Palette.qml	2014-12-03 06:57:14 +0000
@@ -0,0 +1,24 @@
+/*
+ * Copyright 2014 Canonical Ltd.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation; version 3.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.0
+import Ubuntu.Components 1.1
+import Ubuntu.Components.Themes.SuruDark 1.1 as Suru
+
+Suru.Palette {
+    normal.background: "#A21E1C"
+    selected.backgroundText: "lightblue"
+}

=== added file 'tests/unit_x11/tst_theme_engine/AppTheme/parent_theme'
--- tests/unit_x11/tst_theme_engine/AppTheme/parent_theme	1970-01-01 00:00:00 +0000
+++ tests/unit_x11/tst_theme_engine/AppTheme/parent_theme	2014-12-03 06:57:14 +0000
@@ -0,0 +1,1 @@
+Ubuntu.Components.Themes.SuruDark

=== added file 'tests/unit_x11/tst_theme_engine/TestApp.qml'
--- tests/unit_x11/tst_theme_engine/TestApp.qml	1970-01-01 00:00:00 +0000
+++ tests/unit_x11/tst_theme_engine/TestApp.qml	2014-12-03 06:57:14 +0000
@@ -0,0 +1,29 @@
+/*
+ * Copyright 2014 Canonical Ltd.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation; version 3.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.0
+import Ubuntu.Components 1.1
+
+MainView {
+    width: units.gu(40)
+    height: units.gu(71)
+
+    Component.onCompleted: Theme.name = "AppTheme"
+
+    Label {
+        objectName: "test_label"
+    }
+}

=== modified file 'tests/unit_x11/tst_theme_engine/tst_theme_engine.pro'
--- tests/unit_x11/tst_theme_engine/tst_theme_engine.pro	2013-07-01 16:01:20 +0000
+++ tests/unit_x11/tst_theme_engine/tst_theme_engine.pro	2014-12-03 06:57:14 +0000
@@ -1,5 +1,7 @@
 include(../test-include.pri)
+QT += quick-private gui-private
 SOURCES += tst_theme_enginetest.cpp
 
 OTHER_FILES += \
-    TestStyle.qml
+    TestStyle.qml \
+    TestApp.qml

=== modified file 'tests/unit_x11/tst_theme_engine/tst_theme_enginetest.cpp'
--- tests/unit_x11/tst_theme_engine/tst_theme_enginetest.cpp	2014-03-28 17:02:52 +0000
+++ tests/unit_x11/tst_theme_engine/tst_theme_enginetest.cpp	2014-12-03 06:57:14 +0000
@@ -20,6 +20,8 @@
 #include <QtQml/QQmlEngine>
 #include <QtQml/QQmlComponent>
 #include "uctheme.h"
+#include "uctestcase.h"
+#include <private/qquicktext_p.h>
 
 Q_DECLARE_METATYPE(QList<QQmlError>)
 
@@ -42,6 +44,7 @@
     void testThemesRelativePathWithParentXDGDATA();
     void testThemesRelativePathWithParentNoVariablesSet();
     void testThemesRelativePathWithParentOneXDGPathSet();
+    void testAppTheme();
 };
 
 void tst_UCTheme::initTestCase()
@@ -180,7 +183,18 @@
     QQmlComponent* component = theme.createStyleComponent("TestStyle.qml", parent);
 
     QCOMPARE(component != NULL, true);
-    QCOMPARE(component->status(), QQmlComponent::Ready);}
+    QCOMPARE(component->status(), QQmlComponent::Ready);
+}
+
+void tst_UCTheme::testAppTheme()
+{
+    QScopedPointer<UbuntuTestCase> test(new UbuntuTestCase("TestApp.qml"));
+    QColor backgroundColor = test->rootObject()->property("backgroundColor").value<QColor>();
+    QCOMPARE(backgroundColor, QColor("#A21E1C"));
+    QQuickText *label = test->findItem<QQuickText*>("test_label");
+    QVERIFY(label);
+    QCOMPARE(label->color(), QColor("lightblue"));
+}
 
 QTEST_MAIN(tst_UCTheme)