StudioPlugin: Revamp splash screen

* "Learn More" links to Qt Privacy policy webpage
* Size changed
* Design adjusted
* The user now can choose between sending data and not sending data
* The screen closes after the user chooses one of the options using
  a button.

Task-number: QDS-6617
Change-Id: I8729f1bb6f9e7b74c6da8f1d62a4fc04456175c8
Reviewed-by: Alessandro Portale <alessandro.portale@qt.io>

src/plugins/studiowelcome/qml/splashscreen/CustomButton.ui.qml

@@ -0,0 +1,108 @@
+/****************************************************************************
+**
+** Copyright (C) 2022 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of Qt Creator.
+**
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU
+** General Public License version 3 as published by the Free Software
+** Foundation with exceptions as appearing in the file LICENSE.GPL3-EXCEPT
+** included in the packaging of this file. Please review the following
+** information to ensure the GNU General Public License requirements will
+** be met: https://www.gnu.org/licenses/gpl-3.0.html.
+**
+****************************************************************************/
+
+/*
+This is a UI file (.ui.qml) that is intended to be edited in Qt Design Studio only.
+It is supposed to be strictly declarative and only uses a subset of QML. If you edit
+this file manually, you might introduce QML code that is not supported by Qt Design Studio.
+Check out https://doc.qt.io/qtcreator/creator-quick-ui-forms.html for details on .ui.qml files.
+*/
+import QtQuick 2.15
+import QtQuick.Templates 2.15
+import StudioFonts 1.0
+
+Button {
+    id: control
+
+    implicitWidth: Math.max(
+                       buttonBackground ? buttonBackground.implicitWidth : 0,
+                       textItem.implicitWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(
+                        buttonBackground ? buttonBackground.implicitHeight : 0,
+                        textItem.implicitHeight + topPadding + bottomPadding)
+    leftPadding: 16
+    rightPadding: 16
+
+    text: "My Button"
+
+    font.family: StudioFonts.titilliumWeb_light
+
+    //property color accentColor: "#047eff"
+    property color accentColor: "#126491"
+
+    background: buttonBackground
+    Rectangle {
+        id: buttonBackground
+        color: "#00000000"
+        implicitWidth: 100
+        implicitHeight: 40
+        opacity: enabled ? 1 : 0.3
+        radius: 2
+        border.color: control.accentColor
+    }
+
+    contentItem: textItem
+    Text {
+        id: textItem
+        text: control.text
+
+        opacity: enabled ? 1.0 : 0.3
+        color: "#ffffff"
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+    }
+
+    states: [
+        State {
+            name: "normal"
+            when: !control.down
+
+            PropertyChanges {
+                target: buttonBackground
+                color: "#00000000"
+                border.color: control.accentColor
+            }
+
+            PropertyChanges {
+                target: textItem
+                color: "#ffffff"
+            }
+        },
+        State {
+            name: "down"
+            when: control.down
+            PropertyChanges {
+                target: textItem
+                color: "#ffffff"
+            }
+
+            PropertyChanges {
+                target: buttonBackground
+                color: control.accentColor
+                border.color: "#00000000"
+            }
+        }
+    ]
+}

src/plugins/studiowelcome/qml/splashscreen/Splash_Image25d.qml

@@ -29,7 +29,7 @@ Rectangle {
     id: splashBackground
     width: 460
     height: 480
-    color: "#11102d"
+    color: "transparent"
 
     layer.enabled: true
     layer.textureSize: Qt.size(width * 2, height * 2)
@@ -37,6 +37,7 @@ Rectangle {
 
     Item {
         id: composition
+        anchors.centerIn: parent
         width: 460
         height: 480
 
@@ -56,25 +57,4 @@ Rectangle {
             }
         }
     }
-
-    Image {
-        id: highlight
-        x: -56
-        y: -19
-        width: 520
-        height: 506
-        fillMode: Image.PreserveAspectFit
-        source: "welcome_windows/highlight.png"
-    }
-
-    Image {
-        id: hand
-        x: 245
-        y: 227
-        width: 224
-        height: 264
-        visible: true
-        fillMode: Image.PreserveAspectFit
-        source: "welcome_windows/hand.png"
-    }
 }

src/plugins/studiowelcome/qml/splashscreen/Welcome_splash.qml

@@ -32,8 +32,7 @@ import usagestatistics 1.0
 
 Rectangle {
     id: welcome_splash
-    width: 800
+    anchors.fill: parent
-    height: 480
 
     gradient: Gradient {
         orientation: Gradient.Horizontal
@@ -46,43 +45,27 @@ Rectangle {
     signal closeClicked
     signal configureClicked
 
-    property alias doNotShowAgain: doNotShowCheckBox.checked
+    property bool doNotShowAgain: true
     property bool loadingPlugins: true
-
+    color: "#1d212a"
-    // called from C++
-    function onPluginInitialized(crashReportingEnabled: bool, crashReportingOn: bool)
-    {
-        loadingPlugins = false
-
-        if (crashReportingEnabled) {
-            var configureButton = "<a href='#' style='text-decoration:none;color:#ffff00'>"
-                    + qsTr("[Configure]") + "</a>";
-            var settingPath = Qt.platform.os === "osx"
-                    ? qsTr("Qt Creator > Preferences > Environment > System")
-                    : qsTr("Tools > Options > Environment > System")
-            var strConfigure = qsTr("Qt Design Studio collects usage statistics and crash reports for the sole purpose of fixing bugs and improving the tool. "
-                             + "You can configure the crash reporter under %1. %2").arg(settingPath).arg(configureButton)
-
-            crash_reporting_text.text = strConfigure
-            crashReportCheckBox.visible = true
-        }
-    }
 
     Image {
         id: logo
-        x: 15
+        anchors.top: parent.top
-        y: 11
+        anchors.left: parent.left
-        width: 66
+        anchors.margins: 10
-        height: 50
+        width: 66 * 2
+        height: 50 * 2
+        smooth: true
         source: "welcome_windows/logo.png"
     }
 
+
     Text {
-        id: qt_design_studio
+        id: qt_design_studio_text
-        x: 13
+        anchors.top: logo.top
-        y: 81
+        anchors.left: logo.right
-        width: 336
+        anchors.leftMargin: 10
-        height: 46
         color: "#25709a"
         text: qsTr("Qt Design Studio")
         font.pixelSize: 36
@@ -90,156 +73,89 @@ Rectangle {
     }
 
     Text {
-        id: software_for_ui
+        id: qt_design_studio_version_text
-        x: 15
+        anchors.left: qt_design_studio_text.right
-        y: 126
+        anchors.baseline: qt_design_studio_text.baseline
-        width: 300
+        anchors.leftMargin: 10
-        height: 30
+        color: "#25709a"
-        color: "#ffffff"
+        text: usageStatisticModel.version
-        text: qsTr("Software for UI and UX Designers")
+
-        renderType: Text.QtRendering
-        font.pixelSize: 15
         font.family: StudioFonts.titilliumWeb_light
+        font.pixelSize: 36
     }
 
     Text {
-        id: copyright
+        id: license_variant_text
-        x: 15
+        anchors.left: qt_design_studio_text.left
-        y: 155
+        anchors.top: qt_design_studio_text.bottom
-        width: 270
+        anchors.leftMargin: 5
-        height: 24
         color: "#ffffff"
-        text: qsTr("Copyright 2008 - 2022 The Qt Company")
-        font.pixelSize: 14
-        font.family: StudioFonts.titilliumWeb_light
-    }
 
-    Text {
-        id: all_rights_reserved
-        x: 15
-        y: 174
-        width: 250
-        height: 24
-        color: "#ffffff"
-        text: qsTr("All Rights Reserved")
-        font.pixelSize: 14
         font.family: StudioFonts.titilliumWeb_light
-    }
+        font.pixelSize: 20
 
-    Text {
+        text: {
-        id: marketing_1
+            if (projectModel.communityVersion)
-        x: 15
+                return qsTr("Community Edition")
-        y: 206
+            if (projectModel.enterpriseVersion)
-        width: 406
+                return qsTr("Enterprise Edition")
-        height: 31
+            return qsTr("Professional Edition")
-        color: "#ffffff"
+        }
-        text: qsTr("Multi-paradigm language for creating highly dynamic applications.")
-        wrapMode: Text.WordWrap
-        font.family: StudioFonts.titilliumWeb_light
-        font.pixelSize: 12
-        font.wordSpacing: 0
-    }
 
-    Text {
+        ProjectModel {
-        id: marketing_2
+            id: projectModel
-        x: 15
+        }
-        y: 229
-        width: 341
-        height: 31
-        color: "#ffffff"
-        text: qsTr("Run your concepts and prototypes on your final hardware.")
-        wrapMode: Text.WordWrap
-        font.family: StudioFonts.titilliumWeb_light
-        font.pixelSize: 12
-        font.wordSpacing: 0
-    }
 
-    Text {
+        UsageStatisticModel {
-        id: marketing_3
+            id: usageStatisticModel
-        x: 15
-        y: 252
-        width: 336
-        height: 31
-        color: "#ffffff"
-        text: qsTr("Seamless integration between designer and developer.")
-        wrapMode: Text.WordWrap
-        font.family: StudioFonts.titilliumWeb_light
-        font.pixelSize: 12
-        font.wordSpacing: 0
-    }
-
-    Text {
-        id: crash_reporting_text
-        color: "#ffffff"
-        anchors.bottom: columnLayout.top
-        textFormat: Text.RichText
-        x: 15
-        y: 280
-        width: 311
-        wrapMode: Text.WordWrap
-        anchors.bottomMargin: 8
-        font.family: StudioFonts.titilliumWeb_light
-        font.pixelSize: 12
-        font.wordSpacing: 0
-        onLinkActivated: welcome_splash.configureClicked()
-
-        MouseArea { // show hand cursor on link hover
-            anchors.fill: parent
-            acceptedButtons: Qt.NoButton // don't eat clicks on the Text
-            cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : Qt.ArrowCursor
         }
     }
 
     Dof_Effect {
-        id: dof_Effect
+        id: dof_effect
-        x: 358
+        anchors.top: qt_design_studio_text.bottom
+        anchors.horizontalCenter: welcome_splash.horizontalCenter
         width: 442
         height: 480
-        visible: true
         maskBlurSamples: 64
         maskBlurRadius: 32
 
         Splash_Image25d {
             id: animated_artwork
-            x: 358
+            width: dof_effect.width
-            y: 0
+            height: dof_effect.height
-            width: 442
-            height: 480
             clip: true
         }
     }
 
-    Image {
+    Text {
-        id: close_window
+        id: help_us_text
-        anchors.top: parent.top
+        anchors.left: welcome_splash.left
         anchors.right: parent.right
-        anchors.margins: 8
+        anchors.leftMargin: 10
-        width: 13
+        anchors.top: dof_effect.bottom
-        height: 13
+        anchors.topMargin: 10
-        fillMode: Image.PreserveAspectFit
+        color: "#FFFFFF"
-        source: "welcome_windows/close.png"
+        text: qsTr("Before we let you move on to your wonderful designs, help us make Qt Design Studio even better by letting us know how you're using it.")
-        opacity: area.containsMouse ? 1 : 0.8
 
-        MouseArea {
+        font.family: StudioFonts.titilliumWeb_light
-            id: area
+        font.pixelSize: 18
-            hoverEnabled: true
+        wrapMode: Text.WordWrap
-            anchors.fill: parent
+        anchors.rightMargin: 10
-            anchors.margins: -10
-            onClicked: welcome_splash.closeClicked()
-        }
     }
 
     ColumnLayout {
         id: columnLayout
         anchors.left: parent.left
-        anchors.bottom: parent.bottom
+        anchors.top: help_us_text.bottom
-        anchors.leftMargin: 16
+        anchors.leftMargin: 10
-        anchors.bottomMargin: 10
+        anchors.topMargin: 20
         spacing: 3
 
         CheckBox {
+            visible: false
             id: usageStatisticCheckBox
-            text: qsTr("Enable Usage Statistics")
+            text: qsTr("Send Usage Statistics")
             checked: usageStatisticModel.usageStatisticEnabled
             padding: 0
             spacing: 12
@@ -255,11 +171,11 @@ Rectangle {
         }
 
         CheckBox {
+            visible: false
             id: crashReportCheckBox
-            text: qsTr("Enable Crash Reports")
+            text: qsTr("Send Crash Reports")
             spacing: 12
             checked: usageStatisticModel.crashReporterEnabled
-            visible: false
 
             onCheckedChanged: {
                 usageStatisticModel.setCrashReporterEnabled(crashReportCheckBox.checked)
@@ -274,90 +190,41 @@ Rectangle {
             }
             padding: 0
         }
-
-        CheckBox {
-            id: doNotShowCheckBox
-            text: qsTr("Do not show this again")
-            padding: 0
-            spacing: 12
-
-            contentItem: Text {
-                text: doNotShowCheckBox.text
-                color: "#ffffff"
-                leftPadding: doNotShowCheckBox.indicator.width + doNotShowCheckBox.spacing
-                font.pixelSize: 12
-            }
-        }
     }
 
     RowLayout {
-        x: 16
+        anchors.right: parent.right
-        y: 277
+        anchors.bottom: welcome_splash.bottom
-        visible: welcome_splash.loadingPlugins
+        anchors.rightMargin: 10
+        anchors.bottomMargin: 10
+        spacing: 20
 
-        Text {
+        CustomButton {
-            id: text1
+            text: qsTr("Don't send")
-            color: "#ffffff"
+            onClicked: {
-            text: qsTr("%")
+                usageStatisticModel.setTelemetryEnabled(false)
-            font.pixelSize: 12
+                usageStatisticModel.setCrashReporterEnabled(false)
-
+                welcome_splash.closeClicked()
-            RotationAnimator {
-                target: text1
-                from: 0
-                to: 360
-                duration: 1800
-                running: true
-                loops: -1
             }
         }
 
-        Text {
+        CustomButton {
-            id: loading_progress
+            text: qsTr("Send analytics data")
-            color: "#ffffff"
+            onClicked: {
-            text: qsTr("Loading Plugins")
+                usageStatisticModel.setTelemetryEnabled(true)
-            font.family: StudioFonts.titilliumWeb_light
+                usageStatisticModel.setCrashReporterEnabled(true)
-            font.pixelSize: 16
+                welcome_splash.closeClicked()
-        }
-
-        Text {
-            id: text2
-            color: "#ffffff"
-            text: qsTr("%")
-            font.pixelSize: 12
-
-            RotationAnimator {
-                target: text2
-                from: 0
-                to: 360
-                duration: 2000
-                running: true
-                loops: -1
             }
         }
     }
 
-    Text {
+    CustomButton {
-        id: all_rights_reserved1
+        y: 430
-        x: 15
+        text: qsTr("Learn More")
-        y: 65
+        anchors.left: parent.left
-        color: "#ffffff"
+        anchors.bottom: parent.bottom
-
+        anchors.bottomMargin: 10
-        font.pixelSize: 13
+        anchors.leftMargin: 10
-        font.family: StudioFonts.titilliumWeb_light
+        onClicked: Qt.openUrlExternally("https://www.qt.io/terms-conditions/telemetry-privacy")
-        text: {
-            if (projectModel.communityVersion)
-                return qsTr("Community Edition")
-            if (projectModel.enterpriseVersion)
-                 return qsTr("Enterprise Edition")
-            return qsTr("Professional Edition")
-        }
-
-        ProjectModel {
-            id: projectModel
-        }
-
-        UsageStatisticModel {
-            id: usageStatisticModel
-        }
     }
 }

src/plugins/studiowelcome/qml/splashscreen/main.qml

@@ -27,8 +27,8 @@ import QtQuick 2.0
 
 Item {
     id: root
-    width: 800
+    width: 720
-    height: 480
+    height: 720
 
     signal closeClicked
     signal checkBoxToggled

src/plugins/studiowelcome/qml/welcomepage/mockData/usagestatistics/UsageStatisticModel.qml

@@ -27,4 +27,5 @@ import QtQuick 2.0
 
 QtObject {
     property bool usageStatisticEnabled: false
+    property string version: "3.3.0"
 }

src/plugins/studiowelcome/studiowelcomeplugin.cpp

@@ -134,11 +134,13 @@ class UsageStatisticPluginModel : public QObject
 
     Q_PROPERTY(bool usageStatisticEnabled MEMBER m_usageStatisticEnabled NOTIFY usageStatisticChanged)
     Q_PROPERTY(bool crashReporterEnabled MEMBER m_crashReporterEnabled NOTIFY crashReporterEnabledChanged)
+    Q_PROPERTY(QString version MEMBER m_versionString CONSTANT)
 
 public:
     explicit UsageStatisticPluginModel(QObject *parent = nullptr)
         : QObject(parent)
     {
+        m_versionString = Core::Constants::IDE_VERSION_DISPLAY;
         setupModel();
     }
 
@@ -191,6 +193,7 @@ signals:
 private:
     bool m_usageStatisticEnabled = false;
     bool m_crashReporterEnabled = false;
+    QString m_versionString;
 };
 
 class ProjectModel : public QAbstractListModel
@@ -620,17 +623,6 @@ bool StudioWelcomePlugin::delayedInitialize()
 
     QTC_ASSERT(s_view->rootObject(), return true);
 
-#ifdef ENABLE_CRASHPAD
-    const bool crashReportingEnabled = true;
-    const bool crashReportingOn = Core::ICore::settings()->value(CRASH_REPORTER_SETTING, false).toBool();
-#else
-    const bool crashReportingEnabled = false;
-    const bool crashReportingOn = false;
-#endif
-
-    QMetaObject::invokeMethod(s_view->rootObject(), "onPluginInitialized",
-            Q_ARG(bool, crashReportingEnabled), Q_ARG(bool, crashReportingOn));
-
     return false;
 }